How to Set Up a Self-Hosted Development Environment with Code Server on SonicBit

Ever wished you could open your coding workspace from any computer, tablet, or even your phone, without lugging around configuration files or setting up SSH keys? That's exactly what a cloud development environment gives you—and with Code Server on SonicBit, you can spin one up in about 60 seconds. No terminal. No Docker commands. No server management. Just a browser and an idea.

This guide walks you through deploying Code Server on SonicBit, configuring your workspace, and connecting it to Gitea for proper version control. By the end, you'll have a fully managed dev environment that follows you everywhere.

What You'll Need Before Starting

This is a beginner-friendly setup, but a few things will make the process smoother:

• A SonicBit account (the free plan works for testing, but I'd recommend at least the Nano plan at $1.99/month for 50GB storage and a performance app slot)
• A Gitea account (you can deploy Gitea on SonicBit too, or use a hosted instance)
• Basic familiarity with VS Code (Code Server is literally VS Code in your browser, so the interface will feel familiar)

Code Server is classified as a heavy app on SonicBit, which means it needs a performance app slot. The free plan only includes a basic app slot, so you'll need at least the Nano plan or Starter plan to deploy it.

Deploying Code Server on SonicBit

The entire deployment takes one click. Here's how:

1. Log in to your SonicBit dashboard
2. Navigate to the Apps section
3. Find Code Server in the Development category
4. Click Install
5. Wait about 30 seconds for the container to spin up

That's it. No docker run commands, no YAML configuration, no reverse proxy setup. SonicBit handles the SSL certificate, subdomain routing, and container orchestration automatically.

!Code Server deployment screen

Once deployed, you'll see a URL to access your Code Server instance. Click it, and VS Code opens right in your browser tab.

Configuring Your Workspace

When Code Server first loads, it looks nearly identical to desktop VS Code—file explorer on the left, editor in the center, terminal panel at the bottom. The only difference is everything runs in your browser.

Setting Up Extensions

Code Server supports most VS Code extensions from the marketplace. To install them:

1. Click the Extensions icon in the left sidebar (or press Ctrl+Shift+X)
2. Search for the extension you want
3. Click Install

Some extensions that work particularly well in a cloud environment:

Customizing Settings

Your settings persist between sessions because they're stored in the Code Server container. To edit them:

1. Press Ctrl+Shift+P to open the command palette
2. Type "Preferences: Open Settings (JSON)"
3. Add your custom settings

{
  "editor.fontSize": 14,
  "editor.wordWrap": "on",
  "terminal.integrated.fontSize": 13,
  "files.autoSave": "afterDelay"
}

These changes save automatically and persist even if you restart the app.

Connecting Code Server to Gitea

Gitea is a lightweight, self-hosted Git service—think of it as your own personal GitHub. SonicBit offers Gitea as a one-click deployment too, which means you can have both your code editor and your Git server running on the same platform.

Deploy Gitea on SonicBit

1. Go back to the Apps section in your SonicBit dashboard
2. Search for Gitea
3. Click Install
4. Wait for deployment to complete

Gitea is also classified as a heavy app, so you'll need at least two performance app slots (one for Code Server, one for Gitea). The Vertex plan at $3.49/month includes 2 performance slots, which makes it a good entry point for this setup.

Link Gitea to Code Server

Once Gitea is running:

1. Open your Gitea URL and create an account (or log in)
2. Create a new repository—call it something like my-first-project
3. Copy the repository's HTTPS URL (it looks like https://your-gitea-url/username/repo.git)
4. Back in Code Server, open the terminal (Ctrl+ `)
5. Clone the repository:

git clone https://your-gitea-url/username/my-first-project.git

1. Enter your Gitea credentials when prompted

Now you have a fully functional Git workflow in your browser-based editor.

Setting Up Git Credentials

To avoid typing your username and password every time you push, configure Git to cache your credentials:

git config --global credential.helper store
git config --global user.name "Your Name"
git config --global user.email "your@email.com"

The next time you push or pull, Git will remember your credentials.

Practical Tips for Your Cloud Dev Environment

Organize Your File Structure

Create a clear folder structure from the start:

/workspace/
├── projects/
│   ├── project-one/
│   └── project-two/
├── scripts/
└── notes/

This keeps things tidy when you're working on multiple projects.

Use the Integrated Terminal

The terminal in Code Server is fully functional. You can run Python scripts, Node.js applications, or any other development tools that are pre-installed in the container.

## Example: create a quick Node.js project
mkdir my-app
cd my-app
npm init -y
npm install express

Enable Auto-Save

When you're working from different devices, auto-save is a lifesaver. It prevents you from losing work if your connection drops.

1. Press Ctrl+, to open Settings
2. Search for "Auto Save"
3. Set it to afterDelay

Access Your Environment from Anywhere

Code Server runs entirely in the browser, which means you can access it from:

• Any computer with a modern browser
• Tablets with keyboard support
• The SonicBit mobile app, which provides direct access to your app URLs

No VPN, no port forwarding, no SSH keys. Just log in to your SonicBit dashboard and click the app URL.

Why This Setup Beats Managing Your Own Server

If you've ever tried to set up VS Code in the cloud manually, you know the pain. Here's what the SonicBit approach eliminates:

The time saved alone makes the $1.99 entry price worth it. And when you outgrow your plan, upgrading storage and app slots takes seconds from the dashboard.

What's Next?

Now that your cloud dev environment is running, here are a few ideas to explore:

• Deploy PocketBase for a lightweight backend database
• Install n8n to automate your development workflows
• Set up Uptime Kuma to monitor your projects
• Explore the SonicBit file manager to manage your code files directly

You can also check out our guide on setting up a complete media automation stack or learn how to use remote uploads to back up your work to Google Drive.

Start Building Today

Code Server on SonicBit gives you a professional development environment without the infrastructure headache. Whether you're learning to code, working on side projects, or need a portable workspace, this setup gets out of your way so you can focus on what matters: writing code.

Sign up free at SonicBit.net and get 4GB storage. Download our app on Android and iOS to access your seedbox on the go.