https://github.com/parvezk/uigen
React UI component generator
https://github.com/parvezk/uigen
Last synced: 4 months ago
JSON representation
React UI component generator
- Host: GitHub
- URL: https://github.com/parvezk/uigen
- Owner: parvezk
- Created: 2026-02-26T01:51:29.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2026-02-26T07:25:05.000Z (4 months ago)
- Last Synced: 2026-02-26T08:04:25.839Z (4 months ago)
- Language: TypeScript
- Size: 1.72 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Security: docs/security-audit-2026-02.md
Awesome Lists containing this project
README
# UIGen
AI-powered React component generator with live preview.
## Prerequisites
- Node.js 18+
- npm
## Setup
1. **Optional** Edit `.env` and add your Anthropic API key:
```
ANTHROPIC_API_KEY=your-api-key-here
```
The project will run without an API key. Rather than using a LLM to generate components, static code will be returned instead.
2. Install dependencies and initialize database
```bash
npm run setup
```
This command will:
- Install all dependencies
- Generate Prisma client
- Run database migrations
## Running the Application
### Development
```bash
npm run dev
```
Open [http://localhost:3000](http://localhost:3000)
## Usage
1. Sign up or continue as anonymous user
2. Describe the React component you want to create in the chat
3. View generated components in real-time preview
4. Switch to Code view to see and edit the generated files
5. Continue iterating with the AI to refine your components
## Features
- AI-powered component generation using Claude
- Live preview with hot reload
- Virtual file system (no files written to disk)
- Syntax highlighting and code editor
- Component persistence for registered users
- Export generated code
## Tech Stack
- Next.js 15 with App Router
- React 19
- TypeScript
- Tailwind CSS v4
- Prisma with SQLite
- Anthropic Claude AI
- Vercel AI SDK
# uigen