---
title: "Building an In-Browser IDE the Hard Way"
description: "This tutorial builds a personal remote development environment: an in-browser IDE for Elixir/Phoenix work, deployed as a Fly Machine from a Dockerfile and managed with command-line tools. The image uses an official Elixir base, adds code-server, flyctl, build dependencies, and the Elixir Language Server extension, while a multi-stage build copies in Tired Proxy. A persistent volume holds working files, and the startup configuration can clone a repository, launch code-server behind HTTPS, and arrange for the machine to sleep after an hour without HTTP requests. From the IDE terminal, the walkthrough then creates and deploys a separate Phoenix hello-world application backed by SQLite, setting its secret and provisioning storage. The resulting setup can wake on browser access, but random HTTP traffic or an active code-server terminal may keep it running, and stopping or destroying the apps limits costs."
---

# Building an In-Browser IDE the Hard Way

[Fly.io](https://yomu.fyi/company/fly-io) · Aug 15, 2022

**Type:** Tutorial

## Summary

This tutorial builds a personal remote development environment: an in-browser IDE for Elixir/Phoenix work, deployed as a Fly Machine from a Dockerfile and managed with command-line tools. The image uses an official Elixir base, adds code-server, flyctl, build dependencies, and the Elixir Language Server extension, while a multi-stage build copies in Tired Proxy. A persistent volume holds working files, and the startup configuration can clone a repository, launch code-server behind HTTPS, and arrange for the machine to sleep after an hour without HTTP requests. From the IDE terminal, the walkthrough then creates and deploys a separate Phoenix hello-world application backed by SQLite, setting its secret and provisioning storage. The resulting setup can wake on browser access, but random HTTP traffic or an active code-server terminal may keep it running, and stopping or destroying the apps limits costs.

## Context

The project demonstrates a personal, individually used remote development environment that does not need load balancing, many instances, or continuous operation. Running the environment only when needed reduces costs, while persistent storage preserves working files.

## Approach / What changed

The setup uses a Dockerfile based on Elixir, installs code-server, flyctl, build tools, and the Elixir Language Server extension, and adds Tired Proxy to stop the Fly Machine after inactivity. A persistent volume stores project files. The code-server terminal is then used to configure and deploy a separate Phoenix application with SQLite storage.

## Takeaways

- The development image combines an official Elixir base with code-server, flyctl, and the Elixir Language Server extension, using a multi-stage build to copy in Tired Proxy.
- Tired Proxy can shut down the machine after an hour without HTTP requests, while Fly’s proxy can wake it for browser traffic; random bots and an active terminal may prevent it from sleeping.
- The walkthrough deploys a separate Phoenix hello-world app from the remote IDE, generating SECRET\_KEY\_BASE, creating an encrypted 1GB volume, and using SQLite for storage.

**Tags:** [Deployment](https://yomu.fyi/topic/deployment), [Docker](https://yomu.fyi/topic/docker), [Elixir](https://yomu.fyi/topic/elixir), [Fly Machines](https://yomu.fyi/topic/fly-machines), [SQLite](https://yomu.fyi/topic/sqlite)

- Source: [Fly.io](https://fly.io/blog/remote-ide-machines)
- Source URL: https://fly.io/blog/remote-ide-machines
- Ingested by Yomu: 2026-09-02T11:59:26.666Z

[Read original post](https://fly.io/blog/remote-ide-machines)