Browser IDE

The LaraCopilot IDE is a full development environment that runs entirely in your browser. No local setup, no Docker, no environment configuration — everything runs on a managed container.

IDE overview

The IDE is split into several panels:

File Explorer

The left sidebar shows your project's full directory tree.

• Click a file to open it in the editor
• Expand/collapse folders by clicking them
• Files are colour-coded by type (PHP, JS, CSS, Blade, etc.)

Creating files and folders:

• Right-click a folder to see the context menu
• Options include: New File, New Folder, Upload File

Uploading files:

• Drag and drop files onto the explorer
• Or use the Upload option in the context menu
• Useful for adding images, config files, or seed data

Code Editor

The editor is built on Monaco Editor (the same engine as VS Code).

• Full syntax highlighting for PHP, JavaScript, TypeScript, CSS, Blade, JSON, and more
• Code folding, line numbers, and a minimap on the right
• Auto-completion for common patterns
• Save: Ctrl + S (Windows/Linux) or Cmd + S (Mac)

Unsaved changes are indicated in the tab bar. Save before running or deploying to ensure your latest code is live.

AI Chat sidebar

The right-side chat panel lets you generate and modify code using natural language — the AI has full context of your existing project.

How to use:

1. Type your request in the chat input at the bottom of the sidebar
2. The AI generates code and shows which files it will modify
3. Review the proposed changes
4. Click Apply to write the changes to your project files
5. The modified files open automatically in the editor

Example requests:

Add a search bar to the tasks list that filters by title

Create a middleware that logs all incoming requests to the database

Refactor the UserController to use a repository pattern

Revert last change: If an AI-generated change broke something, click Revert in the header toolbar to undo the last set of AI modifications.

Terminal

The integrated terminal runs inside your project container. Use it like any Linux terminal.

Common commands:

php artisan migrate
php artisan make:controller ProductController
composer require spatie/laravel-permission
npm install && npm run build
php artisan tinker

Toggle terminal visibility: Click the terminal icon in the bottom toolbar or drag the panel divider.

Running your project

Click Run in the IDE header to start your application.

1. The container compiles assets and starts services
2. A Live App URL appears in the header (e.g. https://myapp123.laracopilot.com)
3. Click the URL or the Open in new tab button to view your app
4. The built-in preview panel can also load the URL inline

Click Stop to shut down the running instance.

Environment variables

Click the Env tab (or .env in the file explorer) to open the environment variable editor.

• Add, edit, or delete any environment variable
• Changes are saved immediately to the container's .env file
• Restart the app after changing env vars for them to take effect

Downloading your project

Click Download ZIP in the header toolbar to download the full project as a .zip file. This includes all files, migrations, and assets.

Sharing a project

Click Share to get a shareable link to this project. Team members who have been granted access can open it directly.

Deploying from the IDE

Two deployment options are available directly from the IDE header:

GitHub: Push the project to a GitHub repository. See the GitHub Integration guide for setup.

Laravel Cloud: Deploy directly to a Laravel Cloud environment. See the Laravel Cloud guide for setup.

Keyboard shortcuts