Triple — web + admin + API

The SaaS shape. The recommended starter for most products.

6 mineasy

Triple is the SaaS shape — three apps in one monorepo. It's the most common mode you'll use, the one this course's scaffolded project is built in, and the recommended starting point for almost every multi-tenant product.

The three apps

apps/web/      Public site + customer dashboard. Built with Next.js.
apps/admin/    Filament-style admin panel. Built with Next.js.
apps/api/      Go API serving both. Gin + GORM.

Who uses each surface?

web — your customers. Marketing pages + the logged-in dashboard.
admin — your staff. Sales sees customers, support edits orders, ops triggers refunds.
api — both of the above + future mobile + desktop. One backend, multiple surfaces.

Why split web and admin?

Separate domains, separate concerns:

Different auth scopes. Customers can't log into the admin panel; staff doesn't need to sign up for customer accounts.
Different SEO needs. The public site is marketing-optimized; the admin is behind auth, no SEO.
Different shipping cadence. Marketing changes weekly; admin features change on a different rhythm.
Different attack surface. Admin can sit behind a VPN or IP allow-list; the public site can't.

What's shared

One thing matters most: packages/shared.

packages/shared/src/schemas/   Zod schemas — web and admin both validate the same way.
packages/shared/src/types/     Generated TS types — both apps know what a Product looks like.
packages/shared/src/constants/ Route paths, enum values, shared constants.

Both Next.js apps import @workspace/shared and they always agree on schemas + types. No drift.

The admin panel writes itself. When you generate a resource, defineResource() in apps/admin/app/resources/ auto-renders a CRUD page — you don't write HTML or form code. The deep dive on this is in the Web (Next.js) course.

Deployment shape

You can ship triple in two ways:

All three on one box with a reverse proxy (Traefik) routing web.example.com → apps/web, admin.example.com → apps/admin, api.example.com → apps/api. Simplest for small teams.
Apps deployed independently. apps/web on Vercel, apps/admin on a private box, apps/api on a VPS. Most flexible.

Quick check

Your customer wants a feature where staff can refund any order. Where do you put each part of it?

Try it

Look at your scaffolded triple project. Pick one feature (signup, login, the admin's users page) and trace it across all three apps. In notes.md, list:

Where in apps/web is the UI?
Where in apps/admin is the matching admin view?
Where in apps/api is the handler + service?
Where in packages/shared is the Zod schema?

What's next

Single and triple cover the two extremes. Next we cover the three specialized modes — API-only, Mobile, Desktop — for when you want one slice instead of the full triple.

Spot a typo? Have an idea?

Help us improve this lesson. One click opens a GitHub issue with the lesson URL pre-filled — suggest clearer wording, report a bug, or request more depth. The course keeps improving thanks to learners like you.

Suggest an improvement on GitHub

Previous lesson Next lesson