CodeSandbox

An online code editor with a focus on React.

This project was bootstrapped with Create React App.

The JavaScript community has sharing as its selling point. It has the biggest open source community and every day new ideas and proposals are shared on Twitter. This is great and a really strong point, but the side effect of this is that there are a lot of tools and configurations to consider before you can start building.

CodeSandbox aims to solve this by allowing developers to simply go to a URL in their browser to start building. This not only makes it easier to get started, it also makes it easier to share. You can just share your created work by sharing the URL, others can then (without downloading) further develop on these sandboxes.

Organization

The CodeSandbox client is currently divided in to 5 parts.

app: The editor and profile page
sandbox: The preview pane of the editor
embed: The embedded version of CodeSandbox (which you can embed on medium)
common: The common parts between sandbox, embed and app
homepage: Homepage!

This version of CodeSandbox is using the production server as source of truth, this is specified by the environment variable LOCAL_SERVER. It's not yet possible to sign in using this version, I haven't figured out how to handle this yet.

Installation

To install the project you need to have yarn and node, to start:

yarn
yarn start

Other CodeSandbox repositories

CodeSandbox consists several separate servers, some of these are open sourced.

Client: the web application
Server: the Phoenix API server
Nginx: Nginx config files
Git Extractor: responsible for extracting the source from a GitHub repository
CLI: the CLI to upload a CodeSandbox project from your command line

Contributors

Thanks goes to these wonderful people (emoji key):

_{Ives van Hoorne} 💬 📝 🐛 💻 🎨 📖 💡 🚇 👀 ⚠️ 🔧	_{Donavon West} 💻	_{Jeff Allen} 💻	_{Ben Gummer} 💻	_{James Gillmore} 💻 🐛	_{Ade Viankakrisna Fadlil} 💻	_{Tushar Sonawane} 💻
_{Johann Hubert Sonntagbauer} 🐛 💻	_{Joachim Seminck} 💻	_{Subramanya Chakravarthy} 💻	_{Robert (Robby) O'Connor} 🚇	_{Bogdan Luca} 🐛 💻	_{Divjot Singh} 💻