Quickstart
Open the IDE, start a project, preview it, run a Node server and save your work.
On this page
1. Start a project
Link to “1. Start a project”Open codevre.com/ide. The Welcome tab gives you several ways to begin:
- Start from a template. HTML, CSS and JS; Three.js; React (with esbuild); Node.js. View all templates opens the full gallery.
- Upload folder… or Upload files… from your computer. If the workspace is empty, an uploaded folder becomes the project: its contents become the root and its name becomes the project name.
- Clone Git repository… opens the terminal with
git clonetyped for you. Paste the URL and press Enter. Public repositories clone without connecting GitHub. - Open project… (Ctrl+O) lists projects you've saved to Codevre.
- Start with AI. Describe what you want and the Agent builds it. This needs an account, an API key and a model. See The Agent.
You can also link straight to a template: https://codevre.com/ide?template=<id>.
2. Preview a web page
Link to “2. Preview a web page”Create index.html, type some HTML and save. A running preview updates on every save; the first time, start it with any of these:
- Run
vre runin the terminal (orvre run about.htmlfor another page). - Choose Terminal ▸ Run Preview (VRE).
- Right-click an
.htmlfile and choose Preview in VRE.
The page opens in the localhost:codevre tab of the Browser pane, with DevTools underneath. See localhost:codevre.
3. Use the terminal
Link to “3. Use the terminal”Open the terminal with Ctrl+\` (backquote). It's a real shell on Nodepod:
npm init -y
npm install canvas-confetti
node -e "console.log('hello from Node in the browser')"npm install works with the regular npm registry. Packages that need native binaries (such as sharp, sqlite3 or bcrypt) can't run in a browser; use pure-JS alternatives such as bcryptjs or sql.js. See What works in Nodepod.
4. Run a Node server
Link to “4. Run a Node server”// server.js
const http = require('http');
http.createServer((req, res) => res.end('Hello!')).listen(3000);Run node server.js. When the server starts listening, Codevre opens a localhost:3000 tab in the Browser and adds a localhost:3000 link to the status bar. To stop the server, press Ctrl+C in its terminal or click the stop button next to the status-bar link. See Dev servers.
5. Save your project
Link to “5. Save your project”Press Ctrl+S (Cmd+S on Mac) to save the project to your Codevre account. Sign in first if you haven't. Until you save:
- a green dot marks new files that aren't saved to Codevre yet
- an orange dot marks files modified since the last save
Editor tabs are written to the runtime as you type, so the preview and terminal always see your latest code. Saving to Codevre is the separate step that keeps it in your account. See Files and projects.
node_modules is never saved. It is reinstalled when you reopen the project.