Coding Locally Is Slowing You Down

BBetter Stack
Computing/SoftwareTelecommutingInternet Technology

Transcript

00:00:00This is Code Server, an open source project that lets you run VS Code on a remote machine and access it from your browser.
00:00:07If you've ever had a build melt your laptop or you need to switch machines often, then this is for you.
00:00:12It's not a web editor clone either, it's actual VS Code, running on a server, and you just connect to it.
00:00:19That's how simple they claim it is, but does this actually help us in any way? That's the question.
00:00:23We have videos coming out all the time, be sure to subscribe.
00:00:30Now here's what Code Server actually does, it runs VS Code on a remote machine.
00:00:36That machine could be something like a cloud VM, your home server, or just a really big desktop, and you open it in a browser.
00:00:45Instead of installing Node, Docker, Postgres, Python on every device, you install it once on the server, then you can log in from anywhere.
00:00:54Your laptop, I guess even your phone if you really wanted to.
00:00:57The terminal works, extensions still work, and Git even works.
00:01:01Now think of it like this, your computer just becomes the screen, the real work happens somewhere else, somewhere in the cloud per se.
00:01:08That's the big change here.
00:01:10Now this is super simple to get going, since I'm on a Mac M4 Pro, I will run it locally here for simplicity instead of a cloud VM.
00:01:18First I'll open up Docker, then in my terminal we can run this Docker setup command.
00:01:23I'm going to do a quick check here just to make sure it's actually running properly, and as you can see here, it is, and I can even get the password that it returned back to me.
00:01:33We can now turn to localhost where it asks me to input this password, and voila, here is VS Code right in my browser.
00:01:41Literally it looks the exact same, it has Copilot, it has these extensions, it has my terminal, I can drag in projects here, so this was just a simple starter Django project that I dropped in.
00:01:53Running code would work the same way, I'll set up a virtual environment, pip install what I need, and then run it.
00:02:00Now honestly this project is not much, this is literally just text on a Django landing page, I just wanted you to see how the terminal executes and runs here in the browser.
00:02:08It's all the same, browser, VS Code, or standard VS Code, we still get that same functionality.
00:02:14If you've ever watched your battery drain during builds, we all have, or you heard your laptop fan compiling that Docker image, this solves that.
00:02:24If you find you need more power down the road, then you can just upgrade your VM.
00:02:28So now this changes the game slightly, there's no more "works on my machine", now it's one machine, it's one environment, the same node version, the same Docker setup, the same extensions.
00:02:40Every device connects to the same place.
00:02:43Now for hybrid teams, that consistency is bigger than we think.
00:02:47If you're traveling a lot like me, then it's a touch more freedom where I can keep this up in the server.
00:02:52And yes, it is actively maintained, this is not just some abandoned side project, this is production ready infrastructure.
00:02:58Now let's flip this, Code Server may sound perfect, it's not.
00:03:02Is anything actually perfect? Well, not always, right?
00:03:05The pros here, for starters, it's free, it's open source, and it is really responsive to at least what I found here.
00:03:11On top of that, it scales with your infra, and it's cheaper to manage platforms if you're working solo.
00:03:16But here's the catch since it's not on your machine.
00:03:19If you have bad internet, then you're gonna have a bad experience.
00:03:23Latency is real because of this, and your server needs real RAM.
00:03:27Don't spin this up on a tiny VM and expect it to be great, it's not gonna be great.
00:03:31Security out of the box is still super basic.
00:03:34If you expose it publicly, you still gotta configure the auth correctly.
00:03:38If we compare this to GitHub Codespaces, cause I know some of you are thinking this now.
00:03:43And then Codespaces is like plug and play.
00:03:46But Code Server is now more control than just that.
00:03:49If you want to try this, don't overthink it, this was super easy to spin up.
00:03:53So start small, give it a shot, see if it fits into your workflow, spin up a basic cloud VM,
00:03:58or even just run it on Docker like I am on your home machine.
00:04:02If you really want to put it through the ringer and test it, you could pair it with dev containers.
00:04:07Now your environment isn't just remote.
00:04:09It's reproducible, which is awesome for onboarding,
00:04:12it's good for debugging, and it's really good for consistency.
00:04:14If you've already tried it, then you know you're already getting better battery life.
00:04:18Now you can code on lighter devices, and switching between work and personal machines is easier.
00:04:24Test it privately first, then scale.
00:04:26With Code Server, your environment becomes portable, scalable, and even more consistent.
00:04:32Your laptop or device stops being the limit, so if that sounds interesting,
00:04:36Just go see how it feels. We'll see you in another video.

Key Takeaway

Code Server transforms your local device into a mere terminal by offloading development environments and heavy computations to a remote, scalable server, ensuring consistency and hardware efficiency.

Highlights

Code Server allows running a full instance of VS Code on a remote server accessible via any web browser.

Shifting heavy tasks like builds and Docker image compilation to a remote VM preserves local battery life and hardware longevity.

The environment remains consistent across all devices

Timeline

Introduction to Code Server

The speaker introduces Code Server as an open-source project designed to run VS Code on remote machines. This solution is particularly useful for developers whose laptops struggle with heavy builds or those who frequently switch between different hardware. It is clarified that this is not a simplified web clone but the actual VS Code application running on a server backend. The primary promise is a seamless connection from any browser to a powerful remote development environment. This introductory segment sets the stage for exploring whether the tool lives up to its claims of simplifying the development workflow.

Core Functionality and Remote Setup

The speaker explains the mechanics of how Code Server operates by hosting the environment on a cloud VM, home server, or desktop. Instead of the tedious process of installing dependencies like Node, Docker, and Postgres on every personal device, they are installed once on the central server. The system supports full terminal access, VS Code extensions, and Git integration, ensuring no loss in functionality. The core shift described is that the user's computer essentially becomes just a screen for the work happening elsewhere. This section emphasizes the liberation from device-specific configurations and the move toward a cloud-centric workspace.

Deployment Demo and Local Execution

A practical demonstration is provided where the speaker runs Code Server locally on a Mac M4 Pro using Docker for simplicity. The process involves running a specific Docker setup command, verifying the container status, and retrieving a generated password. Once the password is entered into a browser at localhost, a fully functional VS Code interface appears with Copilot and various extensions ready to use. To test the environment, a starter Django project is imported, and the speaker demonstrates setting up a virtual environment and installing packages via the integrated terminal. This walkthrough illustrates that the browser-based experience is virtually identical to the standard desktop application.

Benefits of Remote Development

The discussion shifts to the tangible benefits of using a remote server, such as preventing battery drain and eliminating loud laptop fan noise during heavy compilation. Developers can easily scale their computing power by upgrading the VM as project requirements grow over time. A major advantage highlighted is the environmental consistency, ensuring that every team member uses the same versions of Node and Docker. For hybrid teams and frequent travelers, this setup offers the freedom to maintain a persistent session on a remote server. The speaker also notes that the project is actively maintained and ready for production-level infrastructure.

Drawbacks, Security, and Comparisons

Despite the praise, the speaker addresses several critical drawbacks and challenges associated with Code Server. A poor internet connection will lead to significant latency, which can result in a frustrating and laggy coding experience. Furthermore, the remote server must have sufficient RAM, as running the environment on underpowered VMs will lead to poor performance. Security is another concern, as the default authentication is basic and requires careful configuration before being exposed to the public internet. These points serve as a reality check for developers considering a transition away from traditional local development environments.

Final Recommendations and Scaling

The video concludes with a comparison to GitHub Codespaces, noting that while Codespaces is easier to start, Code Server offers significantly more control. The speaker encourages viewers to start small by experimenting with a local Docker setup or a basic cloud VM to see if it fits their specific workflow. For advanced users, pairing Code Server with dev containers can create a highly reproducible and portable environment ideal for onboarding and debugging. The ultimate goal is to move beyond the limitations of local hardware to achieve better battery life and easier machine switching. The speaker encourages viewers to test the setup privately before scaling it for professional use.

Community Posts

No posts yet. Be the first to write about this video!

Write about this video