Build Elevate

Discover the Build-Elevate Turborepo Template: Your Ultimate Monorepo for Modern Full-Stack Apps

Hey developers! Ready to streamline your full-stack development? Meet the Build-Elevate Turborepo Template – a production-grade monorepo that brings together Next.js, TypeScript, shadcn/ui, Tailwind CSS, Better-Auth, and TanStack Query. Powered by Turborepo for blazing-fast builds and efficient dependency management, this template is your shortcut to building scalable, modern apps with minimal setup hassle. Whether you're crafting a solo project or collaborating with a team, Build-Elevate sets you up for success. Let’s dive into why this is your next go-to starter!

Why Build-Elevate is a Game-Changer

Monorepos are the ultimate way to keep your codebase organized, and Build-Elevate takes it to the next level with a pre-configured, production-ready setup. Say goodbye to tedious configuration and hello to a cohesive ecosystem of modern tools. Here’s what makes it stand out:

Turborepo Efficiency: Lightning-fast builds with caching, task orchestration, and parallel execution.
Next.js Frontend: A powerful web app with server-side rendering, API routes, and Turbopack for top-tier performance.
Express API Backend: A robust server for APIs, business logic, and integrations.
TypeScript Everywhere: Full type safety to catch errors early and boost code quality.
Stunning UI with shadcn/ui & Tailwind CSS: Customizable components and utility-first styling, supporting light and dark themes.
Better-Auth for Authentication: Secure, flexible user authentication with sign-up, sign-in, profile, and settings pages.
TanStack Query: Effortless data fetching, caching, and state management for reactive UIs.
Email Features: Integrated React Email and Resend for seamless email functionality.
Quality Tools: Shared ESLint, Prettier, and Jest configs for consistent code and reliable tests.
pnpm Power: Fast, disk-efficient package management for the monorepo.
Docker-Ready: Production-grade Docker setup for easy deployment.

Check out the polished UI in action with these screenshots:

Page	Light Theme	Dark Theme
Home	Home Light	Home Dark
Sign Up	Sign Up Light	Sign Up Dark
Sign In	Sign In Light	Sign In Dark
Profile	Profile Light	Profile Dark
Settings - General	Settings General Light	Settings General Dark
Settings - Security	Settings Security Light	Settings Security Dark

Project Structure: Built for Scalability

The monorepo is organized into apps and packages, promoting modularity and code reuse. Here’s the layout:

Applications

apps/web: Next.js-powered frontend for UI, routing, and client-side logic.
apps/api: Express-based backend for APIs and server-side tasks.

Packages

packages/eslint-config: Centralized ESLint rules for consistent code quality.
packages/jest-presets: Shared Jest configs for Node.js and React testing.
packages/prettier-config: Unified Prettier formatting rules.
packages/typescript-config: Base TypeScript setup for type safety.
packages/auth: Authentication logic using Better-Auth.
packages/db: Prisma-based database access layer, shared across apps.
packages/email: Email functionality with React Email and Resend.
packages/ui: Reusable shadcn/ui components for consistent designs.
packages/utils: Shared utilities and TypeScript types to reduce duplication.

Turborepo optimizes builds by caching and pruning dependencies, ensuring efficiency across the workspace.

Tech Stack: A Modern, Cohesive Ecosystem

This template combines battle-tested tools into a developer-friendly setup, ready for customization. Key technologies include:

Turborepo: Monorepo orchestration with caching and parallel builds.
Next.js: High-performance web framework with Turbopack support.
Express: Flexible backend framework for APIs.
TypeScript: Strong typing for robust code.
shadcn/ui: Accessible, customizable UI components.
Tailwind CSS: Utility-first styling for rapid design.
Better-Auth: Secure, modern authentication solution.
TanStack Query: Reactive data fetching and caching.
React Email & Resend: Streamlined email creation and delivery.
Prisma: Type-safe database ORM.
ESLint: Code linting for consistency.
Prettier: Automated code formatting.
Jest: Comprehensive testing framework.
pnpm: Efficient package management.
Docker: Containerized production deployment.

This stack is open-source, performant, and ready for production.

Getting Started: Up and Running in Minutes

Setting up is straightforward. Follow these steps to get your project live:

1. Clone the Repository

bash

git clone <https://github.com/vijaysingh2219/build-elevate.git>
cd build-elevate

2. Install Dependencies

bash

pnpm install

3. Set Up Environment Variables

Ensure .env.production and .env.local files should be configured in apps and packages. Refer to the respective READMEs:

apps/web/README.md: Web app setup, including Next.js and environment variables.
apps/api/README.md: API server setup with Express.

4. Run Development Servers

bash

pnpm dev

This starts the web app, API server, and other services concurrently using Turborepo.

5. Docker Setup for Production

Run the production environment with Docker:

bash

pnpm docker:prod

This command:

Builds images using docker-compose.prod.yml.
Starts the web app on localhost:3000.
Starts the API server on localhost:4000.
Runs the PostgreSQL database on localhost:5432.

Notes:

Docker uses multi-stage builds for minimal image size.
Containers run as non-root users (nextjs, expressjs) for security.
Turborepo prunes the workspace to include only necessary dependencies.

Root-Level Scripts: Streamlined Workflows

Manage the monorepo with these handy scripts:

Script	Description
`pnpm build`	Builds all apps and packages with `turbo build`.
`pnpm clean`	Clears Turborepo cache and outputs.
`pnpm dev`	Starts development servers concurrently with `turbo dev`.
`pnpm docker:prod`	Builds and runs production Docker containers.
`pnpm lint`	Lints all workspaces using shared ESLint config.
`pnpm format`	Formats code with Prettier across the monorepo.
`pnpm check-types`	Checks TypeScript types across all workspaces.
`pnpm start`	Starts production servers for all apps.
`pnpm test`	Runs tests across all workspaces with Jest.

Wrapping Up: Kickstart Your Next Big Project

The Build-Elevate Turborepo Template is your foundation for building production-ready, full-stack applications with ease. It combines modern tools, enforces best practices, and scales effortlessly for solo devs or teams. Clone it, customize it, and start building something amazing.

Ready to dive in? Clone the repo, run pnpm install, set up your .env files, and hit pnpm dev. Contribute ideas, share your projects, and let’s make development smoother together. Happy coding! 🚀