Challenge 03: RESTful and Express Routers
For this challenge, you'll add the save and delete features. And, you'll move the endpoints into a router.
Before getting started, remember to create a development branch git checkout -b feature/restful-routers to hold your work.
Let's replace your custom logger with Morgan, a popular HTTP request logger middleware for Node.
You have installed NPM packages before so we'll skip with step-by-step instructions and simply provide a friendly reminder, then you can do your thing.
Remember that in NPM v5.x and up, saving the package to the dependencies property is now the default, so the --save flag is optional. But it is good practice to double-check the dependencies property in the package.json file to ensure the package was added correctly.
You're up!
dev predefined format./api/notes and `/api/notes/:id/ endpoints. Does it log the requests as expected?/does/not/exist. Does it log the 404 response?Note: Morgan does not write the log to the console immediately. Instead, it buffers the log until the reponse has been sent so that it can log the response code, content length, etc. You may notice that the log files are written after other
console.log(...)statements in your application.
Commit your changes!
The server.js file is beginning to look a bit cluttered. Let's fix that by using Express Router to create maintanable, modular, mountable route handlers.
Your challenge is create and mount an Express router for /api/notes and verify it works properly. You worked on Modularizing with Express Router
in the curriculum so we won't repeat the details here, but we have provided a list of the changes below. You can refer back to the assignment in the curriculum and Express Router documentation if needed.
/router/notes.router.js folder and file./router/notes.router.js:
simDb related code from server.js the router fileserver.js to the router fileapp.METHOD to router.METHOD/server.js:
app.use(...)Before proceeding you should verify the changes by hitting each endpoint using Postman and check the results.
Mount the notes router on /api and remove /api from the endpoint paths:
server.js, mount the router on /api:
app.use(notesRouter) to app.use('/api', notesRouter)notes.router.js remove /api from endpoints:
router.get('/api/notes',... to router.get('/notes',...router.get('/api/notes/:id',... to router.get('/notes/:id',...Confirm the changes are working properly by hitting each endpoint again using Postman.
Commit your changes!
Congrats! Now let's implement the post and delete endpoints. We'll walk you thru the creating the new Note feature so you'll be able to implement the delete Note feature on your own.
In the notes router, create a POST /notes endpoint. Notice the similarities and differences between the POST and PUT endpoints.
// Post (insert) an item
router.post('/notes', (req, res, next) => {
const { title, content } = req.body;
const newItem = { title, content };
/***** Never trust users - validate input *****/
if (!newItem.title) {
const err = new Error('Missing `title` in request body');
err.status = 400;
return next(err);
}
notes.create(newItem, (err, item) => {
if (err) {
return next(err);
}
if (item) {
res.location(`http://${req.headers.host}/notes/${item.id}`).status(201).json(item);
} else {
next();
}
});
});
Use Postman to create a new Note and confirm the endpoint is working. Then call the GET /notes endpoint. Does the new note show up in the list? When you call GET /notes/:id with the new ID, does it return?
Commit your changes!
Your Turn!
Your challenge is to implement the delete note feature and test it with Postman
Requirements:
/api/notes/:idsimDb using notes.delete( id, err => {})Commit your changes!
Your last task is to simple update the client to take advantage of the new features. Instead of making piecemeal changes, you can copy the code for public/scripts/api.js and public/scripts/noteful.js from this gist.
Feature / Noteful App V1 POST and DELETE Client update
You can view an example solution and compare the differences between branches
solution/03-restful branch in the upstream repo.Good Luck!