#Nextjs github pages how to#

We'll be using Visual Studio Code as our IDE in this tutorial as we will utilize a few extensions from their marketplace. Make sure to install them in your system if you haven't! If you don't want to go through the steps below and you just want to get the boilerplate to save time, you can clone it here or run the git command below: git clone my-appĭon't forget to ⭐ and share the repo if you like it! Prerequisitesīy the way, upon writing this post, I assume that you have some web development background and basic knowledge regarding npm, yarn, HTML, CSS, TailwindCSS, JavaScript, TypeScript, React, Next.js and Jest. This setup will also involve extensions and libraries that help us write our code efficiently.

Of course, this setup wouldn't be complete without a CI/CD pipeline that helps to deploy our code to GitHub Pages whenever we push changes to our repository and this will be automated using GitHub Actions. Along with the setup, we'll configure Jest and React Testing Library for writing component and unit tests. TailwindCSS is a utility-first CSS framework to rapidly build modern websites without ever leaving your HTML.

#Nextjs github pages how to#

This is a guide on how to set up a local development for Next.js projects with TypeScript support and TailwindCSS. Next.js is a React framework that gives you the best developer experience with all the features you need for production: hybrid static and server rendering, TypeScript support, smart bundling, route pre-fetching, and more.