How to Build Scalable Architecture for your Next.js Project

0:00 Introduction
1:52 Project Initialization
5:04 Engine Locking
8:03 Git Setup
10:28 ESLint
16:21 Prettier
19:12 Git Hooks (Husky)
29:52 VS Code Config
37:37 Directory Structure
39:52 Storybook
53:35 Creating a component template
1:03:27 Using the component template
1:13:25 Layouts
1:23:45 Deployment

(Thanks to Henry Jaffers for the chapters!)

In this video tutorial I'll cover how to set up a Next.js project with a scalable configuration you can use to build production ready apps for your organization, or just for your own personal use.

We'll be be using Typescript, Storybook, code quality tools managed with git hooks via Husky, configuration your VS Code environment, debugging scripts, a sample component template, Next.js best practices and a deployment to Vercel.

Future tutorials will build on this covering topics like testing, internationalization, authentication, databases implementation, state management and monorepos.

The repository for the project built in this video can be found here (note there may be additional features added above and beyond the scope of this video over time):

https://github.com/alexeagleson/nextj...

For a written version of this tutorial please see the blog post this video is based on here:

https://dev.to/alexeagleson/how-to-bu...