Next.jsReactSaaSStarter

create-stack — Next.js SaaS Template

By alfredmouelle

create-stack is a CLI and SaaS base template that generates a Next.js or TanStack Start project based on wizard choices, placing replaceable integrations such as email, storage, cache, logging, and analytics behind ports.

Explore the design

Compare the page layouts and mobile experience. Open any screenshot for a closer look.

2 previews
Desktop homepage1 / 2
Desktop captureTop of page

Actual screenshot captured by the server browser.

All pages & views 2

Screenshots show visual appearance; interactive behavior may differ.

Recorded 2026-10-08View source

What stands out

A quick read of the recorded project description.

01

The CLI wizard generates a project based on options such as framework, package manager, database, authentication, tRPC, and email service, and completes dependency installation, validation, and an initial Git commit

02

Replaceable integrations are placed behind ports; application code depends only on ports, so switching Resend/Brevo or S3/R2 only changes the composition root in one place

03

Provides two real starter apps, Next.js App Router and TanStack Start; the CLI forks one based on your choice

04

Capabilities are organized as packages/<capability>/, each with a capability.json manifest and tests, with a clear distinction between the port and module wiring models

05

Includes two skills, /create-stack and /add-capability, allowing capabilities to be added to a project after creation

Template Details

create-stack consists of two parts: the published CLI `@alfredmouelle/create-stack`, and the private pnpm + Turborepo monorepo `@alfredmouelle/stack` used to develop the CLI. The CLI asks via a wizard about framework, monorepo orchestrator, package manager, import alias, database, authentication, tRPC, email service, and various capabilities, then forks the corresponding base app and applies these choices, while installing dependencies, running validation, and creating an initial Git commit.

The `apps/next-base` and `apps/tanstack-base` in the repository are real, usable starter apps that contain no business code themselves, only baseline configuration such as strict Biome, the `~/*` import alias, and a typed `env.ts`. Under `packages/<capability>/`, each capability has a `capability.json` manifest and tests; its `kind` field determines the wiring method: a port has multiple adapters and is selected at the composition root; a module has only one provider or no provider and is used directly.

Port-type capabilities include mailer (Resend, Brevo, SES), storage (S3, Cloudflare R2, GCS, local), cache (Redis, Upstash, in-memory), logger (pino, console), and analytics (PostHog, Plausible, noop). Module-type capabilities include jobs (Inngest client and serve wiring), error-tracking (Sentry initialization options and framework files; steps that modify your own files are only printed, not applied automatically), email-ui (React Email components, replaceable themes, and local preview), and http (typed fetch and a Web-standard WebhookHandler).

The repository also provides two skills: `/create-stack` creates a project using the published CLI, and `/add-capability <capability> [adapter]` adds a capability to an existing project; port-type capabilities require an adapter argument, module-type ones do not. Development conventions are pnpm, turbo, tsdown, vitest, Biome v2, with Node version 22 or higher required. The project is inspired by create-t3-app and is MIT licensed.

Next.jsReactSaaSStarter

Is it right for your project?

Use Cases

  • Need to build a SaaS project skeleton from scratch with Next.js or TanStack Start, with common integrations such as email, storage, cache, logging, and analytics pre-wired
  • Have an existing project and want to introduce capabilities such as email, storage, or cache while keeping providers replaceable via the port/adapter approach
  • Team wants to unify the baseline configuration of new projects, including strict Biome, import aliases, and typed env validation
  • Need to preview React Email templates locally while keeping email themes replaceable

Suitable For

  • Frontend or full-stack developers using pnpm and Node 22 or higher
  • Teams that accept port and adapter layering and are willing to choose providers at the composition root
  • SaaS projects that need a Next.js App Router or TanStack Start starter skeleton
  • Developers who want to reduce repetitive initialization work with a CLI and skill scripts

Getting started & customization

Use these recorded setup notes alongside the repository instructions for your chosen version.

  1. 1

    Create a project with pnpm create @alfredmouelle/stack@latest my-app or pnpm dlx @alfredmouelle/create-stack@latest my-app; npm and yarn create also work

  2. 2

    For repository development, first run pnpm install, then run pnpm test, pnpm typecheck, and pnpm check

  3. 3

    Preview email templates locally: pnpm --filter @alfredmouelle/email-ui email:dev, running on port 3001

  4. 4

    Skills can be symlinked into the agent configuration directory via pnpm link:skills (Claude) or pnpm link:skills:codex (Codex)

  5. 5

    The code is MIT licensed and can be used, modified, commercialized, and distributed for free, but the copyright and license notice must be retained; demo assets, fonts, icons, and external services such as domains, hosting, databases, payments, and AI need separate license and cost verification

Read repository instructions

License & source material

Usage conditions & limitations

Free to use · keep license notice

This entry covers the free version in the public repository under the MIT license; the free scope is the code of that version and does not imply that external services or third-party assets are free.

Must comply with when using

  • You may use, modify, commercialize, and distribute the code of this version for free.
  • When distributing copies or substantial portions of the code, retain the original author's copyright notice and the full MIT license notice.
  • The code is provided as is; warranties and limitations of liability are governed by the original license and applicable law.

Additional costs & items to verify

  • Demo images, fonts, icons, and other third-party assets must be checked against their respective licenses and cannot be judged solely by the code's MIT license.
  • External services such as domains, hosting, databases, payments, or AI may incur separate charges.
  • The jobs capability directly depends on Inngest, and error-tracking directly depends on Sentry; using these two capabilities requires integrating the corresponding external services.
  • Providers are selected via environment variables; using port-type capabilities requires configuring the corresponding environment variables yourself.
  • In error-tracking, steps that modify your own files are only printed and not applied automatically; they must be executed manually.
  • The runtime requires Node 22 or higher.
  • Skill symlinks are written to the Claude and Codex configuration directories respectively; using skills requires the corresponding agent environment.
View Original Text Basis

Permission is hereby granted, free of charge

Original License Text

Jobs use Inngest directly, and error tracking uses Sentry directly.

Original README

**Provider selection by env var**, with static imports.

Original README

the steps that edit files you own are printed, not applied

Original README

**Node:** >= 22

Original README

pnpm link:skills # Claude (~/.claude/skills) pnpm link:skills:codex # Codex (~/.codex/prompts)

Original README
https://github.com/alfredmouelle/create-stack/blob/main/LICENSEhttps://github.com/alfredmouelle/create-stack/blob/main/README.md

Compiled by DeepSeek based on repository license and README ·2026-10-08. Results only cover the materials read; dependencies, images, fonts, and subsequent term changes are subject to their respective original texts.

Project checks & description sources

Template Information

Source platforms
GitHub
Documentation and maintenance reference score
More documented · 88 / 100
Technologies
Next.js · React
Website type
SaaS · Starter
How this score is calculated

Our heuristic uses license records (up to 30), a demo link (12), a preview (10), stars (15), recorded maintenance (15), description completeness (8), feature records (5) and classification data (5). It is not a code, security or performance test, or a Google score. A link does not establish tested functionality.

What to verify for this project

Repository update recorded
2026-08-26
Screenshot last checked
2026-10-08

A demo link is listed. Check it with your own content and viewport sizes; its presence does not confirm that forms, authentication or payments work.

The catalog identifies Next.js as the primary stack. Check the actual dependency manifest and lockfile for versions and hosting requirements. These notes use recorded metadata, not a code audit or a deployment test.

Use a selection guide →

How this description was prepared

AI-assisted description based on catalog records and repository material. Repository authors are not automatically the reviewers of this description.

Review declaration: [email protected] · 2026-10-08

Inspect the recorded source material

SHA-256: e8bb121c7408e42f49f5a1194208aef2e14b8fca8ed30446bb73beb50df8d7d4

2026-10-08T02:07:10.985Z

Source file / repository
# create-stack

> A SaaS foundation and CLI for scaffolding Next.js or TanStack Start projects.
> Replaceable integrations live behind ports. Integrations with one useful provider
> ship as modules.

[![npm](https://img.shields.io/npm/v/@alfredmouelle/create-stack?color=cb3837&logo=npm&label=create-stack)](https://www.npmjs.com/package/@alfredmouelle/create-stack)
[![license](https://img.shields.io/npm/l/@alfredmouelle/create-stack?color=blue)](./LICENSE)
[![node](https://img.shields.io/node/v/@alfredmouelle/create-stack?color=339933&logo=node.js&logoColor=white)](https://nodejs.org)
[![PRs welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](./CONTRIBUTING.md)

This pnpm and Turborepo monorepo keeps replaceable integrations such as email,
storage, cache, logging, and analytics behind a **port**. Application code depends
on that port. The composition root selects the provider, so switching Resend for
Brevo or S3 for R2 stays local to one place. Jobs use Inngest directly, and error
tracking uses Sentry directly. Those integrations ship as **modules** with their
framework wiring included.

> **Two package names, one project.** `@alfredmouelle/create-stack` is the
> published CLI you install to scaffold a project. `@alfredmouelle/stack` is this
> repo: the private (unpublished) monorepo that develops and ships that CLI.

## Quickstart

Scaffold a project with the selected stack, installed dependencies, verification,
and an initial Git commit:

```bash
pnpm create @alfredmouelle/stack@latest my-app
# equivalent, explicit form (npm / yarn create also work):
pnpm dlx @alfredmouelle/create-stack@latest my-app
```

The wizard asks for the framework, monorepo orchestrator, package manager, import alias,
database, authentication, tRPC, mailer, and capabilities. The CLI forks the matching
base app and applies those choices.

## Why

Every new SaaS project needs the same early work: clean the boilerplate, configure
the checks, install the common libraries, and wire the usual integrations. This
repo keeps that work in one place. The defaults are opinionated, while the
replaceable integrations stay behind adapters. Fork the base apps or change the
defaults to fit your project.

## Capabilities

Each `packages/<capability>/` is a self-contained capability with a
`capability.json` manifest and tests. Its `kind` field defines the wiring model:
a **port** has several adapters selected at the composition root, while a
**module** has one provider, or no provider, and is used directly.

### Ports (swappable)

`src/port.ts` holds the interface, `src/adapters/<name>.ts` one adapter per
provider.

| Capability | Port | Adapters |
|---|---|---|
| **mailer** _reference_ | `send()`: body is always a React Email component, rendered to HTML + text | Resend · Brevo · SES |
| **storage** | `put` / `get` / `delete` / `exists` / `getSignedUrl` | S3 · Cloudflare R2 · GCS · local |
| **cache** | `get` / `set` / `has` / `delete` / `wrap` | Redis · Upstash · in-memory |
| **logger** | `trace`…`error` / `child` | pino · console |
| **analytics** | `capture` / `identify` / `flush` | PostHog · Plausible · noop |

### Modules (used directly)

| Capability | What it is | Provider |
|---|---|---|
| **jobs** | the Inngest client plus the serve wiring: durable steps, cron, concurrency, fan-out and typed events stay reachable | Inngest |
| **error-tracking** | shared `Sentry.init` options plus the per-framework files (`onRequestError`, instrumentation, `global-error`); the steps that edit files you own are printed, not applied | Sentry |
| **email-ui** | composable React Email primitives + **swappable theme** + local preview (`email dev`) | n/a |
| **http** | `apiFetch` (typed fetch) + Web-standard `WebhookHandler` | n/a _(for APIs without an SDK)_ |

Design rules:

- **Pure core.** `packages/*` have zero framework code, except where the
  framework integration *is* the product (the error-tracking wiring).
- **Official SDKs** are always preferred over hand-rolled fetch (except `http`,
  whose whole job is fetch).
- **Provider selection by env var**, with static imports. Use lazy imports and
  per-adapter subexports only when an edge deployment requires them.
- **Abstract a dependency when the abstraction earns its keep.** A single obvious
  implementation stays a module. Jobs need durable steps, cron, concurrency, fan-out,
  and typed events, so the SDK remains visible. Sentry needs request hooks, source
  maps, early instrumentation, and per-request scope isolation, so a small
  `captureException` wrapper would hide the useful parts.

## Structure

```
packages/
  mailer/  email-ui/  storage/  jobs/
  cache/  logger/  analytics/  error-tracking/  http/
apps/
  next-base/        # real Next.js (App Router) starter, fork for a new project
  tanstack-base/    # real TanStack Start starter, fork for a new project
cli/                # create-stack: the published installer that forks a base app
  index.mjs  lib/  templates/   # (biome.jsonc + # Author footer + wiring variants)
skills/
  create-stack/     # run the published create-stack CLI to scaffold a project
  add-capability/   # add a capability into a project behind a port
scripts/
  link-skills.sh    # symlink skills into Claude / Codex
capability.schema.json   # the manifest schema each capability.json follows
```

`apps/*-base` are **real starter apps**. The CLI forks one of them for each new
project. They carry the baseline, including strict Biome, the `~/*` alias, and
typed `env.ts`, without application-specific code. `create-stack` selects the
framework, monorepo orchestrator, package manager, import alias, and stack axes.
`add-capability` adds tools after creation.

## Development

Working on the repo itself (capabilities, CLI, bases):

```bash
pnpm install
pnpm test         # all packages
pnpm typecheck
pnpm check
```

Preview emails locally:

```bash
pnpm --filter @alfredmouelle/email-ui email:dev   # react-email studio on :3001
```

## Skills

The skills live here (versioned) and are symlinked into the agent's config, so
editing them in this repo updates what the agent uses, no copy step.

```bash
pnpm link:skills          # Claude (~/.claude/skills)
pnpm link:skills:codex    # Codex  (~/.codex/prompts)
```

- **`/create-stack`**: create a project with the published
  `@alfredmouelle/create-stack` CLI (framework + stack axes + capabilities, installs &
  inits git).
- **`/add-capability <capability> [adapter]`**: add a capability to the
  current project (e.g. `/add-capability mailer resend`). Ports take an adapter
  argument, modules take none. Server capabilities land in `src/server/<cap>/`,
  pure utils in `src/lib/`, templates in `src/emails/`.

See [`skills/README.md`](./skills/README.md) for details.

## Contributing

Contributions are welcome. Please read the
[Contributing Guidelines](./CONTRIBUTING.md) before opening an issue or PR: they
cover the local setup, the ports & adapters rules, and the commit convention.

## Conventions

- **Package manager:** pnpm · **Tasks:** turbo · **Build:** tsdown · **Tests:** vitest
- **Lint/format:** Biome v2, strict (no semicolons, single quotes, trailing
  commas, `~/*` import alias)
- **Schema validation (apps):** valibot · **Typed env:** `@t3-oss/env-core`
- **Node:** >= 22

## Credits

Inspired by [create-t3-app](https://create.t3.gg) and the work of
[Theo Browne](https://github.com/t3dotgg). Not affiliated with or endorsed by
the T3 project.

## License

[MIT](./LICENSE) © Alfred MOUELLE

---

# Author

Alfred MOUELLE | FullStack Developer

[![ComeUp](https://img.shields.io/static/v1?style=for-the-badge&label=&message=ComeUp&color=yellow)](https://comeup.com/@alfredmouelle)
[![GitHub](https://img.shields.io/badge/GitHub-100000?style=for-the-badge&logo=github&logoColor=white)](https://github.com/alfredmouelle)
[![LinkedIn](https://img.shields.io/badge/LinkedIn-0077B5?style=for-the-badge&logo=linkedin&logoColor=white)](https://www.linkedin.com/in/alfredmouelle)
[![X](https://img.shields.io/badge/Twitter-1DA1F2?style=for-the-badge&logo=twitter&logoColor=white)](https://x.com/alfredmouelle)
[![Gmail](https://img.shields.io/badge/Gmail-D14836?style=for-the-badge&logo=gmail&logoColor=white)](mailto:[email protected])
[![Portfolio](https://img.shields.io/static/v1?style=for-the-badge&label=&message=Portfolio&color=blue)](https://alfredmouelle.com)
Report a correction

Explore similar templates

Compare previews and descriptions within the same stack and category.