Challenges

Server Rendering a GitHub Repo

Fetch Blog Post

Just like in the previous step, now we are going to fetch the blog post and render it. To do that, add the following import in the pages/post/[slug].js:

import githubCms from '../../lib/github-cms'

And remove this import:

import { promises as fsPromises } from 'fs'

Then remove, getStaticProps and getStaticPaths functions and add the following function instead:

export async function getServerSideProps ({ params }) {
  const post = await githubCms.getPost(params.slug)

  return {
    props: {
      post
    }
  }
}

(Here's the final version of the file after all these changes.)

Try to change the content inside the GitHub repository, and you can see those in your app by simply reloading the page.


The current version of our app is functional, but it has some drawbacks.

Q: Which one is not a drawback?
authenticating...

🙏 We need your help

We need your help to keep maintain & add new content to this course. Here's how you can support us: