diff --git a/backend/controllers/courseController.js b/backend/controllers/courseController.js
index 602f381..d28d600 100644
--- a/backend/controllers/courseController.js
+++ b/backend/controllers/courseController.js
@@ -1,3 +1,4 @@
+const { response } = require("express");
 const Course = require("../model/courseModel");
 const mongoose = require("mongoose");
 
@@ -18,6 +19,31 @@ const showCourse = async (req, res) => {
   });
 };
 
+
+
+//get course by name
+const courseByName = async (req, res) => {
+  const { id } = req.params;
+  console.log("getting course from ID: ", id);
+  
+  const course = await Course.find({faculty: id.substring(0,4), course_code: id.substring(4,8)}).exec()
+  
+
+  if (!course) {
+    return res.status(404).json({ error: "No such Course" });
+  }
+  if(course.length === 0){
+    return res.status(404).json({ error: "No such Course" });
+  }
+  res.status(200).json({
+    course
+  });
+  console.log(course)
+};
+
+
+
+
 //Gets all Courses
 const indexCourse = async (req, res) => {
   console.log("Getting all courses")
@@ -145,4 +171,4 @@ const updateCourse = async (req,res) => {
 
 
 
-module.exports = { showCourse, indexCourse,createCourse,deleteCourse,updateCourse };
+module.exports = { courseByName, showCourse, indexCourse,createCourse,deleteCourse,updateCourse };
diff --git a/backend/package.json b/backend/package.json
index 918e832..60813c0 100644
--- a/backend/package.json
+++ b/backend/package.json
@@ -1,4 +1,4 @@
-{
+{"proxy":"http://localhost:4000",
   "name": "backend",
   "version": "1.0.0",
   "description": "",
diff --git a/backend/routes/courses.js b/backend/routes/courses.js
index 782da6f..f73e81a 100644
--- a/backend/routes/courses.js
+++ b/backend/routes/courses.js
@@ -1,18 +1,11 @@
 const express = require("express");
 const router = express.Router();
-<<<<<<< HEAD
-const { showCourse, indexCourse,createCourse,deleteCourse,updateCourse } = require("../controllers/courseController");
+const { showCourse, indexCourse,createCourse,deleteCourse,updateCourse, courseByName } = require("../controllers/courseController");
 
 //get specified course
+router.get("/course/:id", courseByName)
 router.get("/:id", showCourse);
 router.get("/", indexCourse);
-=======
-const { getCourse, getAllCourses,createCourse,deleteCourse,updateCourse } = require("../controllers/courseController");
-
-//get specified course
-router.get("/:id", getCourse);
-router.get("/", getAllCourses);
->>>>>>> 7b546e4fa9a9a392bb17e31823b0d3f9348abbe8
 router.post("",createCourse)
 router.delete("/:id", deleteCourse)
 router.patch("/:id", updateCourse)
diff --git a/carleton-pathways/package.json b/carleton-pathways/package.json
index 893667d..63dcaa9 100644
--- a/carleton-pathways/package.json
+++ b/carleton-pathways/package.json
@@ -1,4 +1,5 @@
-{
+{ 
+  "proxy":"http://localhost:4000",
   "name": "carleton-pathways",
   "version": "0.1.0",
   "private": true,
diff --git a/carleton-pathways/src/components/courseHeader/CourseHeader.jsx b/carleton-pathways/src/components/courseHeader/CourseHeader.jsx
index 027ddcd..6511517 100644
--- a/carleton-pathways/src/components/courseHeader/CourseHeader.jsx
+++ b/carleton-pathways/src/components/courseHeader/CourseHeader.jsx
@@ -5,16 +5,20 @@ export default function CourseHeader(props) {
     <div className="bg-[#BA3C40] m-6 rounded-3xl">
       <div className="flex bg-[#D76767] rounded-3xl items-center pt-14 justify-center mb-2">
         <div className="flex-item m-4 font-header">
-          <div className="text-[36px] text-white">{props.course.faculty} {props.course.course_code}</div>
-          <div className="text-[20px] text-white ">{props.course.title}</div>
+          <div className="text-[36px] text-white">{props.course[0].faculty} {props.course[0].course_code}</div>
+          <div className="text-[20px] text-white ">{props.course[0].title}</div>
         </div>
         <div className="flex-item bg-[#CA464A] w-[66%] rounded-3xl text-center p-2 text-white sm:m-4">
           <div className="container text-white">
-            {props.course.description}
+          {props.course[0].section_information ? (
+            <p>{props.course[0].section_information}</p>
+          ) : (
+            <p>No description</p>
+          )}
           </div>
         </div>
       </div>
-    <div className="text-[16px] text-white text-center p-1">{props.course.prereqs}</div>
+    <div className="text-[16px] text-white text-center p-1">{props.course[0].prereq_string}</div>
     </div>
   );
 }
diff --git a/carleton-pathways/src/components/courseScheduleRowComponents/CourseDates.jsx b/carleton-pathways/src/components/courseScheduleRowComponents/CourseDates.jsx
index a6589ff..f31951b 100644
--- a/carleton-pathways/src/components/courseScheduleRowComponents/CourseDates.jsx
+++ b/carleton-pathways/src/components/courseScheduleRowComponents/CourseDates.jsx
@@ -2,11 +2,29 @@ import React from 'react'
 import Dates from './Dates'
 
 export default function CourseDates(props) {
+    const days = props.dates
+    for(let i =0; i<days.length; i++){
+        if (days[i] === "Monday"){
+            days[i] = "M"
+        }
+        if (days[i] === "Tuesday"){
+            days[i] = "T"
+        }
+        if (days[i] === "Wednesday"){
+            days[i] = "W"
+        }
+        if (days[i] === "Thursday"){
+            days[i] = "TH"
+        }
+        if (days[i] === "Friday"){
+            days[i] = "F"
+        }
+    }
   return (  
     <>
         {
-            ["M ", "T ", "W ", "T ", "F"].map((day) => {
-                if (props.dates.includes(day.replace(" ",""))){
+            ["M ", "T ", "W ", "TH ", "F"].map((day) => {
+                if (days.includes(day.replace(" ",""))){
                     return(<Dates date={day} highlighted={true}/>)
                 } else {
                     return(<Dates date={day} highlighted={false}/>)
diff --git a/carleton-pathways/src/components/courseScheduleRowComponents/CourseTime.jsx b/carleton-pathways/src/components/courseScheduleRowComponents/CourseTime.jsx
index 8053892..c9bae2a 100644
--- a/carleton-pathways/src/components/courseScheduleRowComponents/CourseTime.jsx
+++ b/carleton-pathways/src/components/courseScheduleRowComponents/CourseTime.jsx
@@ -1,7 +1,9 @@
 import React from 'react'
 
 export default function CourseTime(props) {
+  const time = props.course.start_time.slice(0, 5) + " - " + props.course.end_time.slice(0, 5)
+  
   return (
-    <span>{props.time}</span>
+    <span>{time}</span>
   )
 }
diff --git a/carleton-pathways/src/components/courseScheduleTable/CourseScheduleTable.jsx b/carleton-pathways/src/components/courseScheduleTable/CourseScheduleTable.jsx
index abcd5ed..ed00e99 100644
--- a/carleton-pathways/src/components/courseScheduleTable/CourseScheduleTable.jsx
+++ b/carleton-pathways/src/components/courseScheduleTable/CourseScheduleTable.jsx
@@ -8,7 +8,7 @@ import CourseInstructor from '../courseScheduleRowComponents/CourseInstructor'
 
 export default function CourseScheduleRow(props) {
   return (
-    
+      
     <table class = "font-table text-sm table-auto w-[85%] m-3">
       <thead class = "font-semibold">
         <tr>
@@ -20,30 +20,17 @@ export default function CourseScheduleRow(props) {
         <th>Instructor</th>
         </tr>
       </thead>
+      {props.course.map((course)=>(
       <tr>
-        <th class = "font-normal"><CourseSection section={props.course.section}/></th>
-        <th class = "font-normal"><CourseAvailability availability={props.course.availability}/></th>
-        <th class = "font-normal"><CourseTime time={props.course.time}/></th>
-        <th class = "font-normal"><CourseDates dates = {props.course.dates}/></th>
-        <th class = "font-normal"><CourseLocation location={props.course.location}/></th>
-        <th class = "font-normal"><CourseInstructor instructor={props.course.instructor}/></th>
-      </tr>
-      <tr>
-        <th class = "font-normal"><CourseSection section={props.course.section}/></th>
-        <th class = "font-normal"><CourseAvailability availability={props.course.availability}/></th>
-        <th class = "font-normal"><CourseTime time={props.course.time}/></th>
-        <th class = "font-normal"><CourseDates dates = {props.course.dates}/></th>
-        <th class = "font-normal"><CourseLocation location={props.course.location}/></th>
-        <th class = "font-normal"><CourseInstructor instructor={props.course.instructor}/></th>
-      </tr>
-      <tr>
-        <th class = "font-normal"><CourseSection section={props.course.section}/></th>
-        <th class = "font-normal"><CourseAvailability availability={props.course.availability}/></th>
-        <th class = "font-normal"><CourseTime time={props.course.time}/></th>
-        <th class = "font-normal"><CourseDates dates = {props.course.dates}/></th>
-        <th class = "font-normal"><CourseLocation location={props.course.location}/></th>
-        <th class = "font-normal"><CourseInstructor instructor={props.course.instructor}/></th>
+        <th class = "font-normal"><CourseSection section={course.section}/></th>
+        <th class = "font-normal"><CourseAvailability availability={course.status}/></th>
+        <th class = "font-normal"><CourseTime course={course}/></th>
+        {course.days && <th class = "font-normal"><CourseDates dates = {course.days} /></th>}
+        <th class = "font-normal"><CourseLocation location={course.building}/></th>
+        <th class = "font-normal"><CourseInstructor instructor={course.instructor}/></th>
       </tr>
+
+      ))}
     </table>
   )
 }
diff --git a/carleton-pathways/src/components/header/Header.jsx b/carleton-pathways/src/components/header/Header.jsx
index dbbbce2..382f512 100644
--- a/carleton-pathways/src/components/header/Header.jsx
+++ b/carleton-pathways/src/components/header/Header.jsx
@@ -1,11 +1,11 @@
 import SearchBar from "../searchBar/SearchBar";
 import Logo from "../logo/logo";
 
-export default function Header() {
+export default function Header( {handleCoursesChange} ) {
   return (
     <div class="flex m-4">
       <Logo/>
-      <SearchBar/>
+      <SearchBar onCoursesChange = {handleCoursesChange}/>
     </div>
   );
 };
\ No newline at end of file
diff --git a/carleton-pathways/src/components/searchBar/SearchBar.jsx b/carleton-pathways/src/components/searchBar/SearchBar.jsx
index 3a58a8b..5529d8f 100644
--- a/carleton-pathways/src/components/searchBar/SearchBar.jsx
+++ b/carleton-pathways/src/components/searchBar/SearchBar.jsx
@@ -1,11 +1,14 @@
-import React, { useRef } from 'react';
+import React, { useEffect, useRef, useState } from 'react';
 
-export default function SearchBar() {
+
+export default function SearchBar({onCoursesChange}) {
+  const [searchQuery, setSearchQuery] = useState(null)
+  
   const searchInput = useRef(null)
 
   const handleSearch = () => {
-    const searchQuery = searchInput.current.value;
-    console.log(searchQuery)
+    setSearchQuery(searchInput.current.value);
+    
   }
   const handleKeyDown = (event) => {
     if (event.key === 'Enter') {
@@ -14,6 +17,23 @@ export default function SearchBar() {
     }
   };
 
+  useEffect(() =>{
+    console.log("ran")
+    console.log(searchQuery)
+    if(searchQuery === null){
+      return;
+    }
+    const fetchCourses = async () =>{
+      const response = await fetch('/search/course/' + searchQuery)
+      const json = await response.json()
+      if(response.ok){
+        onCoursesChange(json)
+      }
+      // console.log(json)
+    }
+    fetchCourses()
+  },[searchQuery])
+
 
   return (
     <>
diff --git a/carleton-pathways/src/screens/coursePage/CoursePage.jsx b/carleton-pathways/src/screens/coursePage/CoursePage.jsx
index 31aac66..9282ae4 100644
--- a/carleton-pathways/src/screens/coursePage/CoursePage.jsx
+++ b/carleton-pathways/src/screens/coursePage/CoursePage.jsx
@@ -1,28 +1,36 @@
-import React from 'react'
-import CourseSchedule from '../../components/courseSchedule/CourseSchedule'
+import React, { useEffect, useState } from 'react';import CourseSchedule from '../../components/courseSchedule/CourseSchedule'
 import Header from '../../components/header/Header'
 import CourseHeader from '../../components/courseHeader/CourseHeader'
 
+
 export default function CoursePage() {
-  const course = {
+
+  const [courses, setCourses] = useState([{
     faculty: "COMP",
     course_code: "1805",
     section: "A",
     title: "Discrete Structures I",
-    description: "Introduction to discrete mathematics and discrete structures. Topics include: propositional logic, predicate calculus, set theory, complexity of algorithms, mathematical reasoning and proof techniques, recurrences, induction, finite automata and graph theory. Material is illustrated through examples from computing.",
-    availability: "OPEN",
-    time: "11:35 - 12:25",
-    dates: ["M", "W"],
-    location: "Nicol Building",
+    section_information: "Introduction to discrete mathematics and discrete structures. Topics include: propositional logic, predicate calculus, set theory, complexity of algorithms, mathematical reasoning and proof techniques, recurrences, induction, finite automata and graph theory. Material is illustrated through examples from computing.",
+    status: "OPEN",
+    start_time: "11:35",
+    end_time: "12:25",
+    days:["Monday", "Tuesday"],
+    building: "Nicol Building",
     instructor: "Alexa Sharp",
-    prereqs: "Prereqs: Grade 12 Math: Advanced Functions or Comp 1004 and Comp 1005",
-  }
+    prereq_string: "Prereqs: Grade 12 Math: Advanced Functions or Comp 1004 and Comp 1005",
+  }])
+  useEffect(() => {},[courses]) 
+  const handleCoursesChange = (newCourses) => {
+    console.log(newCourses.course)
+    setCourses(newCourses.course);
+    }
+
   return (
     <>
-    <Header/>
-    <CourseHeader course={course}/>
+    <Header handleCoursesChange = {handleCoursesChange}/>
+    {courses && <CourseHeader course={courses}/>}
     <div class = "mx-1">
-      <CourseSchedule course = {course}/>
+      {courses && <CourseSchedule course = {courses}/>}
     </div>
    </>
   )