Create Blogging Site With NextJS
Table of content
Problems of ReactJS
When building a ReactJS application from scratch, there are some important aspects that we need to take into consideration:
You have optimize your code for production optimization, such as code splitting. Code splitting is the process of splitting your bundled file into smaller chunks, then load the necessary chunks per user's requests. In other words, code splitting allows your bundled code to be "lazy-load" only the necessary things.
You might have to write server-side code to connect to your application with other services like databases, machine learning models.
You might have to pre-render some ReactJS page into static HTML for performance and SEO. You might want to dynamically render your application using server-side render (SSR) or client-side render (CSR).
Solution of NextJS
NextJS is a React Framework that solves all of the above problems with built in features:
- Pre-renders all of your code.
- NextJS offers static site generation (SSG) where it renders your React code into HTML, then deploy the HTML file to CDN for fast and reliable deliveries.
- NextJS also offers server-side rendering (SSR) where it renders React code into HTML in the server, and only update the client HTML the Reactive way.
- Most importantly, NextJS offer both of these feature on a per page basis, meaning you can decide which pages gets rendered statically, which page gets rendered dynamically.
Automatic code splitting to optimize code for production.
Built in API routes for writing server-side code.
Clone the following repo and follow the README.md instruction to start upload your blogs: https://github.com/WilsonLe/nextjs-blog-template