Full Stack Next.js, FastAPI, PostgreSQL Tutorial - Travis Luong
Full Stack Next.js, FastAPI, PostgreSQL Tutorial - Travis Luong
Welcome to the Full Stack Next.js, FastAPI, and PostgreSQL (NFP) Tutorial. I am excited to announce the official launch of the
Full Stack NFP Tutorial. The NFP Tutorial is a 5 part series on how to build a boilerplate web application to be used as a starting
point for web projects. It can also be used as a cheat sheet on how to set up this tech stack from scratch. There are many good
tools and frameworks to choose from. However, there are a few that have risen to the top of my list of preferred tools.
Tech Stack
Next.js is a front-end framework that is built on React, the most popular front-end UI library at this time. It gives you everything
React gives you plus more. It supports server-side rendering, static-site generation, and file-system-based routing out of the box.
There’s no need to mess around with complicated build tools. With Next.js, you can go straight to writing your application with
minimal setup. I’ve also included TailwindCSS, a simple and powerful styling system.
FastAPI is a back-end API framework for Python. It has the perfect balance of “convention over configuration” and flexibility.
FastAPI includes a type system for your data validations as well as automatic API documentation. Many other micro-frameworks
don’t include these things, which means additional work to set them up yourself. The performance is also claimed to be on par
with Node.js because of async support, but I haven’t verified this for myself yet. I may conduct an experiment in a future article.
PostgreSQL is a relational database system. It has good performance, reliability, and has been around for a long time. I have
used PostgreSQL in many projects and so it is what I’m most familiar with, hence why I chose it for this boilerplate. However, you
are free to swap out any part of this boilerplate with something more suitable for your project.
Ubuntu is a popular Linux distro that we will be deploying our application to. We will be using shell scripts to automate the
deployment. In order to keep things simple, I have opted out of using any configuration management or container orchestration
tools for the deployment. A single cloud server is probably sufficient for most small projects.
Docker is used to bring consistency to the setup and development processes through containerization of the backend and
database services. This part is probably more relevant when working on a larger team. Solo devs may prefer to develop on the
host machine for simplicity. Either way, I have included this as a bonus section.
Table of Contents
1. How to Build a Full Stack Next.js, FastAPI, PostgreSQL Boilerplate Tutorial
2. How to Deploy Next.js, FastAPI, and PostgreSQL with Shell Scripts
3. How to Develop a Full Stack Next.js, FastAPI, PostgreSQL App Using Docker
4. How to Build a User Authentication Flow with Next.js, FastAPI, and PostgreSQL
5. How to Test an API with Pytest and Requests
Conclusion
Thank you for reading. This was my first attempt at writing content for Medium. Please clap and follow if you have found this
content useful. This tutorial was written for anyone looking to learn this niche tech stack. The tutorials were also designed to be
as standalone as possible, so you don’t have to read the entire tutorial, but only what you need. Please feel free to leave
feedback, suggestions, or questions in the comments. Good luck on your programming journey.