Agent skill · DevOps & Cloud

journey-frontend

Use as the frontend build stage of the Butterbase journey. Implements the Frontend section of 02-plan.md by delegating to deploy-frontend. Scaffolds (if needed) and deploys via create_frontend_deployment + manage_frontend (start_deployment). Sets VITE_API_URL and VITE_APP_ID env. Skipped if the plan is API-only.

butterbase.ai2,831★ · +400/wk · 1 repos on radarProfile →
claude-codeMIT
Install
npx skills add butterbase-ai/butterbase-skills --skill journey-frontend --agent claude-code

Same command for any agent — swap --agent for codex, cursor, copilot.

Facts
Files in the skill folder: 1
SKILL.md size: 3 KB
Bundled scripts: none
Path: skills/journey-frontend/SKILL.md
Open the folder on GitHub →
Where it comes from
Stars: 532

Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.

From the SKILL.md

# Journey: Frontend Stage 3j of the guided journey. Build (or adopt) and deploy the frontend. ## When to use - Dispatched by `journey` when `current_stage: frontend`. - Directly via `/butterbase-skills:journey-frontend`. - Skipped (annotated `(n/a)`) if `frontend_stack: none` in `00-state.md`. ## Preflight If `docs/butterbase/03-preflight.md` is missing, older than 24 hours, or `00-state.md` has `app_id: null`, invoke `butterbase-skills:journey-preflight` first. Wait for it to return successfully before proceeding. ## Inputs - `docs/butterbase/02-plan.md` — the Frontend section. - `docs/butterbase/00-state.md` — for `app_id`, `api_base`, `frontend_stack`. ## Procedure 0. **Refresh docs.** Call `butterbase_docs` with `topic: "frontend"`. For framework-specific deploy patterns, also WebFetch `https://docs.butterbase.ai/frontend`. Skip if cache is fresh. ### Use `@butterbase/sdk` Any frontend that talks to the deployed Butterbase app should use `@butterbase/sdk`: - Install: `npm install @butterbase/sdk` inside the frontend project. - Initialize: `import { createClient } from '@butterbase/sdk'; const bb = createClient({ apiUrl: import.meta.env.VITE_API_URL, appId: import.meta.env.VITE_

What's inside
Steps it walks through
  1. When to use
  2. Preflight
  3. Inputs
  4. Procedure
  5. Use @butterbase/sdk
  6. Build and deploy
  7. Outputs
  8. Anti-patterns
More from butterbase-skills
All skills →
About this skill
What does the journey-frontend skill do?

Use as the frontend build stage of the Butterbase journey. Implements the Frontend section of 02-plan.md by delegating to deploy-frontend. Scaffolds (if needed) and deploys via create_frontend_deployment + manage_frontend (start_deployment). Sets VITE_API_URL and VITE_APP_ID env. Skipped if the plan is API-only.

How do I install it?

Run `npx skills add butterbase-ai/butterbase-skills --skill journey-frontend --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.

Where does this skill come from?

From butterbase-ai/butterbase-skills, a repository with 532 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.

Is a popular skill a good skill?

Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.

Keep going