dmytro-komlyk / fullstack-boilerplate-next-nest-vps

Fullstack Boilerplate with Next.js, NestJS, tRPC, Docker and deploy on VPS

Fullstack-Boilerplate-Next-Nest-VPS

Overview

This repository provides a boilerplate for setting up a Next.js and Nest.js project with Continuous Integration (CI) on a Virtual Private Server (VPS). It includes configurations for various tools and libraries to help you quickly get started with a modern web development stack.

Features

• Next.js for the frontend
• Nest.js for the backend
• TypeScript for type safety
• Docker for containerization
• CI/CD with GitHub Actions
• Monorepo structure with PNPM Workspaces
• Prisma ORM for database management
• TailwindCSS for styling
• NextAuth for authentication
• tRPC for type-safe APIs
• NextUI for UI components
• Next-Intl for internationalization

Getting Started

Prerequisites

Ensure you have the following installed:

• Node.js
• PNPM
• Docker

Installation

1. Clone the repository

   git clone https://github.com/dmytro-komlyk/fullstack-boilerplate-next-nest-vps.git
   cd fullstack-boilerplate-next-nest-vps

   or use the repository button Use this template

2. Install dependencies

   pnpm install

3. Setup environment variables

   cp apps/admin/.env.local.example apps/admin/.env.local
   cp apps/client/.env.local.example apps/client/.env.local
   cp apps/server/.env.example apps/server/.env

Running the Project

To start the development environment:

pnpm dev

This will concurrently run the Next.js and Nest.js applications.

Building for Production

1. To build the project for production:

   pnpm build

2. To start the production build:

   pnpm start

Docker development

To run the project using Docker, use the provided docker-compose files.

1. Set up environment variables

   cp apps/admin/.env.docker.local.example apps/admin/.env.docker.local
   cp apps/client/.env.docker.local.example apps/client/.env.docker.local
   cp apps/server/.env.docker.local.example apps/server/.env.docker.local

2. Build and run Docker containers

   docker compose -f docker-compose.local.yml up -d

Git Hooks with Husky and Commitlint

This project uses Husky to manage Git hooks and Commitlint to enforce conventional commit messages.

Example Commit Message Guidelines

• feat: A new feature
• fix: A bug fix
• docs: Documentation only changes
• style: Changes that do not affect the meaning of the code (white-space, formatting, missing semi-colons, etc)
• refactor: A code change that neither fixes a bug nor adds a feature
• perf: A code change that improves performance
• test: Adding missing tests or correcting existing tests
• build: Changes that affect the build system or external dependencies (example scopes: gulp, broccoli, npm)
• ci: Changes to CI configuration files and scripts (example scopes: Travis, Circle, BrowserStack, SauceLabs)

Deploy

CI/CD Pipeline

This project uses GitHub Actions for continuous integration and continuous deployment. The configuration files are located in the .github/workflows directory.

1. Set up your secrets and variables in a GitHub repository

    SSH_PASSWORD
    SSH_USERNAME

    ADMIN_DOMAIN
    APP_DOMAIN
    SERVER_DOMAIN
    BRANCH_DEPLOYMENT
    PROD_NAME
    SSH_FOLDER
    SSH_HOST
    SSH_PORT

2. Set up labels in a GitHub repository

   backend
   frontend-client
   frontend-admin

VPS Сonfiguration

1. Connect to your VPS and run the following commands to install the required dependencies:

   sudo apt update
   sudo apt install docker.io
   sudo apt install docker-compose

2. Create structure, copy files and set up environment variables:

   PROD_NAME
   .
   │
   ├── client
   │   └── .env.docker.prod   # Set up environment variables
   ├── admin
   │   └── .env.docker.prod   # Set up environment variables
   ├── server
   │   └── .env.docker.prod   # Set up environment variables
   ├── database
   │   ├── conf   
   │   │   └── mongod.conf.orig
   │   ├── seed   
   │   │   └── *.json  # copy files from mongodb
   │   ├── Dockerfile 
   │   └── init-seed.sh
   └── docker-compose.prod-ci.yml   # Set up your values instead of text with <>

3. Run Docker containers:

   docker login ghcr.io -u <github.repository_owner>
   docker compose -f docker-compose.prod-ci.yml -p <PROD_NAME> pull
   docker compose -f docker-compose.prod-ci.yml -p <PROD_NAME> up -d

Folder Structure

.
├── .github
│   └── workflows   # CI/CD configurations
├── .vscode   # VSCode settings
├── apps
│   ├── admin   # Next.js app
│   ├── client   # Next.js app
│   ├── database   # MongoDB
│   └── server   # Nest.js app
├── packages
│   └── eslint-config   # Shared ESLint configuration
├── docker-compose*.yml   # Docker configurations
├── pnpm-workspace.yaml   # pnpm workspace configuration
├── README.md   # Project documentation
└── ...