Starting with a NextJS website

24-07-2024

The last couple of years I have been working with ReactJS, React Native and backend APIs and services written in Typescript. Due to an existing codebase the integration of Next.JS was not something I worked on previously. The goal of this website is to start working with Next.JS and additional libraries as well as hosting it on AWS.

What are we building?

As mentioned we are building a general static website as landing page for my company. In this age and especially as software developer we need to have a company page.

The static page is a good starting point but limited regarding programming we can do. Other goals is to integrate a database (DB) into the application. With Next.JS 14+ we can take advantage of server components and server actions. This blog is the dynamic part of the website. It is a small Content Management System (CMS).

A small user / authentication mechanism will be build for controlling access to the blog content. The textual content of the blog will be stored in a database. Later, images will be added to include in the blog posts. These images will be stored on a blob storage.

The Next.JS application, database and blob storage will be configured on Amazon Web Services (AWS).

Framework and libraries

The following frameworks and libraries will be used on this website:

  • Next.JS - React framework for client and server side rendering of web pages

  • Auth.JS - Authentication for Next.JS

  • TailwindCSS - styling library

  • Drizzle ORM - Object Relation Mapping library for mapping database objects

  • PostgreSQL - Relational database for storing persistent data

  • AWS S3 - Object storage used for images of the blog

  • Tiptap - Headless editor framework for editing blog posts

  • ShadCN - Collection of re-usable components