GitHub

Getting Started

Install Pulse, run one command, and have an AI agent building your first page — with streaming SSR, security headers, and a 100 Lighthouse score already in place.

Requirements

  • Node.js 22 or laternodejs.org
  • Google Chrome — used by the agent for screenshots and Lighthouse audits — google.com/chrome
  • An AI agent — Claude Code or GitHub Copilot CLI (pick one):

Pulse launches your chosen agent automatically with the Pulse MCP server wired in — so the agent has instant access to the framework reference, your project structure, and all Pulse tools without any manual configuration.

Install Pulse

Install the Pulse CLI globally:

npm install -g @invisibleloop/pulse

Create your project

Run pulse in any empty directory:

mkdir my-app
cd my-app
pulse

Pulse detects the directory is empty and scaffolds a project there. It creates the project files, installs dependencies, and exits with:

✓ Project ready. Run `pulse` again to start your AI session.
Running pulse in a non-empty directory prompts for a project name, then creates and scaffolds a subdirectory with that name — so you can run it from anywhere.

Start a session

Run pulse again from inside your project directory:

pulse

Pulse detects the existing project and launches Claude Code with the Pulse MCP server already connected. Claude opens with the complete framework guide loaded, your project structure visible, and all Pulse tools available — ready to build immediately.

Run pulse every time you open a working session. It handles starting the agent and wiring up the MCP server. Once the agent is open, use /pulse-dev (Claude) or the build-page skill (Copilot) to start the dev server.

Using GitHub Copilot

To use GitHub Copilot CLI instead of Claude, pass the --agent flag when scaffolding:

pulse --agent copilot

This scaffolds the project and writes agent: 'copilot' into pulse.config.js — so subsequent pulse runs pick up the preference automatically. You can also set it manually in pulse.config.js at any time:

export default {
  agent: 'copilot',
}

When using Copilot, project skills (build-page, verify, new-doc-page) are available via the /skills command inside the Copilot CLI session. The Pulse MCP server is automatically injected into your Copilot MCP config for the duration of the session and removed cleanly on exit.

Build your first page

Once Claude opens, start the dev server and ask for something:

/pulse-dev

"Create a contact form with name, email, and message fields.
Validate the email format before submitting."

The agent will:

  1. Fetch the Pulse guide from the MCP server — spec format, component library, quality rules
  2. Check what pages already exist in your project
  3. Write the spec — route, state, validation, action lifecycle, view
  4. Validate it against the schema and fix every error and warning
  5. Open the page in the browser and confirm it looks right

You do not need to explain Pulse to the agent. The MCP server supplies the reference. Just describe what you want.

What got created

When you ran pulse in step 2, these files were written to your directory:

my-app/
├── src/
│   ├── pages/
│   │   └── home.js          ← your first page spec (a working counter)
│   └── components/          ← shared view components go here
├── public/
│   ├── app.css              ← global stylesheet
│   ├── pulse-ui.css         ← Pulse component library styles
│   └── pulse-ui.js          ← Pulse component library behaviour
├── .claude/                 ← Claude Code agent context
│   ├── CLAUDE.md            ← session instructions Claude reads on startup
│   ├── settings.json        ← hooks: syntax checks, colour guards, package blocklist
│   ├── pulse-checklist.md   ← spec review checklist, kept in sync by Pulse
│   └── commands/            ← slash commands available inside Claude
│       ├── pulse-dev.md
│       ├── pulse-stop.md
│       ├── pulse-build.md
│       └── pulse-start.md
├── .copilot/                ← GitHub Copilot CLI agent context
│   └── skills/              ← project skills available inside Copilot
│       ├── build-page/
│       ├── verify/
│       └── new-doc-page/
├── .github/
│   ├── copilot-instructions.md          ← session instructions for Copilot
│   └── instructions/
│       └── pulse-checklist.instructions.md
├── package.json
└── pulse.config.js          ← port, agent, and project settings

src/pages/home.js is a complete working spec — a counter with increment and decrement buttons. Open localhost:3000 after starting the dev server to see it. Every new page you create goes into src/pages/ and is discovered automatically.

The .claude/ directory contains the Claude agent's operating context. The .copilot/ directory contains the equivalent context for GitHub Copilot — project skills and instructions. Both are scaffolded by default so you can switch agents at any time.

Agent commands

These slash commands are available once Claude is open:

/pulse-dev     # start (or restart) the dev server
/pulse-stop    # stop the dev server
/pulse-build   # production build → public/dist/
/pulse-start   # run the production server
/pulse-report  # Lighthouse audit + performance report

When using GitHub Copilot CLI, the equivalent capabilities are available as project skills. Type /skills inside Copilot to browse them — build-page, verify, and new-doc-page are all pre-installed.

You can also skip commands and skills entirely — just describe what you want and the agent handles the rest.

Keeping up to date

When a new version of Pulse is released, update the package and then run pulse update from your project root:

npm update @invisibleloop/pulse
pulse update

pulse update copies the latest UI assets and agent files into your project:

  • public/pulse-ui.css and public/pulse-ui.js — component library styles and behaviour
  • .claude/pulse-checklist.md and .claude/commands/ — Claude agent files
  • .copilot/skills/ — Copilot project skills
  • .github/instructions/pulse-checklist.instructions.md — Copilot checklist

Your own source files, CLAUDE.md, .github/copilot-instructions.md, and pulse.config.js are never touched.

Next steps