How To Build a Next.js Static website with AWS S3

A step by step Guide With an example project

Bhargav Bachina
Bachina Labs

--

Photo by Ben Kolde on Unsplash

Next.js is the React framework for static websites, the JAMstack, Production, Desktop, Lightweight Apps, Pre-rendered apps Mobile Web, etc. There are so many advantages using Next.js for your react application such as Pre-Rendering made easier, Exporting a static website with a single command, including CSS in JS code, very less configuration, fully extensible, and optimized for smaller builds, etc. You can get more information on their website here.

There are a number of ways you can build a website with Next.js such as Java with Next.js, NodeJS with Next.js, NGINX serving Next.js, etc. For the single-page applications, all you need to do is to load the initial index.html. Once you load the index.html the Next.js framework kicks in and do the rest of the job like loading components, calling API calls, etc. What if there are no backend calls and you want to build a static website with Next.js?

AWS S3 is one of the options which provides a low cost and highly reliable static website hosting solution. These static sites have only CCS, HTML, JS files, fonts, etc. In this post, we can see how we can build a static website with Vue and host that with the AWS S3.

  • Example Project

--

--