Project Structure Generator

Map out your production-ready Next.js folder architecture. Select your stack from 55+ tools and see how the pieces fit together.

55+ stack tools

8 stack presets

Instant tree view

Quick Presets

6 of 61 selected

Database

Authentication

Payments

API

Storage

CMS

Analytics

Testing

Queues

Integrations

DevOps

Internationalization

Directory Tree47 files

├── /prisma
│   ├── schema.prisma
│   └── seed.ts
├── /public
│   ├── favicon.ico
│   └── og-image.png
├── /src
│   ├── /actions
│   │   ├── auth.ts
│   │   ├── post.ts
│   │   └── user.ts
│   ├── /app
│   │   ├── /(app)
│   │   │   ├── /billing
│   │   │   │   └── page.tsx
│   │   │   ├── /dashboard
│   │   │   │   └── page.tsx
│   │   │   └── /pricing
│   │   │       └── page.tsx
│   │   ├── /(auth)
│   │   │   ├── /sign-in
│   │   │   │   └── /[[...sign-in]]
│   │   │   │       └── page.tsx
│   │   │   └── /sign-up
│   │   │       └── /[[...sign-up]]
│   │   │           └── page.tsx
│   │   ├── /api
│   │   │   └── /webhooks
│   │   │       └── /stripe
│   │   │           └── route.ts
│   │   ├── error.tsx
│   │   ├── layout.tsx
│   │   ├── loading.tsx
│   │   ├── not-found.tsx
│   │   └── page.tsx
│   ├── /components
│   │   ├── /layout
│   │   │   ├── Footer.tsx
│   │   │   ├── Header.tsx
│   │   │   └── Sidebar.tsx
│   │   ├── /providers
│   │   │   └── index.tsx
│   │   └── /ui
│   │       ├── .gitkeep
│   │       ├── button.tsx
│   │       ├── card.tsx
│   │       ├── dialog.tsx
│   │       └── input.tsx
│   ├── /emails
│   │   ├── InvoiceEmail.tsx
│   │   ├── ResetPasswordEmail.tsx
│   │   └── WelcomeEmail.tsx
│   ├── /lib
│   │   ├── action-client.ts
│   │   ├── constants.ts
│   │   ├── prisma.ts
│   │   ├── resend.ts
│   │   ├── stripe.ts
│   │   └── utils.ts
│   ├── /styles
│   │   └── globals.css
│   ├── /types
│   │   └── index.ts
│   └── middleware.ts
├── .env.example
├── .env.local
├── .gitignore
├── components.json
├── next.config.ts
├── package.json
├── README.md
├── tailwind.config.ts
└── tsconfig.json

Pro tip: A well-structured project makes onboarding faster and reduces cognitive overhead. Group files by feature (colocation) rather than by type for better scalability.

Related Tools

More workbench essentials to speed up your build.

View all

Shadcn/UI Component Previewer

Live preview of shadcn/ui components with instant copy-paste code. Browse rendered components and grab snippets.

Open tool

.env File Generator

Pick your tech stack and get a complete, commented .env boilerplate file. Never forget an environment variable.

Open tool

Tailwind CSS Color Palette Generator

Enter a brand color and generate a complete Tailwind-compatible shade scale with config snippets.

Open tool

Developer Kits

View all →

$79

one-time payment

SaaS Starter Pro

Complete SaaS foundation with auth, Stripe billing, team management, admin dashboard, and RBAC. Launch in days.

Next.jsStripe

View kit

Next.js Blog Kit

Free

MDX-powered blog with full SEO, dark mode, RSS feed, reading time, and syntax highlighting. Deploy to Vercel in one click.

Auth Boilerplate

$39

Magic link, OAuth (Google, GitHub), 2FA, password reset, and RBAC. Built with Clerk and Next.js — fully production-hardened.

Developer Guides

All guides →

Tutorial

5 min

How to Add Stripe to Next.js (2026)

A complete walkthrough of integrating Stripe Checkout and webhooks into your Next.js application.

Engineering Guide

Read guide

How to Add Razorpay to Next.js (2026): Complete Guide with Code

Tutorial

12 min

Next.js + Prisma + Stripe Tutorial

Tutorial

8 min

Custom builds

Need a custom developer tool?

From specialized code generators to full-stack internal dashboards — we build tools that make your team 10x more productive.

Start a custom build →

Directory Tree47 files

├── /prisma
│   ├── schema.prisma
│   └── seed.ts
├── /public
│   ├── favicon.ico
│   └── og-image.png
├── /src
│   ├── /actions
│   │   ├── auth.ts
│   │   ├── post.ts
│   │   └── user.ts
│   ├── /app
│   │   ├── /(app)
│   │   │   ├── /billing
│   │   │   │   └── page.tsx
│   │   │   ├── /dashboard
│   │   │   │   └── page.tsx
│   │   │   └── /pricing
│   │   │       └── page.tsx
│   │   ├── /(auth)
│   │   │   ├── /sign-in
│   │   │   │   └── /[[...sign-in]]
│   │   │   │       └── page.tsx
│   │   │   └── /sign-up
│   │   │       └── /[[...sign-up]]
│   │   │           └── page.tsx
│   │   ├── /api
│   │   │   └── /webhooks
│   │   │       └── /stripe
│   │   │           └── route.ts
│   │   ├── error.tsx
│   │   ├── layout.tsx
│   │   ├── loading.tsx
│   │   ├── not-found.tsx
│   │   └── page.tsx
│   ├── /components
│   │   ├── /layout
│   │   │   ├── Footer.tsx
│   │   │   ├── Header.tsx
│   │   │   └── Sidebar.tsx
│   │   ├── /providers
│   │   │   └── index.tsx
│   │   └── /ui
│   │       ├── .gitkeep
│   │       ├── button.tsx
│   │       ├── card.tsx
│   │       ├── dialog.tsx
│   │       └── input.tsx
│   ├── /emails
│   │   ├── InvoiceEmail.tsx
│   │   ├── ResetPasswordEmail.tsx
│   │   └── WelcomeEmail.tsx
│   ├── /lib
│   │   ├── action-client.ts
│   │   ├── constants.ts
│   │   ├── prisma.ts
│   │   ├── resend.ts
│   │   ├── stripe.ts
│   │   └── utils.ts
│   ├── /styles
│   │   └── globals.css
│   ├── /types
│   │   └── index.ts
│   └── middleware.ts
├── .env.example
├── .env.local
├── .gitignore
├── components.json
├── next.config.ts
├── package.json
├── README.md
├── tailwind.config.ts
└── tsconfig.json

Pro tip: A well-structured project makes onboarding faster and reduces cognitive overhead. Group files by feature (colocation) rather than by type for better scalability.