Turbostack

This project is a comprehensive monorepo template built with Turborepo that provides a complete full-stack development environment for modern web applications. It includes Tailwind CSS v.4 with Shadcn/ui ready to use.

Please read each README.md for each package for a better understanding of the project.

Project structure

This template is organized into a clean monorepo structure with three main sections:

1. Configuration files: In here you will find the configuration for the following project dependencies:

   • ESLint
   • Prettier configuration.
   • TypeScript

2. Packages: Sharable packages across your project.

   • Pre-configured, accessible components and utilities ready to use across applications
   • Easy integration of new components via Shadcn/ui CLI (components)

3. Applications: Main applications where you will be working on

   • Client - Next.js 15 application with React 19 and Turbopack
   • Server - Express.js and TypeScript back-end with hot reloading using Nodemon

Package Manager

Package manager used for this template is PNPM.

Tailwind CSS

Tailwind CSS v.4 is in the latest version v4. You can find all the configuration in here.

The file globals.css is based on the file from this external file.

Available Scripts

Some of the following tasks or commands are handled with Turborepo, they can be used with the package manager PNPM as a regular script, the main difference is that they will work across the project.

Installs the dependencies needed for the project to work.

pnpm install

Uses Next.js to build the client project and TypeScript to build the server project (TSC).

pnpm run build

Cleans all the unnecessary folders that are not needed for developing or pushing to remote.

pnpm run clean

Checks any error found of TypeScript types in the projects that uses TypeScript.

pnpm run check-types

Starts the development server for the client project using Next.js and Turbopack with hot reloading. It also starts the server project using Express.js with hot reloading using Nodemon.

pnpm run dev

Uses Prettier to format all the files of the project following the rules from ./config/prettier/base.js and ignores files from ./.gitignore and ./.prettierignore

pnpm run format

Uses ESLint to lint most of the files of the project following the rules from ./config/eslint/base.js.

pnpm run lint

Updates all the packages and dependencies of all the projects and configuration files to the latest version.

pnpm run update

With a single command you can run all the tasks above in parallel, this is the recommended way to run the project.

pnpm run setup

This command does the same as pnpm run setup but it includes the script for update that will update all the packages and dependencies to the latest version and also execute all the scripts tasks in parallel.

pnpm run setup:update