diff --git a/src/components/Course/components/Navigation/index.svelte b/src/components/Course/components/Navigation/index.svelte
index cf8a22b0..7b3795bc 100644
--- a/src/components/Course/components/Navigation/index.svelte
+++ b/src/components/Course/components/Navigation/index.svelte
@@ -89,6 +89,11 @@
         to: getNavItemRoute($course.id, 'submissions'),
         hideSortIcon: true,
       },
+      {
+        label: 'Marks',
+        to: getNavItemRoute($course.id, 'marks'),
+        hideSortIcon: true,
+      },
       // {
       //   label: 'Scoreboard',
       //   to: getNavItemRoute($course.id, 'scoreboard'),
@@ -99,11 +104,11 @@
         to: getNavItemRoute($course.id, 'people'),
         hideSortIcon: true,
       },
-      // {
-      //   label: 'Timetable',
-      //   to: getNavItemRoute($course.id, 'timetable'),
-      //   hideSortIcon: true,
-      // },
+      {
+        label: 'Attendance',
+        to: getNavItemRoute($course.id, 'attendance'),
+        hideSortIcon: true,
+      },
     ];
   }
 </script>
diff --git a/src/routes/courses/[id]/attendance.svelte b/src/routes/courses/[id]/attendance.svelte
new file mode 100644
index 00000000..4d2647f4
--- /dev/null
+++ b/src/routes/courses/[id]/attendance.svelte
@@ -0,0 +1,35 @@
+<script context="module">
+  import { fetchCourse } from '../../../utils/services/courses';
+
+  export async function preload({ params }, session) {
+    if (process.browser) {
+      return {};
+    }
+
+    const {
+      data,
+      // error
+    } = await fetchCourse(params.id, session);
+
+    return { courseData: data };
+  }
+</script>
+
+<script>
+  import { onMount } from 'svelte';
+  import CourseContainer from '../../../components/CourseContainer/index.svelte';
+  import PageNav from '../../../components/PageNav/index.svelte';
+  import PageBody from '../../../components/PageBody/index.svelte';
+  import { setCourseData } from '../../../components/Course/store';
+
+  export let courseData = {};
+
+  onMount(() => {
+    setCourseData(courseData);
+  });
+</script>
+
+<CourseContainer>
+  <PageNav title="Attendance" />
+  <PageBody />
+</CourseContainer>
diff --git a/src/routes/courses/[id]/marks.svelte b/src/routes/courses/[id]/marks.svelte
new file mode 100644
index 00000000..71783afa
--- /dev/null
+++ b/src/routes/courses/[id]/marks.svelte
@@ -0,0 +1,35 @@
+<script context="module">
+  import { fetchCourse } from '../../../utils/services/courses';
+
+  export async function preload({ params }, session) {
+    if (process.browser) {
+      return {};
+    }
+
+    const {
+      data,
+      // error
+    } = await fetchCourse(params.id, session);
+
+    return { courseData: data };
+  }
+</script>
+
+<script>
+  import { onMount } from 'svelte';
+  import CourseContainer from '../../../components/CourseContainer/index.svelte';
+  import PageNav from '../../../components/PageNav/index.svelte';
+  import PageBody from '../../../components/PageBody/index.svelte';
+  import { setCourseData } from '../../../components/Course/store';
+
+  export let courseData = {};
+
+  onMount(() => {
+    setCourseData(courseData);
+  });
+</script>
+
+<CourseContainer>
+  <PageNav title="Marks" />
+  <PageBody />
+</CourseContainer>