Both are VSCode in a browser. Both can be elevated into a fully integrated development environment via preinstalled GitHub Codespaces VSCode extension by selecting `>Codespaces Create New Codespace...` from the command palette. So what's their actual difference and why would I use one over another?
Who is the owner and what is the purpose of these projects?
Both are microsoft anyway ¯\_(ツ)_/¯, but is one from the github team, while the other from vscode team?
Let's say I want to take a deeper dive into the code for https://github.com/ogham/exa 1. It turns out github has been working on new functionality that allows me to open that repo in a VS Code instance running entirely in your browser. I simply need to either:
-
Press the '.' key on any github repo or pull request
-
Swap
.comwith.devin the URL - (so https://github.dev/ogham/exa for my example)
I can install extensions into my web VSCode instance (not all but a solid number), configure the theme, settings, etc. It really is VSCode running in the browser, allowing you to utilize 'Go to definition' and 'Go to references' to navigate the source code as if it were local.
Here's what the exa repo looks like for me when I open it in github dev: https://i.imgur.com/EOVawat.png
ReadMe from https://github.com/github/dev
What is this?
The github.dev web-based editor is a lightweight editing experience that runs entirely in your browser. You can navigate files and source code repositories from GitHub, and make and commit code changes.
There are two ways to go directly to a VS Code environment in your browser and start coding:
Press the . key on any repository or pull request.
Swap
.comwith.devin the URL. For example, this repo https://github.com/github/dev becomes http://github.dev/github/devPreview the gif below to get a quick demo of github.dev in action.
https://user-images.githubusercontent.com/856858/130119109-4769f2d7-9027-4bc4-a38c-10f297499e8f.gif
Why?
It’s a quick way to edit and navigate code. It's especially useful if you want to edit multiple files at a time or take advantage of all the powerful code editing features of Visual Studio Code when making a quick change. For more information, see our documentation.