GitHub

Getting Started

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

Requirements

Claude Code provides the claude command. Pulse launches it 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.

GitHub Copilot integration is coming soon. For now, Pulse works exclusively with Claude Code.

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

This time, 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 Claude and wiring up the MCP server. Once Claude is open, use /pulse-dev to start the dev server.

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.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
├── package.json
└── pulse.config.js          ← port and project settings

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

The .claude/ directory contains the agent's operating context. CLAUDE.md tells Claude how the project is structured, settings.json configures hooks that catch common mistakes before they reach you — hardcoded hex colours, emoji in UI output, and installing client-side rendering libraries are all flagged or blocked automatically.

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

You can also skip the commands entirely — just describe what you want and the agent handles the rest, including starting the dev server when needed.

Next steps