Skip to content

smariconde/app_atelier

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

15 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

AppAtelier

AppAtelier

Build your own private app store. One repo, one deploy, infinite installable PWAs — described in plain language to a team of AI agents.

License: MIT CI PRs Welcome Built with Claude PWA Node.js ≥20 pnpm ≥10 Next.js 15


What is AppAtelier?

AppAtelier is a clonable Next.js template that turns plain-language briefs into installable PWAs. You get a launcher at yourdomain.com, a PWA per app at its own subdomain (notes.yourdomain.com, fitness.yourdomain.com), and an AI studio of 12 specialized Claude agents that scaffolds, builds, themes, and deploys each app from your description.

One repo. One Vercel project. One wildcard DNS record. Every app you'll ever create — automatically live at its subdomain. Built for an audience of one: you.


Preview

AppAtelier Hub — web launcher showing all your installed PWAs as an icon grid

Tasks PWA — task manager app with priorities and due dates    Habits PWA — habit tracker with daily streak counting

The hub (top) shows your launcher at yourdomain.com. Below: Tasks and Habits — two of the four included example PWAs, each at its own subdomain and individually installable. All shown on mobile where they're designed to be installed and used.


Quick start

Requirements: Node.js ≥20, pnpm ≥10, Claude Code (for the AI studio).

git clone https://github.com/smariconde/app_atelier.git
cd app_atelier
pnpm install
cp .env.example .env
pnpm db:setup
pnpm dev

Open localhost:3000 — that's your hub. The example apps live at notes.localhost:3000, tasks.localhost:3000, habits.localhost:3000, and daily-briefing.localhost:3000 — each individually installable as a PWA.


Build your first app

With Claude Code open in the repo, run:

/create-app

Then describe what you want:

"A finance tracker that separates expenses by life area — work, health, home — and shows me a monthly trend for each."

The studio drafts a spec, you approve it, agents build the schema, pages, theme, and PWA. A few minutes later, a new icon appears on your hub and the app is installable on your phone.

Prefer to scaffold manually? pnpm new-app finance --interactive.


How it works

DNS: yourdomain.com + *.yourdomain.com → Vercel (one project)
                               │
                    ┌──────────▼──────────┐
                    │   Next.js middleware │
                    │   routes by hostname │
                    └──────────┬──────────┘
                               │
       ┌───────────────────────┼───────────────────────┐
       ▼                       ▼                       ▼
yourdomain.com        notes.yourdomain.com    fitness.yourdomain.com
Web launcher          Independent PWA         Independent PWA
(icon grid)           own SW, storage         own SW, storage

Middleware reads each request's Host header and rewrites internally to /apps/<subdomain>. From the browser's perspective, every subdomain is a fully isolated origin — its own service worker, storage, and install prompt. From your infrastructure, it's one repo and one deploy.

See docs/architecture.md for the full picture.


The AI Studio

The studio lives in .claude/: 12 specialized agents coordinated by 7 slash-command skills. Every spec, change plan, and deploy passes through a user-approval gate — agents do the work, you make the decisions.

Agents and skills (expand)

Leads — coordinate at the product/design level:

Agent Role
product-lead Plain-language brief → concrete spec (schema, routes, integrations)
tech-lead Plans modifications to existing apps with an approval gate
design-lead Defines visual identity: palette, icon, typography

Specialists — execute the work:

Agent Role
app-architect Scaffolds the app folder from _template
app-builder Writes pages, components, and server actions
pwa-specialist Manifest, service worker, install prompt, icon set
db-migrator Schema, migrations, table prefixes
ui-designer Implements the design lead's identity
mcp-integrator Connects MCP servers (Gmail, Calendar, Notion, Drive)
deployer Vercel deploy + subdomain routing
qa-auditor Lighthouse, PWA manifest, a11y
architecture Read-only codebase Q&A

Skills — the workflows that orchestrate agents:

Skill Use when you say…
/create-app "I want an app that…" / "Build me a…"
/modify-app "Change X" / "Add Y to my app"
/theme-app "Make it feel more like…" / "Change the colors"
/add-mcp "Connect it to my Gmail / Calendar / Notion"
/deploy-app "Ship it" / "Push to production"
/pwa-audit "Is it installable?" / "Check Lighthouse"
/delete-app "Remove the X app"

Read docs/ai-studio.md for the full agent system.


Deploy to production

vercel --prod

Then in your DNS provider, add two records:

  • Apex yourdomain.com → A/ALIAS to Vercel
  • Wildcard *.yourdomain.comcname.vercel-dns.com

Add both as custom domains in the Vercel dashboard. The wildcard covers every app you'll ever create — no per-app projects, no per-app DNS.

Using a Vercel-provided domain? Add *.yourproject.vercel.app as well.

After this, every vercel --prod makes new apps live at their subdomain automatically. See docs/deployment.md.


Tech stack

Layer Choice
Framework Next.js 15 (App Router, RSC, Server Actions)
UI React 19, Tailwind CSS, shadcn/ui
Database Drizzle ORM — SQLite (default), Turso, Postgres, MySQL, Cloudflare D1
Auth Better Auth — cross-subdomain SSO out of the box
PWA Native Next.js manifest + Serwist service workers
AI Claude Code agents + skills, Anthropic SDK, MCP servers
Deploy Single Vercel project + wildcard DNS

Switch backends with one env variable (DB_ADAPTER=sqlite|turso|postgres|mysql|d1). See docs/backend-options.md.


PWA details

  • Subdomain isolation — each app has its own origin, service worker, and storage. Uninstalling Notes doesn't touch Fitness.
  • Native Next.js 15 manifest + Serwist for service workers (the maintained successor to next-pwa).
  • Lighthouse-gatedqa-auditor blocks deploy if any PWA score < 90.

Deeper dive: docs/pwa-deep-dive.md.


Documentation


What this is not

  • ❌ Not a SaaS template — there's one user (you). For multi-tenant, use Makerkit.
  • ❌ Not a homelab dashboard — for link launchers, use Dashy.
  • ❌ Not a Notion replacement — for general-purpose knowledge tools, use Notion.
  • ❌ Not a marketplace — your apps are yours, not distributed to others.

Contributing

AppAtelier is v1.0 and actively maintained. The most valuable contributions: example apps you've built for yourself, new agents/skills, non-Vercel deploy guides (Coolify, Fly.io, self-hosted), bug reports.

See CONTRIBUTING.md · ROADMAP.md · Issues · Discussions.


License

MIT — build whatever you want for yourself.


"The future isn't just big generic apps. It's ultra-niche, ultra-personalized apps that each individual can create for their exact needs."Naval Ravikant

Inspired by Claude-Code-Game-Studios · shadcn/ui · Anthropic Skills · web.dev multi-PWA

The App Store era gave everyone access to the same apps. The AI era gives everyone access to their own.

About

Build your own private app store. Clone, describe an app to a 12-agent Claude studio, get an installable PWA at its own subdomain. One Next.js project, one Vercel deploy, wildcard DNS. Naval's "one-shot apps" paradigm, made real.

Topics

Resources

License

Contributing

Stars

0 stars

Watchers

0 watching

Forks

Releases

No releases published

Packages

 
 
 

Contributors