Learn how to build & deploy a static site using Next.js, Prisma, and a SQLite database.

Static sites are all the rage – and for a good reason.

The JAMstack (i.e., JavaScript, APIs, and Markup) has emerged as an attractive alternative to traditional web apps. Static apps have many benefits:

• Globally scalable
• Save money hosting static files
• Faster performance by serving cached assets from a CDN
• No need to worry about server or database vulnerabilities
• Better developer experience – no complicated deployment process

What if you have dynamic needs? With Next.js 9.3, it’s no problem.

Next.JS 9.3

Before 9.3, Next.js was mostly used for server-side rendered (SSR) React apps. It solved a few common issues with most client-side rendered (CSR) React apps, including search engine optimization (SEO), routing, and code splitting. There was only one issue. SSR requires, well… a server. This limits your deployment options and increases costs. That’s where Next.js 9.3 came in.

With the release of 9.3, Next.js is now a complete static-site generator (SSG). Using two new Next.js functions getStaticProps and getStaticPaths, we can take dynamic data and build static sites. Incredible!

Here’s the special sauce: getStaticProps is only ran at build time – it’s not even included in the browser JS bundle. That means you can write server-side code directly, including direct database queries. Enter Prisma.

#next #prisma #sqlite #database #web-development