Updating pages

[00:00 - 00:11] Updating pages. When the client requests are ready, we can replace the old request functions with them. This will allow us to remove the old API, use API routes, and deploy the project to Vercel using serverless functions.

[00:12 - 00:22] Let's review what pages use any APIs and what we need to replace. The main page fetches the categories and the posts. The post page fetches the post and its comments.

[00:23 - 00:45] Also the post page can submit a new comment for the post and the category page loads the posts for the category. Updating the main page. On the main page, we need to replace the old imports from API summary with a new one. Now we get them from the request. Instead of get static props, we're going to use get server side props now.

[00:46 - 01:03] On the category page, we're going to use fetch category from request. We'll use get server side props. We'll need to update the type here as well. Get server side props. Don't forget to import it.

[01:04 - 01:18] Instead of fetch posts, we now use fetch category and the rest of the code stays the same. Now let's update the post page, post ID. Here we want to import fetch post and fetch comments from the request module.

[01:19 - 01:33] Remove the old fetch post and fetch comments. This page was already using get server side props. So we don't need to update anything else. Open the comment form and update the submit comment import so that it comes from the request module.

[01:34 - 01:49] Now let's clean up the code a little bit. Cleaning up. When we've migrated to the API routes, we can safely delete the obsolete code. For example, we don't need the API directory so we can remove it completely. We also don't need shared static paths. Delete it as well.

[01:50 - 02:15] And also we don't need server index.ts. Remove it. If you open package JSON, then here we can remove body parser concurrently, course, express, node fetch and ts node. We can also clean up the scripts. Dev can just call next and we can remove the serve. Congratulations, our project is ready to be deployed.