CRUD
Learning Objectives
We will build a CRUD API. CRUD stands for Create, Retrieve, Update, Delete. If you think about it, this is what most applications do:
β¨ Create some “resources” π Retrieve them (GET them) π¨ Update them ποΈ Delete them
π― Goal
Our API will manage movie data. It will:
β¨ Create a new movie, π Retrieve a list of movies or a single movie
We will build these endpoints:
GET /movies should return all the movies
GET /movies/:movieId should return a single movie (that matches the passed movieId)
POST /movies should save a new movie
π Fork the Node-Starter-Kit repo and clone it to your computer. Then run npm install
to install the dependencies.
CRUD Code-along with Mitch π
π GET
Learning Objectives
GET /movies should return all the movies
In server.js
, create a GET /movies
endpoint that returns all the movies (see below for some sample data).
app.get("/movies", (req, res) => {
res.send(moviesData);
});
const movies = [
{
id: 1,
title: "The Godfather",
certificate: "18",
yearOfRelease: 1972,
director: "Francis Ford Coppola",
},
{
id: 2,
title: "The Shawshank Redemption",
certificate: "15",
yearOfRelease: 1994,
director: "Frank Darabont",
},
{
id: 3,
title: "Schindler's List",
certificate: "15",
yearOfRelease: 1993,
director: "Steven Spielberg",
},
];
π§ͺ Run and test
npm run dev
- Open Postman
- Make a GET request to
http://localhost:3000/movies
GET Code-along with Mitch π
π GET single movie
Learning Objectives
GET /movies/:movieId should return a single movie (that matches the passed movieId)
Sometimes, we do not want to list all the information in one request, maybe we only want to get the information related to a single movie. Imagine a page to display the details of one movie. We’d call the server, get all movies, then filter the one we need client-side. It would be more effective to tell the server to just return the one movie we are interested in.
We will now add a new endpoint to return only a single movie GET /movies/:movieId. In this case, movieId will tell us what movie we can return. The call will be GET /movies/10
and that will return the movie with that has movieId: "10"
.
This endpoint has something different. The endpoint /movies/:movieId
has a dynamic part. The movieId
will vary depending on what the client sends.
In server.js
, create a GET /movies/:movieId
endpoint that returns a single movie. The movieId will be passed as a parameter in the URL.
app.get("/movies/:movieId", (req, res) => {
const movieId = req.params.movieId;
const movie = moviesData.find((movie) => movie.movieId === movieId);
res.send(movie);
});
π§ͺ Run and test
- Save your changes
- Make a GET request to
http://localhost:3000/movies/10
GET Single Code-along with Mitch π
π¨ POST
Learning Objectives
POST /movies should save a new movie
In order for our server-side to receive and use the data sent by the client, we will need to install and use a middleware.
The JSON middleware makes it easy for our route handlers to read JSON data from the request. If the Content-Type request header indicates that the request body contains JSON data then the middleware calls JSON.parse to convert the request body into a JavaScript data structure.
To register the JSON middleware, add the following to the server code:
app.use(express.json()); // before our routes definition
In server.js
, create a POST /movies
endpoint that saves a new movie. The movie will be passed as a JSON object in the request body.
- Add the following code to
server.js
:
app.post("/movies", (req, res) => {
const newMovie = req.body;
moviesData.push(newMovie);
res.send("movie added successfully!");
});
- Open Postman and create a new request.
- Set the Request Type to POST.
- Enter the URL for your endpoint, which should be http://localhost:3000/movies.
- Set the Body Type to raw and format to JSON (application/json).
- Enter the movie Data in the body of the request as JSON:
{
"id": "13",
"title": "Boyhood",
"certificate": "15",
"yearOfRelease": 2014,
"director": "Richard Linklater"
}
- Click Send.
- You should see the movie you just created in the response.