| title | Code Editor Panel |
|---|---|
| description | Where you write and organize your code files |
The Code Editor is where you write your code. It's like a super-smart text editor that understands programming and helps you write better code.
Think of the Code Editor as a special notebook for writing code. It colors your code to make it easier to read and helps you find mistakes.
Type your code with helpful colors and hints See all your project files in a tree Use the terminal without leaving the editorOn the left side, you'll see all your project files organized like folders on your computer:
- Click folders to open them and see what's inside
- Click files to open and edit them
- Icons show you what type of file it is (JavaScript, image, etc.)
- A dot appears next to files you've changed but haven't saved
The big area in the middle is where you write your code:
- Colors - Different parts of your code show up in different colors to make it easier to read
- Suggestions - As you type, the editor suggests what you might want to write next
- Find and replace - Search for words in your code and change them
- Multiple spots - Edit several places at once
At the bottom, you can open a terminal to run commands:
- Open multiple terminal tabs for different tasks
- Make it bigger or smaller by dragging
- See commands you ran before
- Run commands without leaving your code
You can manage your files in many ways:
- Create - Make new files and folders
- Delete - Remove files you don't need
- Rename - Change file names
- Upload - Drag files from your computer into the editor
- Search - Find files quickly by name
When the AI wants to change your files, you can review the changes first:
- See the differences - Compare the old and new versions side by side
- Approve or reject - Choose which changes to keep
- Colored highlights - See exactly what's being added or removed