Include CdkDragDrop

src/app/degree-planner/shared/shared.module.ts

 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { CourseItemComponent } from './course-item/course-item.component';
+import { DragDropModule } from '@angular/cdk/drag-drop';
 
 @NgModule({
-	imports: [ CommonModule ],
-	exports: [ CourseItemComponent ],
+	imports: [ CommonModule, DragDropModule ],
+	exports: [ CourseItemComponent, DragDropModule ],
 	declarations: [ CourseItemComponent ]
 })
 

src/app/degree-planner/term-container/term-container.component.html

@@ -2,8 +2,8 @@
     <div fxLayout="row" fxLayoutAlign="space-between stretch">
         <h2>{{ term.termCode | getTermDescription }}</h2><p class="text-right semi-bold credits">Credits: 13</p>
     </div>
-    <div>
-        <app-course-item *ngFor="let course of courses" [course]="course" [status]="'complete'"></app-course-item>
+    <div cdkDropList>
+        <app-course-item *ngFor="let course of courses" [course]="course" [status]="'complete'" cdkDrag></app-course-item>
         <p *ngIf="!courses" class="no-courses text-center semi-bold">No Courses Taken</p>
     </div>
 </mat-card>
\ No newline at end of file

src/app/degree-planner/term-container/term-container.component.ts

 import { Component, Input } from '@angular/core';
 import { Term } from '../../core/models/term';
 import { Course } from '../../core/models/course';
+import { CdkDragDrop, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop';
 
 @Component({
 	selector: 'app-term-container',