diff --git a/client/src/components/EditBox.js b/client/src/components/EditBox.js
index 1684f79b..a3d498f0 100644
--- a/client/src/components/EditBox.js
+++ b/client/src/components/EditBox.js
@@ -1,6 +1,7 @@
 import React, { useState, useEffect } from "react";
-// import fakeData from "../fakeData.json";
-import AddForm from "./AddForm";
+
+import fakeData from "../fakeData.json";
+import LearningObjectiveAddForm from "./LearningObjectiveAddForm";
 import { useParams } from "react-router-dom";
 import { skills } from "../components/consts/skillsConst";
 
@@ -138,7 +139,7 @@ export default function EditBox() {
           })}
         </ul>
         <div className="add-btn-container">
-          <AddForm getLearningObj={getLearningObj} />
+          <LearningObjectiveAddForm getLearningObj={getLearningObj} />
         </div>
       </div>
     </div>
diff --git a/client/src/components/AddForm.js b/client/src/components/LearningObjectiveAddForm.js
similarity index 74%
rename from client/src/components/AddForm.js
rename to client/src/components/LearningObjectiveAddForm.js
index 3a7c2f17..d470b924 100644
--- a/client/src/components/AddForm.js
+++ b/client/src/components/LearningObjectiveAddForm.js
@@ -1,6 +1,6 @@
-import React, { useState, useEffect } from "react";
-
-export default function AddForm({ getLearningObj }) {
+import React, { useState } from "react";
+import { skills, skillLabel } from "./consts/skillsConst";
+export default function LearningObjectiveAddForm({ getLearningObj }) {
   const token = window.localStorage.getItem("token");
   const initialDescription = {
     skill: "",
@@ -13,7 +13,7 @@ export default function AddForm({ getLearningObj }) {
       [event.target.name]: event.target.value,
     };
     setAddDescription(updateInput);
-    console.log(updateInput);
+ 
   }
   async function hadleSubmit(e) {
     e.preventDefault();
@@ -30,8 +30,6 @@ export default function AddForm({ getLearningObj }) {
       }),
     })
       .then((response) => response.json())
-      .then((data) => console.log(data));
-
     setAddDescription(initialDescription);
     getLearningObj();
   }
@@ -43,14 +41,10 @@ export default function AddForm({ getLearningObj }) {
         <br />
 
         <select name="skill" onChange={handleChange} className="dropdown-skill">
-          <option value="select">Select</option>
-          <option value="html">HTML</option>
-          <option value="css">CSS</option>
-          <option value="git">GIT</option>
-          <option value="javascript">Javascript</option>
-          <option value="react">React</option>
-          <option value="node">Node</option>
-          <option value="sql">SQL</option>
+          <option>Select a skill</option>
+          {skills.map((skill) => (
+            <option value={skill}>{skillLabel(skill)}</option>
+          ))}
         </select>
         <br />
         <label className="input-label">Add your learning objective</label>
diff --git a/client/src/components/StudentResultsDisplay.js b/client/src/components/StudentResultsDisplay.js
index 2c54f553..494c71e3 100644
--- a/client/src/components/StudentResultsDisplay.js
+++ b/client/src/components/StudentResultsDisplay.js
@@ -85,6 +85,8 @@ export default function StudentResultsDisplay({ studentDetail }) {
   return (
     <Accordion>
       {skills.map((skill, index) => {
+        console.log(skills[skill]);
+        console.log(skill);
         return (
           <Card>
             <Card.Header>