Skip to main content

Posts

Showing posts with the label Static site generation

React Ecosystem: Static Generation with Next.js and React

In the previous post , We created a BlogPost application rendering content on server-side with Next.js . We will be changing the same application to use SSG (Static Generation) capability of Next.js. What will we create and which Next.js functions will we use? We will create an application which will have index page to list all the available blog links and statically generated blog posts. We will use getStaticProps and getStaticPaths functions from Next.js. getStaticProps function is called by Next.js at build time and pre-renders the page. getStaticPaths function is also called by Next.js at build time. If you are using getStaticProps and there are dynamic paths then you define those in getStaticPaths Update index.tsx import React from 'react'; import { GetStaticProps, GetStaticPropsContext } from 'next'; import BloggerService from '../service/BloggerService'; import styles from '../App.module.css' /* Line 1*/ interface IndexPageProps { bl