devjar

Live Playground & Static Site Builder

Designed for agents. Zero config. No npm install. CDN powered.

Build a website with Devjar. Follow https://devjar.vercel.app/llms.txt

npm install devjar

npx devjar dev
npx devjar build

React Live Playground

VPGU playgroundWatch the code change live

vgpu.ts

1// Warm — change a number to reshape the light.2export const appearance = {3  speed: 0.35,  // 0 freezes time.4  scale: 2.4,   // Zoom into the pattern.5  warp: 1.2,    // Twist the flowing bands.6  hue: 0.15,    // Try 0.6 for a new palette.7  bands: 3,     // More bands, finer ribbons.8}

Gallery

See the code change as you scroll. Make it your own in the editor.

Drum machine

patterns/pocket.ts

1// 1 = hit, 0 = rest. Each group is one beat.2// Rows: kick, snare, hi-hat, clap.3export default [4    [1,0,0,0, 0,0,1,0, 1,0,0,0, 0,0,0,0],5    [0,0,0,0, 1,0,0,0, 0,0,0,0, 1,0,0,0],6    [1,0,1,0, 1,0,1,0, 1,0,1,0, 1,0,1,1],7    [0,0,0,0, 0,0,0,0, 0,0,0,0, 1,0,0,0],8]

CMS example

content.json

1{2  "name": "devjar",3  "tagline": "Make an idea real. Change it live.",4  "category": "Features",5  "title": "Your next idea, already live.",6  "description": "Write React pages, edit their content, and see your changes in the preview. Start with an idea and keep going.",7  "about": "Devjar is a zero-config React static site builder. Create pages with React and TypeScript, share components between routes, and build a static site from the same files.",8  "entries": [9    {10      "title": "See changes as you make them",11      "category": "Live updates",12      "step": "01"13    },14    {15      "title": "One file. Another page.",16      "category": "File-based routing",17      "step": "02"18    },19    {20      "title": "Build a site you can take anywhere",21      "category": "Static output",22      "step": "03"23    }24  ]25}26

Static Site Builder

Build a static site. Deploy it anywhere.

From your project foldernpx devjar build

$ npx devjar dev

Local: http://localhost:3000

$ npx devjar build

dist
├── index.html
└── _jar      HTML, CSS & JS

$ npx vercel dist --prod

[====================] uploaded

+ Your website is live.

A LITTLE IDEA, OUT IN THE WORLD

Hello,
internet.

A space for what comes next.

Deploy example uses Vercel CLI. Sign in and follow the setup prompts on your first deploy.