تشغيل أي مهارة في Manus بنقرة واحدة

monorepo-bootstrap

النجوم٣

التفرعات٠

آخر تحديث٣٠ يونيو ٢٠٢٦ في ٢٠:٥١

Scaffold a turborepo monorepo containing both a Next.js web app AND an Expo + RN mobile app, with shared packages (types, design tokens, backend client). Uses pnpm workspaces + turborepo. Reads .workflow/meta.json with stack.framework="monorepo" and phase in {prd_drafted, design_extracted}. Produces: root package.json + pnpm-workspace.yaml + turbo.json + packages/typescript-config + packages/eslint-config; apps/web/ scaffolded via design-md-to-app; apps/mobile/ scaffolded via rn-bootstrap; packages/shared/ + packages/design/ + packages/api/ skeletons. Always idempotent. Use when dev-flow routes here from prd_drafted+monorepo, or the user says "scaffolda il monorepo", "create a turborepo with web + mobile", "bootstrap il monorepo da PRD + DESIGN.md". Not for: scaffolding only web (use design-md-to-app), scaffolding only mobile (use rn-bootstrap), adding modules after scaffold (use module-add or rn-module-add).

التثبيت

التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.

تشغيل في Manus

المصدر

lukedj78

lukedj78/dev-flow

فتح مستودع GitHub عرض مستودعات المنشئ

تنزيل

تشغيل في Manus

المهن ذات الصلةSOC

استنادا إلى تصنيف SOC المهني

مطوّرو البرمجياتمهن الحاسوب والرياضيات·SOC 15-1252

مستكشف الملفات

12 ملفات

SKILL.md

readonly

المزيد من هذا المستودع

نفس المستودع

design-md-to-app

lukedj78/dev-flow

Generate or customize a frontend application from a DESIGN.md (Google design.md spec). Reads the YAML tokens + markdown rationale and produces a working React app whose theme, typography, spacing, radii, and components are pre-styled to match. **Canonical target: Next.js 16 + App Router** (Pages Router or pre-16 explicitly refused). Supports three UI libraries: shadcn/ui (Tailwind + copy-pasted source), Base UI (Tailwind + headless library, no CLI overhead), and MUI (runtime themed, Material-flavored). Supports two form libraries: **TanStack Form + Zod (default, recommended)** or react-hook-form (opt-in). Integrates with the dev-flow contract: when a `.workflow/` exists, reads `meta.json#stack`, writes the app at the project root (alongside `.workflow/`), and bumps phase to `scaffolded`. Use whenever the user has a DESIGN.md and wants to scaffold an app, set up a theme, customize shadcn/Base UI/MUI from these tokens, or "use this DESIGN.md to start an app". Trigger on "DESIGN.md → app", "scaffold from design.

2026-07-183

module-add

lukedj78/dev-flow

Wire a backend or infrastructure module (auth, database, payments, email, file storage, deploy config) into an already-scaffolded app. Reads `.workflow/meta.json#stack` for the chosen tech (better-auth, drizzle+neon, stripe, resend, vercel, etc.) and modifies the codebase at the project root to install + configure the module end-to-end. Always idempotent — running twice does not duplicate config. Use when the user says "add auth", "wire up the database", "set up Stripe", "add file uploads", "configure deploy", "module aggiungi auth", or the orchestrator routes here from phase `scaffolded` / `page_generated`. Not for: scaffolding the app (`design-md-to-app`) or building UI (`screenshot-to-page`).

2026-07-173

eve-agent

lukedj78/dev-flow

Scaffold and manage an eve agent (Vercel's filesystem-first agent framework) inside a monorepo, as the engine behind a Next.js app. Use this skill whenever the user wants to create, set up, or initialize an eve agent; add a tool, skill, channel, connection, schedule, subagent, or hook to an eve agent; wire a Next.js (or any) frontend to consume an eve agent; or evolve the `apps/agent` part of a project. Trigger this for ANY mention of "eve", "the agent engine", "agent tools", "agent backend", or building the agentic core of an app — even if the user does not say the word "skill". This is the eve counterpart to dev-flow's Next.js skills (design-md-to-app / module-add); use it for the agent the same way you'd use those for the web app. Not for: building the Next.js app itself or its pages/forms (use design-md-to-app / screenshot-to-page / module-add), scaffolding the monorepo (use monorepo-bootstrap), or React Native (eve is a server-side engine, not an RN concern).

2026-07-173

screenshot-to-page

lukedj78/dev-flow

Generate a real, working page (route + components) inside an already-scaffolded app from a single UI screenshot, applying the project's DESIGN.md tokens and the existing UI library (shadcn or MUI). Reads a screenshot from `.workflow/screenshots/`, plus `.workflow/DESIGN.md` and `.workflow/meta.json` for tokens and stack, then writes the route into the codebase at the project root. Use when the user says "fai questa pagina dallo screenshot", "build the home page from this image", "/journal route from this PNG", "convert this mockup to code", or the orchestrator routes here from phase `scaffolded` with unmapped screenshots present. Not for: scaffolding the app from scratch (use `design-md-to-app`), extracting tokens from Figma (use `figma-to-design-md`), or wiring backend modules (use `module-add`).

2026-07-173

dev-flow

lukedj78/dev-flow

Orchestrate an end-to-end product-development workflow built on atomic skills. Reads `.workflow/meta.json` in a project directory, figures out what phase the user is in (idea → PRD → tasks → design → scaffolded → pages → modules → tests), and delegates to the right specialist skill: `prd-from-idea`, `prd-to-tasks`, `figma-to-design-md`, `image-to-design-md`, `design-md-to-app`, `screenshot-to-page`, `module-add`, `write-tests`, `forms`, `data-fetching`, `state-discipline`, `eve-agent` (the eve agent engine behind the app). Use when the user wants to "start a new project end-to-end", "advance my project to the next stage", "what should I do next on this project", or pastes a brand-new product idea / Figma URL / inspiration images with a request to "build the app". Not for: deeply-specialized work inside one stage (in that case, invoke the specialist skill directly).

2026-06-293

data-fetching

lukedj78/dev-flow

Read data in a Next.js 16 App Router app the canonical way — async Server Components first, URL `searchParams` for filter/tab/range state, `Promise<T>` + `use()` + `<Suspense>` when a Client Component genuinely needs server data, and Route Handlers + SWR/React Query only as a last resort (polling / focus refetch / third-party-mutated data). Server Actions are for mutations only — never reads. Use when the user is about to call a Server Action from a Client Component to load data, about to add `useEffect` to fetch, about to convert a page to `"use client"` for filter state, or pastes `useState + useEffect + fetch` in a Client Component. Refuses to apply if `meta.json#stack.framework != "next"` (or monorepo web side) or `stack.nextjs_version != "16"`. Pairs with the `state-discipline` skill — `useEffect` is never recommended here. Not for: form persistence and Save semantics (use `forms`), local UI state that is not server data (use `state-discipline`), React Native data fetching (RN does not have Server Compon

2026-06-063

name

monorepo-bootstrap

description

monorepo-bootstrap — scaffold a turborepo monorepo

Contract

See references/contracts.md (vendored from dev-flow). Key facts:

Reads <project-root>/.workflow/meta.json#stack.framework — must be "monorepo".
Requires meta.json#phase in {prd_drafted, design_extracted}.
Reads PROJECT.md, PRD.md, and DESIGN.md from project root (DESIGN.md required for tokens; falls back to defaults if absent).
Writes the monorepo at project root: apps/{web,mobile}/, packages/{shared,design,api}/, root config files.
Transitions phase: prd_drafted → monorepo_initialized (root scaffold done) → scaffolded (both apps + packages exist).
Always idempotent: re-running detects existing files, skips, reports.

When this skill applies

Orchestrator routes here from dev-flow when stack.framework="monorepo" and phase ∈ {prd_drafted, design_extracted}.
User says: "scaffolda il monorepo", "create a turborepo", "bootstrap il monorepo".

Knowledge dependencies (read these first)

rn-fundamentals/SKILL.md — Expo SDK + New Architecture + TS for the mobile side.
rn-bootstrap/SKILL.md — how the mobile side is scaffolded; this skill invokes it.
rn-styling/references/nativewind-setup.md — for the mobile Tailwind config.
design-md-to-app/SKILL.md — how the web side is scaffolded; this skill invokes it.
design-md-to-app/references/<lib>-mapping.md — based on stack.monorepo.web.ui.
references/structure.md — full monorepo layout (this file lives in this skill's references).
references/patterns.md — turborepo conventions, pnpm protocols.

Workflow

Step 1 — Verify preconditions

Read .workflow/meta.json. Abort with clear message if:

stack.framework != "monorepo" → "Wrong stack. For mobile-only use rn-bootstrap; for web-only use design-md-to-app."
phase ∉ {prd_drafted, design_extracted, monorepo_initialized} → "Expected phase prd_drafted/design_extracted/monorepo_initialized, got X."
stack.monorepo.web.framework missing → ask user (default: "next").
stack.monorepo.web.ui missing → ask user (default: "shadcn").
stack.monorepo.mobile.framework missing → set to "expo-rn" (only valid value for v1).
stack.monorepo.mobile.ui → set to "nativewind" (only valid value).

If apps/ + packages/ + pnpm-workspace.yaml already exist at project root: print "Already initialized at phase X, skipping root scaffold" and proceed to Step 4.

Step 2 — Scaffold the root

Run scripts/init-monorepo.sh <project-root> <project-slug>:

Writes pnpm-workspace.yaml listing apps/* and packages/*.
Writes turbo.json with the pipeline definition (build/dev/lint/test/typecheck).
Writes root package.json with name @<project-slug>/root, scripts that proxy to turbo.
Writes packages/typescript-config/ with base.json (path aliases, strict mode), nextjs.json, react-native.json preset extensions. Also writes packages/eslint-config/. No tsconfig.base.json in repo root — Turborepo official pattern.
Creates empty dirs: apps/web/, apps/mobile/, packages/shared/, packages/design/, packages/api/.

Update meta.json:

stack_config.monorepo_tool = "turborepo"
stack_config.workspace_pm = "pnpm"
stack_config.shared_packages = [] (filled by Step 6)
phase = "monorepo_initialized"

Step 3 — Scaffold `packages/design/` from DESIGN.md

Generate packages/design/:

src/tokens.ts — parses .workflow/DESIGN.md json tokens block, emits typed JS object.
src/tailwind-preset.ts — exports a Tailwind preset (web v3.4 / v4 compatible) consuming the tokens.
src/nativewind-preset.ts — exports a NativeWind preset (Tailwind 3.4 syntax, mobile-compatible).
package.json with name @<project-slug>/design, exports ./tokens, ./tailwind, ./nativewind.
tsconfig.json extending @<slug>/typescript-config/<preset>.json (e.g., nextjs.json for apps/web, react-native.json for apps/mobile).

This package is published as workspace:* to both apps.

Step 4 — Scaffold `apps/web/` via `design-md-to-app`

Invoke design-md-to-app with:

cwd = <project-root>/apps/web/
DESIGN.md path = <project-root>/.workflow/DESIGN.md
stack.ui = meta.json#stack.monorepo.web.ui (e.g. "shadcn")
Special instruction: in the generated tailwind.config.js, the presets array MUST include require("@<project-slug>/design/tailwind") — this is how the design tokens reach the web app.
Skip the /showcase route's auto-creation if user already wants minimalist setup; otherwise let design-md-to-app create it as normal.

Update meta.json#stack.monorepo.web with any user choices recorded by design-md-to-app.

Step 5 — Scaffold `apps/mobile/` via `rn-bootstrap`

Invoke rn-bootstrap with:

cwd = <project-root>/apps/mobile/
DESIGN.md path = <project-root>/.workflow/DESIGN.md
Special instruction: the generated tailwind.config.js MUST include presets: [require("@<project-slug>/design/nativewind")] so the design tokens reach the mobile app.

Update meta.json#stack.monorepo.mobile with any choices.

Step 6 — Scaffold `packages/shared/` skeleton

Create minimal scaffold:

src/index.ts — barrel export.
src/types/.gitkeep, src/validators/.gitkeep, src/utils/.gitkeep.
package.json with name @<project-slug>/shared, main ./src/index.ts.
tsconfig.json extending base.

Update meta.json#stack_config.shared_packages with the array ["@<project-slug>/shared", "@<project-slug>/design", "@<project-slug>/api"].

Step 7 — Scaffold `packages/api/` skeleton

Create minimal scaffold (a wrapper that will be filled by module-add later):

src/index.ts — barrel.
src/client.ts — placeholder for the backend client (Supabase / tRPC, decided when auth module is added).
package.json with name @<project-slug>/api.
tsconfig.json extending base.

Don't install the actual backend client here — that's module-add / rn-module-add's job. Just the skeleton.

Step 8 — Install dependencies + verify

Run from project root:

pnpm install --recursive

Then verify:

pnpm tsc --noEmit from apps/web/, apps/mobile/, and each packages/*/ succeeds.
pnpm turbo dev --dry-run lists all 5 workspaces.

If any verify fails, do NOT bump phase. Report and stop.

Step 9 — Update meta.json + commit

{
  "stack": { "framework": "monorepo", "monorepo": { "web": {...}, "mobile": {...} }, ... },
  "stack_config": {
    "monorepo_tool": "turborepo",
    "workspace_pm": "pnpm",
    "shared_packages": ["@<project-slug>/shared", "@<project-slug>/design", "@<project-slug>/api"]
  },
  "phase": "scaffolded",
  "history": [..., {"skill": "monorepo-bootstrap", "ran_at": "<iso>", "outputs": [...]}]
}

If git repo: commit with chore: scaffold monorepo (web + mobile + shared packages).

Common anti-patterns (NEVER do)

❌ Try to use yarn or npm workspaces instead of pnpm — turborepo + Expo officially support pnpm best.
❌ Generate Tailwind config in apps/web/ without the @<project-slug>/design/tailwind preset — design tokens won't reach the web app.
❌ Generate tailwind.config.js in apps/mobile/ without the nativewind preset — same problem mirrored.
❌ Install backend client (supabase-js, tRPC) at root — must live in packages/api/, consumed via workspace protocol.
❌ Add tsconfig.base.json in repo root — Turborepo recommends per-package configs that extend a shared package (packages/typescript-config). Don't centralize in root.
❌ Use framework="monorepo" on a project that already has scaffolded code (mid-project switch) — this skill is for fresh projects only.

Updating meta.json (recommended pattern)

When this skill modifies state (artifact written, phase advanced, history appended), use the canonical script when available:

# Wherever dev-flow is installed (e.g. ~/.claude/skills/dev-flow/), invoke:
python3 .../dev-flow/scripts/update_meta.py <project-root> record-artifact \
    --path <relative-path> --produced-by 'monorepo-bootstrap' [--derived-from <p1> <p2> ...]
python3 .../dev-flow/scripts/update_meta.py <project-root> set-phase <new_phase>
python3 .../dev-flow/scripts/update_meta.py <project-root> append-history \
    --skill 'monorepo-bootstrap' --inputs '{...}' --outputs '{...}' --phase-after <new_phase>

The script enforces phase monotonicity, normalizes legacy kebab-case aliases (e.g. module-added → module_added), and writes the canonical sha256 + timestamp into meta.json#artifacts. Fall back to direct JSON editing only if the script is not on PATH (and warn the user).

Sources

Spec: docs/superpowers/specs/2026-05-29-monorepo-set-design.md
Official: https://turbo.build/repo/docs
Official: https://pnpm.io/workspaces
Official: https://docs.expo.dev/guides/monorepos/
Course: codewithbeto.dev/rnCourse — (no direct monorepo coverage; assembled from official sources).

monorepo-bootstrap

المزيد من هذا المستودع

المزيد من هذا المستودع

monorepo-bootstrap — scaffold a turborepo monorepo

Contract

When this skill applies

Knowledge dependencies (read these first)

Workflow

Step 1 — Verify preconditions

Step 2 — Scaffold the root

Step 3 — Scaffold packages/design/ from DESIGN.md

Step 4 — Scaffold apps/web/ via design-md-to-app

Step 5 — Scaffold apps/mobile/ via rn-bootstrap

Step 6 — Scaffold packages/shared/ skeleton

Step 7 — Scaffold packages/api/ skeleton

Step 8 — Install dependencies + verify

Step 9 — Update meta.json + commit

Common anti-patterns (NEVER do)

Updating meta.json (recommended pattern)

Sources

monorepo-bootstrap — scaffold a turborepo monorepo

Contract

When this skill applies

Knowledge dependencies (read these first)

Workflow

Step 1 — Verify preconditions

Step 2 — Scaffold the root

Step 3 — Scaffold packages/design/ from DESIGN.md

Step 4 — Scaffold apps/web/ via design-md-to-app

Step 5 — Scaffold apps/mobile/ via rn-bootstrap

Step 6 — Scaffold packages/shared/ skeleton

Step 7 — Scaffold packages/api/ skeleton

Step 8 — Install dependencies + verify

Step 9 — Update meta.json + commit

Common anti-patterns (NEVER do)

Updating meta.json (recommended pattern)

Sources

Step 3 — Scaffold `packages/design/` from DESIGN.md

Step 4 — Scaffold `apps/web/` via `design-md-to-app`

Step 5 — Scaffold `apps/mobile/` via `rn-bootstrap`

Step 6 — Scaffold `packages/shared/` skeleton

Step 7 — Scaffold `packages/api/` skeleton

Step 3 — Scaffold `packages/design/` from DESIGN.md

Step 4 — Scaffold `apps/web/` via `design-md-to-app`

Step 5 — Scaffold `apps/mobile/` via `rn-bootstrap`

Step 6 — Scaffold `packages/shared/` skeleton

Step 7 — Scaffold `packages/api/` skeleton