DocsGetting StartedUnderstanding the Workspace

Understanding the Workspace

The Codeezly workspace is your complete development environment in the cloud.

Workspace Layout

The workspace is divided into several key areas:

  • File Explorer (Left Panel): Browse and manage your project files with drag-and-drop support.
  • Code Editor (Center): A powerful Monaco-based editor with IntelliSense, syntax highlighting, and multi-file tabs.
  • Live Preview (Right Panel): See your changes in real-time as you code.
  • Terminal (Bottom Panel): Run commands, install packages, and view logs.
  • AI Chat (Sidebar): Interact with AI agents to generate code, ask questions, or debug issues.

Panel Controls

You can resize, collapse, or rearrange panels to suit your workflow. Use the keyboard shortcut Ctrl+B (or Cmd+B on Mac) to toggle the sidebar.

Project Settings

Access project settings via the gear icon in the top-right corner. Here you can:

  • Configure environment variables
  • Set up custom domains
  • Manage GitHub integration
  • View deployment history