diff --git a/client/src/App.js b/client/src/App.js
index 048a1923..2f54dcf7 100644
--- a/client/src/App.js
+++ b/client/src/App.js
@@ -1,62 +1,64 @@
 import React, { useEffect, useState } from "react";
 
 import { Route, Switch, Redirect } from "react-router-dom";
-import MovieList from './components/MovieList';
-import Movie from './components/Movie';
+import MovieList from "./components/MovieList";
+import Movie from "./components/Movie";
 
-import MovieHeader from './components/MovieHeader';
+import MovieHeader from "./components/MovieHeader";
 
-import EditMovieForm from './components/EditMovieForm';
-import FavoriteMovieList from './components/FavoriteMovieList';
+import EditMovieForm from "./components/EditMovieForm";
+import FavoriteMovieList from "./components/FavoriteMovieList";
 
-import axios from 'axios';
+import axios from "axios";
 
 const App = (props) => {
   const [movies, setMovies] = useState([]);
   const [favoriteMovies, setFavoriteMovies] = useState([]);
 
-  useEffect(()=>{
-    axios.get('http://localhost:5000/api/movies')
-      .then(res => {
+  useEffect(() => {
+    axios
+      .get("http://localhost:5000/api/movies")
+      .then((res) => {
         setMovies(res.data);
       })
-      .catch(err => {
+      .catch((err) => {
         console.log(err);
       });
   }, []);
 
-  const deleteMovie = (id)=> {
-  }
+  const deleteMovie = (id) => {};
 
-  const addToFavorites = (movie) => {
-    
-  }
+  const addToFavorites = (movie) => {};
 
   return (
     <div>
       <nav className="navbar navbar-dark bg-dark">
-        <span className="navbar-brand" ><img width="40px" alt="" src="./Lambda-Logo-Red.png"/> HTTP / CRUD Module Project</span>
+        <span className="navbar-brand">
+          <img width="40px" alt="" src="./Lambda-Logo-Red.png" /> HTTP / CRUD
+          Module Project
+        </span>
       </nav>
 
       <div className="container">
-        <MovieHeader/>
+        <MovieHeader />
         <div className="row ">
-          <FavoriteMovieList favoriteMovies={favoriteMovies}/>
-        
+          <FavoriteMovieList favoriteMovies={favoriteMovies} />
+
           <Switch>
             <Route path="/movies/edit/:id">
+              <EditMovieForm setMovies={setMovies} />
             </Route>
 
             <Route path="/movies/:id">
-              <Movie/>
+              <Movie />
             </Route>
 
             <Route path="/movies">
-              <MovieList movies={movies}/>
+              <MovieList movies={movies} />
             </Route>
 
             <Route path="/">
-              <Redirect to="/movies"/>
+              <Redirect to="/movies" />
             </Route>
           </Switch>
         </div>
@@ -65,6 +67,4 @@ const App = (props) => {
   );
 };
 
-
 export default App;
-
diff --git a/client/src/components/EditMovieForm.js b/client/src/components/EditMovieForm.js
index 9c058388..09332966 100644
--- a/client/src/components/EditMovieForm.js
+++ b/client/src/components/EditMovieForm.js
@@ -1,70 +1,121 @@
-import React, { useState, useEffect } from 'react';
-import { useParams, useHistory } from 'react-router-dom';
-import { Link } from 'react-router-dom';
+import React, { useState, useEffect } from "react";
+import { useParams, useHistory } from "react-router-dom";
+import { Link } from "react-router-dom";
 
-import axios from 'axios';
+import axios from "axios";
 
 const EditMovieForm = (props) => {
-	const { push } = useHistory();
+  const { id } = useParams();
+  const { push } = useHistory();
 
-	const [movie, setMovie] = useState({
-		title:"",
-		director: "",
-		genre: "",
-		metascore: 0,
-		description: ""
-	});
-	
-	const handleChange = (e) => {
-        setMovie({
-            ...movie,
-            [e.target.name]: e.target.value
-        });
-    }
+  const [movie, setMovie] = useState({
+    title: "",
+    director: "",
+    genre: "",
+    metascore: 0,
+    description: "",
+  });
 
-    const handleSubmit = (e) => {
-		e.preventDefault();
-	}
-	
-	const { title, director, genre, metascore, description } = movie;
+  const handleChange = (e) => {
+    setMovie({
+      ...movie,
+      [e.target.name]: e.target.value,
+    });
+  };
+  useEffect(() => {
+    axios
+      .get(`http://localhost:5000/api/movies/${id}`)
+      .then((res) => {
+        setMovie(res.data);
+      })
+      .catch((err) => {
+        console.log(err.response);
+      });
+  }, []);
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    axios
+      .put(`http://localhost:5000/api/movies/${id}`, movie)
+      .then((res) => {
+        console.log(res);
+      })
+      .catch((err) => {
+        console.log(err.response);
+      });
+  };
 
-    return (
-	<div className="col">
-		<div className="modal-content">
-			<form onSubmit={handleSubmit}>
-				<div className="modal-header">						
-					<h4 className="modal-title">Editing <strong>{movie.title}</strong></h4>
-				</div>
-				<div className="modal-body">					
-					<div className="form-group">
-						<label>Title</label>
-						<input value={title} onChange={handleChange} name="title" type="text" className="form-control"/>
-					</div>
-					<div className="form-group">
-						<label>Director</label>
-						<input value={director} onChange={handleChange} name="director" type="text" className="form-control"/>
-					</div>
-					<div className="form-group">
-						<label>Genre</label>
-						<input value={genre} onChange={handleChange} name="genre" type="text" className="form-control"/>
-					</div>
-					<div className="form-group">
-						<label>Metascore</label>
-						<input value={metascore} onChange={handleChange} name="metascore" type="number" className="form-control"/>
-					</div>		
-					<div className="form-group">
-						<label>Description</label>
-						<textarea value={description} onChange={handleChange} name="description" className="form-control"></textarea>
-					</div>
-									
-				</div>
-				<div className="modal-footer">			    
-					<input type="submit" className="btn btn-info" value="Save"/>
-					<Link to={`/movies/1`}><input type="button" className="btn btn-default" value="Cancel"/></Link>
-				</div>
-			</form>
-		</div>
-	</div>);
-}
+  const { title, director, genre, metascore, description } = movie;
 
-export default EditMovieForm;
\ No newline at end of file
+  return (
+    <div className="col">
+      <div className="modal-content">
+        <form onSubmit={handleSubmit}>
+          <div className="modal-header">
+            <h4 className="modal-title">
+              Editing <strong>{movie.title}</strong>
+            </h4>
+          </div>
+          <div className="modal-body">
+            <div className="form-group">
+              <label>Title</label>
+              <input
+                value={title}
+                onChange={handleChange}
+                name="title"
+                type="text"
+                className="form-control"
+              />
+            </div>
+            <div className="form-group">
+              <label>Director</label>
+              <input
+                value={director}
+                onChange={handleChange}
+                name="director"
+                type="text"
+                className="form-control"
+              />
+            </div>
+            <div className="form-group">
+              <label>Genre</label>
+              <input
+                value={genre}
+                onChange={handleChange}
+                name="genre"
+                type="text"
+                className="form-control"
+              />
+            </div>
+            <div className="form-group">
+              <label>Metascore</label>
+              <input
+                value={metascore}
+                onChange={handleChange}
+                name="metascore"
+                type="number"
+                className="form-control"
+              />
+            </div>
+            <div className="form-group">
+              <label>Description</label>
+              <textarea
+                value={description}
+                onChange={handleChange}
+                name="description"
+                className="form-control"
+              ></textarea>
+            </div>
+          </div>
+          <div className="modal-footer">
+            <input type="submit" className="btn btn-info" value="Save" />
+            <Link to={`/movies/1`}>
+              <input type="button" className="btn btn-default" value="Cancel" />
+            </Link>
+          </div>
+        </form>
+      </div>
+    </div>
+  );
+};
+
+export default EditMovieForm;