Micracode
Open-Source AI Web App Builder

Describe an app in natural language and Micracode streams code into an in-browser workspace.
Iterate by chat or edit the code directly in a Monaco editor — everything runs on your laptop.

Your local AI coding workspace — no database, no auth, and cloud sharing only when you ask.

Quick Install

Micracode ships as a desktop app. Download the latest macOS build from the Releases page, open it, and you're ready to go — no Node.js, no Python, no separate backend to run. The core backend runs in-process inside the app.

1. Add an API key

On first launch, open Settings and paste a key for whichever LLM provider you want to use — OpenAI, Google (Gemini), or Anthropic. The model picker shows whichever providers have a key set. Keys are stored locally in a config file on your machine; nothing is sent to a Micracode server.

2. Build something

Type a description on the home screen → Micracode generates a working project
Chat to iterate, edit code in the Monaco editor, and preview your app live
Projects are saved as plain folders at ~/opener-apps/

Getting started & staying tuned with us.

Star us, and you will receive all release notifications from GitHub without any delay!

Features

** Temporary Preview Links** — Explicitly build and share a public static preview through temp.md, then update the same URL or revoke it from the workspace.

Tech Stack

Core backend (`@micracode/core`)

TypeScript — runs in-process inside the Electron main (no spawned child)
pi coding agent SDK — LLM orchestration and tool use
Hono — the /v1 HTTP + SSE app the renderer talks to
Event-sourced — an append-only log backs /v1/events and the live stream

Desktop shell

Electron 33 — packages the web UI + core into a native app
electron-builder + electron-updater — builds and auto-updates releases

Frontend (`apps/web`)

Next.js 15 — React framework with App Router
React 19 — Latest React with concurrent features
Tailwind CSS — Utility-first CSS framework
Radix UI + shadcn/ui — Accessible component primitives
Monaco Editor — VS Code's editor in the browser
Zustand — Lightweight state management
ai-sdk — Vercel AI SDK for chat streaming

Tooling

Bun — JS workspace manager and runtime
TypeScript — End-to-end type safety, with shared types in packages/shared

Development Setup

For contributors and people building from source. If you just want to use Micracode, download it from Releases.

Prerequisites

Node.js v22.18.0 (pinned via .nvmrc)
Bun ≥ 1.1.0
An OpenAI, Google Gemini, or Anthropic API key

Environment Setup

Copy the example env file and add your key(s):

cp .env.example .env
$EDITOR .env

Minimum config (any one provider key works):

NEXT_PUBLIC_API_BASE_URL=http://localhost:8000
OPENAI_API_KEY=your_openai_api_key
# or GOOGLE_API_KEY / ANTHROPIC_API_KEY

Projects are written to ~/opener-apps by default; override with OPENER_APPS_DIR.

Installation

nvm use                # picks up .nvmrc -> Node 22.18.0
bun install            # installs all workspaces (web, core, desktop, shared)

Running the Application

Run the desktop app in dev (web UI + core inside Electron):

bun run desktop

Or run the web + core stack in the browser (no Electron):

bun run dev            # Next.js on :3000, @micracode/core on :8000

You can also run them individually:

bun run dev:web        # Next.js only
bun run dev:core       # @micracode/core only (PORT=8000)

Open http://localhost:3000 (or the desktop window), type a project description into the prompt box, and you're off.

Building a Release

bun run build          # build the Next.js frontend
bun run desktop:release # package a signed macOS app via electron-builder

Project Structure

micracode/
├── apps/
│   ├── web/                    # Next.js 15 frontend (renderer)
│   │   ├── src/
│   │   │   ├── app/            # App Router pages
│   │   │   ├── components/     # React components (incl. shadcn/ui)
│   │   │   ├── lib/            # Utilities, API clients, generated types
│   │   │   └── store/          # Zustand stores
│   │   └── package.json
│   │
│   ├── core/                   # @micracode/core — TS backend (in-process)
│   │   └── src/
│   │       ├── server.ts       # Hono /v1 app
│   │       ├── sessions.ts     # one pi agent run per session
│   │       ├── eventlog.ts     # append-only event log
│   │       ├── storage.ts      # local filesystem project storage
│   │       └── index.ts        # startCoreServer() entry point
│   │
│   └── desktop/                # Electron shell
│       ├── src/main.ts         # imports the core, serves the renderer
│       └── electron-builder.config.js
│
├── packages/
│   └── shared/                 # Shared TypeScript types (stream event contract)
│
├── docs/                       # End-user documentation
└── README.md

API Endpoints

The core exposes a /v1 HTTP + SSE contract that the renderer speaks.

Method	Endpoint	Description
GET	`/v1/health`	Service health check
GET	`/v1/models`	List available LLM models (per configured keys)
GET/POST	`/v1/settings`	Read / update provider keys
POST	`/v1/generate`	Stream code generation events (SSE)
GET/POST	`/v1/projects`	List / create projects
GET/DELETE	`/v1/projects/{id}`	Get / delete a project
GET/PUT	`/v1/projects/{id}/files`	Read / write project files
GET	`/v1/projects/{id}/prompts`	Prompt history
GET/POST/DELETE	`/v1/projects/{id}/temp-preview`	Inspect, publish/update, or revoke a temp.md static preview
POST	`/v1/sessions`	Start an agent session
POST	`/v1/sessions/{id}/turn`	Send a turn to a session
POST	`/v1/sessions/{id}/interrupt` `resume`	Control a running session
DELETE	`/v1/sessions/{id}`	Stop a session
GET	`/v1/events` , `/v1/events/stream`	Event log (poll / SSE)

Some endpoints (VCS/checkpoints, threads, command bus, project download, snapshots) are stubbed and return 501 — see apps/core/README.md for the full status of the vertical slice.

Documentation

End-user docs live in docs/:

Getting Started — install, configure a key, and run the app.
Configuration — environment variables and supported model IDs.
Using the Workspace — the home page, chat, editor, and preview panels.
Projects on Disk — where your generated apps live.
Troubleshooting — common errors and how to fix them.
FAQ — short answers to common questions.

Useful Scripts

bun run desktop        # Electron app in dev (web + core in-process)
bun run dev            # web + core in the browser (:3000 / :8000)
bun run dev:web        # Next.js only
bun run dev:core       # @micracode/core only
bun run build          # build the Next.js frontend
bun run desktop:release # package a macOS release
bun run typecheck      # TS across all workspaces
bun run lint           # eslint across workspaces
bun run format         # prettier

Contributor ♥️

Big thanks to everyone who's been part of the Micracode journey.

Micracode is a community effort, and it keeps getting better because of people like you.

License

This project is licensed under the MIT License.

Contributing

Contributions are welcome! Feel free to open issues and pull requests.

Join our community Discord

Navigation Menu

Repository files navigation

Micracode
Open-Source AI Web App Builder

Quick Install

1. Add an API key

2. Build something

Getting started & staying tuned with us.

Features

Tech Stack

Core backend (`@micracode/core`)

Desktop shell

Frontend (`apps/web`)

Tooling

Development Setup

Prerequisites

Environment Setup

Installation

Running the Application

Building a Release

Project Structure

API Endpoints

Documentation

Useful Scripts

Contributor ♥️

License

Contributing

About

Releases

Packages

Contributors

Languages

Name		Name	Last commit message	Last commit date
apps		apps
docs		docs
packages/shared		packages/shared
.env.example		.env.example
.gitignore		.gitignore
.nvmrc		.nvmrc
CONTRIBUTING.md		CONTRIBUTING.md
LICENSE		LICENSE
README.md		README.md
bunfig.toml		bunfig.toml
demo.gif		demo.gif
package.json		package.json

Latest commit

History

Folders and files

Repository files navigation

Micracode Open-Source AI Web App Builder

Quick Install

1. Add an API key

2. Build something

Getting started & staying tuned with us.

Features

Tech Stack

Core backend (@micracode/core)

Desktop shell

Frontend (apps/web)

Tooling

Development Setup

Prerequisites

Environment Setup

Installation

Running the Application

Building a Release

Project Structure

API Endpoints

Documentation

Useful Scripts

Contributor ♥️

License

Contributing

About

Topics

Resources

Contributing

Stars

Watchers

Forks

Releases

Packages

Contributors

Languages

Micracode
Open-Source AI Web App Builder

Core backend (`@micracode/core`)

Frontend (`apps/web`)