automation

Build React apps with puck

Create React apps visually with puck, ideal for founders needing no-code solutions
13,167 stars959 forksTypeScriptGuide quality 9/10Updated 8/20/2026100% free · open source
What it does

Puck is a visual editor that allows you to create React applications without writing code, ideal for non-technical founders who want to build web applications quickly and easily.

When to use it
  • You need to build a web application but don't have extensive coding knowledge
  • You want to rapidly prototype and test a React application without writing code
  • You're looking for a no-code solution to build a web application with a React-based frontend
Ready-to-paste prompt
Run 'puck init my-app' to create a new Puck project called 'my-app' with a basic React setup
Heads up: Make sure you have Node.js (14 or higher) and npm installed on your system before attempting to install and run Puck, as it relies on these dependencies to function correctly
Saves to your device
Use with Claude
New

Skip the builder — one click puts this in Claude, Cursor, Antigravity and more.

✅ Light setup

Installs with a command or two; your AI agent can do it for you.

Try it instantly — no install
Claude Code
mkdir -p ~/.claude/skills/puck && curl -fsSL https://workflowstacks.com/api/skills/puck/claude-skill -o ~/.claude/skills/puck/SKILL.md
Open in another AI app

Opens the app with this repo with the prompt ready to go — no copy-paste needed.

Connect the whole catalog (MCP)
claude mcp add --transport http workflowstacks https://workflowstacks.com/api/mcp

Adds a WorkflowStacks connector to Claude Code: search and load any skill here by chatting.

How Build React apps with puck works
Codeflow
Free to inspect

Build React apps with puck is a large TypeScript project (~22k lines across 439 code files, plus 61 test files). Setup is light: installs like a normal app. Reading the code is optional. Last commit this month, MIT license, has a test suite.

Size
Large codebase
~22k lines · 439 code files · ~3 h to skim
Setup
One-command install
Installs like a normal app. Reading the code is optional.
Runs on
Node.js
No API keys detected
TypeScript 66%MDX 25%CSS 7%JavaScript 2%
Where to start reading
  1. 1
    README.md
    Start here — what it does and how to install it
  2. 2
    package.json
    Dependencies and the commands it exposes
What's in each folder
packages/Sub-packages / plugins454 files
apps/Sub-packages / plugins234 files
recipes/Examples you can copy80 files
scripts/Helper scripts9 files
.github/CI / automation (GitHub Actions)8 files
READMEHas testsDocumentedCI checksMIT licenseUpdated this month
Quick Actions
Details
Creator
puckeditor
Language
TypeScript
Category
automation
Published
6/2/2023

Are you the creator of this tool? Claim your listing → and earn 85% of every sale.