Introducing CodeSandbox CDE: instant cloud development environments
โ๏ธ Run every branch in a powerful VM
โก Resume & fork in 2 seconds
๐ฅ Collaborative 24/7
๐ช Available now with usage-based billing
#CDELaunch
Introducing Sandpack 2.0 and Nodebox, a Node.js runtime for any browser.
๐ฑ Run Node.js in any browser, any device
โจ Vite, Next.js, Astro & more
โก Super fast, with a Rust-based transpiler
Hereโs why we believe this is HUGE ๐
Big news today๐ We are very excited to announce that CodeSandbox has acquired
@playdotjs
!
Play.js is an incredible JavaScript IDE for iOS, which means that soon you will be able to work on sandboxes natively from your iPhone or iPad! ๐ฑ
We're thrilled to announce and open source Sandpack! ๐
Sandpack is a toolkit for building live coding experiences that run fully in the browser.
๐ฉโ๐ป Full-featured editor experience
โก๏ธ Lightning-fast browser bundler
๐ฆ Direct CodeSandbox integration
We're thrilled to announce CodeSandbox Projects, a complete rewrite of CodeSandbox.
๐โโ๏ธ Run any project of any size
๐ฉโ๐ป Connect with your VSCode
๐๏ธ Work natively from the iPad
๐ Share every git branch with a link
๐ฅ Spin up any dev environment in seconds
The
@reactjs
team announced React Hooks exactly a week ago.
Since then we've seen a huge amount of new sandboxes created with React Hooks, 21,052 sandboxes to be precise!
In this thread we will highlight the most popular sandboxes created in the past week using Hooks. โจ๐ฅ
๐
Today, weโre thrilled to announce that we are opening up CodeSandbox Projects beta to everyone! ๐ฅณ
๐ First-class open source support
๐ฆ Docker and Nix support
๐จ Ready to go templates
๐ด Instant forking & wake-up of dev environments
And more... โจ
When CodeSandbox launched we wanted to make getting started with a new web app possible with just one click.
Today, we'd like to thank you all for creating 10M sandboxes ๐ฆโจ ๐๐ฝ
Meet Boxy, your new AI coding assistant ๐ค
๐ง Has the full context of your project
๐ฑ Generates code in seconds
๐ฅ Refactors code from the UI
๐ฌ Writes meaningful commit messages
Read the full post or see the highlights below ๐
Today is a historic day for CodeSandbox! For the first time since we launched, we are introducing support for a new language ๐ฅณ
Helloooo
@rustlang
๐
Read our announcement post and see the highlights below ๐งต
โจ๏ธ CodeSandbox Tip: You can import existing projects on your hard drive to CodeSandbox using our CLI. Install it with `npm install -g codesandbox`, then run `codesandbox {directory}` to get your project into CodeSandbox. See for details.
CodeSandbox Projects and Sandboxes are now available on iOS.
๐ฑย Access any Sandbox or Project on your iPad or iPhone
๐ ๏ธย Run tests, previews and terminals
๐ฅย Collaborate with your teammates in real-time
โจ๏ธย Move faster with the Command Palette
What ifโฆ we introduced official support for other programming languages? ๐
Well, better buckle upโanother big announcement is coming this week ๐
In the past week, weโve released some new, useful features ๐
1. On your dashboard, you can now see which sandboxes were shared with you and which sandboxes you've liked
2. You can deploy your sandboxes to GitHub Pages
3. You can now add custom thumbnails to your sandboxes
A big welcome to three new members joining our team!
@Ace_KYD
will join as Developer Advocate,
@olarclara
and
@ggsimm
will join as UI/UX Developers. We're excited to have you onboard!
And... Our team is growing! Check out our website for current openings.
We are truly stoked to see Remix come to life to help build better user experiences on the web!
Take it for an instant, quick spin on CodeSandbox here
Great job team
@remix_run
! ๐
We are thrilled to introduce Docker support in CodeSandbox ๐
๐ Code in new languages
๐ Work with servers & databases
#๏ธโฃ Get root access
โจ Play with our
@deno_land
template
Hereโs why this is a game-changer ๐
Drum roll pleaseโฆ ๐ฅ Because today weโre announcing the CodeSandbox GitHub App!
โ๏ธ A live dev environment for every PR
โ๏ธ Editable deployment previews
๐ฟ Brancheable databases
๐งช End-to-end tests
See how you can save hours every week reviewing PRs ๐
We're celebrating today, we just reached a million registrations!! ๐๐๐
Lots of sandboxes have been created in our past 4 years, thanks to everyone for the support in helping us get here!
What's your favourite profile or sandbox you've seen on CodeSandbox so far?
Helloooo Python community ๐ You can now spin up a Python dev environment in CodeSandbox!
โก Spins up in 2 seconds
๐ก IntelliSense support
๐ฑ iOS editor + VS Code integration
๐ฟ Built-in git
Read our blog post and catch the highlights below ๐
What if you could see the live mouse cursors of the people you're collaborating with? ๐ค
That's what we're exploring right now in CodeSandbox. Let us know what you think! ๐
We built a native app for iOS, so you can develop directly from your iPad. This allows you to live collaborate with CodeSandbox and VSCode.
This is the first time that you can do full web development on iOS, and we're very excited to see what people will build from their iPads.
New on CodeSandbox: Profile Pages
Our new-look profile pages let you tell folks about yourself and your creations. Add a description, social links, set a header, and pin your fave sandboxes to showcase yourself in the best way possible.
Take a look:
If youโre working with
@threejs
, donโt miss this react-three-fiber +
@vite_js
starter powered by our cloud sandboxes โจ
Awesome work
@dieg0liv
๐
๐
We're working on a big refactor of our state management to allow us to build features faster & safer. To help us move forward we have an experiment you can switch on.
The experience should be exactly the same, but please let us know if you find issues. Big thanks for helping us!
And... we're hiring! We're remote-first and take a peer-led approach to product development that's built around autonomous teams.
We've opportunities across engineering, design, growth, and ops.
Our native IDE for iPad and iPhone provides a full-featured coding experience ๐ฅ
๐ก Built-in IntelliSense
โ๏ธ Tasks & automations
๐ป Terminals
๐ฟ GitHub integration
โ๏ธ Cloud development
Full video:
We're thrilled to announce we've raised $12.7M in Series A funding. Thanks to everyone who has used CodeSandbox โ you've all made it the friendly and helpful community it is today.
Here's how we'll be using it to build the future of coding on the web:
๐ CodeSandbox Tip: You can export a sandbox to GitHub. Press the GitHub icon in the sidebar, enter your repo name and click 'Create Repository.' See for more info.
We are introducing a unified CodeSandbox experience!
๐ Projects is now Repositories
๐ Unified dashboard
โ๏ธ Cloud Sandboxes
โ๏ธ Improved editor experience
Keep reading to learn whatโs new ๐
Rychillie
@rychillie
, is exploring moving his entire workflow over to the iPad and has fallen in love with CodeSandbox for iOS in the process. ๐คฉ
Read about what makes this possible and how it's going so far! ๐
The people have spoken ๐ณ๏ธ We now officially support
@golang
!
โก Spin up a Go environment in 2 seconds
๐ก Built-in IntelliSense
๐ Share a URL to collaborate live
๐ฟ Run git commands with 1 click
๐ฆ Use any Go package
๐
Highlights below โจ
๐ CodeSandbox Tip: You can deploy a sandbox to
@zeithq
or
@netlify
. Click on the Deployment menu in the sidebar and select your option. With Netlify, you don't even need an account. See for more details
Wow, we made it onto
@WIRED
's ๐ฅ hottest Startups of
#Amsterdam
list!
What an honor ๐ ๐โโ๏ธ thank you to all our users and our team to make this even possible.
Leverage Sandpack to breathe life into your code samples like these wonderful examples:
โ๏ธ The new React Docs are using Sandpack for its live code examples
๐ฆ GitLab's Web Editor is powered by Sandpack to preview frontend projects
Nodebox is the first runtime that allows you to run Node.js in any browser, any context, and any application ๐
โ Firefox
โ Safari
โ Chrome
Learn more about it here ๐
Have you ever wondered what goes into creating mesmerizing animations with code? Check out this interview with
@0xca0a
, creator of react-three-fiber and react-spring, to find out what goes into building animation tools
๐ CodeSandbox Tip: You can search for sandboxes by dependency to get a list of working examples that will help you understand how to use it.
Search and select the dependency to filter the results on the search page:
The new
@reactjs
docs are out of beta - a collaboration between CodeSandbox and React ๐ฅณ
See below how they use Sandpack to provide an interactive coding playground and how you can build something similar ๐
Today, weโre thrilled to launch , the new home for React and its documentation. It teaches modern React with function components and Hooks, and weโve included diagrams, illustrations, challenges, and over 600 interactive examples. Check it out!
๐ฅ CodeSandbox Tip: You can code with others in real-time. Press the 'Go Live' button in the sidebar and get a URL to share with others. They can make edits, add dependencies, and chat about changes. Go live!
โโโโโโโโโโโโ
@bourdakos1
built a library for real-time object tracking using
@TensorFlow
Draw a box to start tracking!
โโโโโโโโโ
Check out
@0xca0a
's cell fracture 3D animation. It may seem simple at first glance but click around to see the "Hello" text fall into colorful bits and pieces! >>
๐ฃ๐ฃ
Joji, creator of
@anyfiddle
joins
@codesandbox
as infrastructure engineer.
@joji_augustine
has spent countless hours making coding easier and more accessible and we're thrilled to show you what's next.
New day, new launch ๐ Introducing AI code autocomplete powered by
@codeiumdev
๐ค
๐ช Fast code completion
โจ 70+ languages
๐ฆ Available on Devboxes
๐ฐ Included at no extra cost
Check the announcement post and see the highlights below ๐
#codesandboxweek
You asked, we did it! Sandpack just introduced static templates (plain HTML/CSS/JS) โจ
This was not easy, but thanks to intense research by the Sandpack team, we now support sandboxes without transpilation or evaluation steps ๐ฅ
Give it a try - it works just like local files!
Welcome, PHP community ๐ Today, we are thrilled to announce
@official_php
support in CodeSandbox!
โก Spin up an environment in 2 seconds
๐ก Intelephense
๐ฑ iOS editor + VS Code integration
๐ฟ Built-in git
Read our announcement (highlights below)โฌ๏ธ
Having colleagues and friends affected by the war in Ukraine, we want to express our support to them, their friends, family and to everyone else being affected by this unbelievable act.
Over the past hour CodeSandbox had downtime due to a block by our domain provider, which was triggered by phishing website spread using sandboxes.
We've contacted support and everything is resolved now, furthermore, we made sure that a sudden domain block won't happen again.
Introducing CodeSandbox Blue โ๏ธ
Have you ever wished that your CodeSandbox account had a nice blue check next to it?
After months of R&D, we are happy to launch this new experience. Just like the original, but blue.
Place
#4
(4,168 views):
An immense tutorial created by
@kentcdodds
on
@eggheadio
about React Hooks. This sandbox contains a wide variety of examples on how to use Hooks in real-world scenarios.
Make sure to check out the course:
๐ฅ CodeSandbox Tip: Did you know that you can import existing projects from your computer to CodeSandbox using our CLI?
You can install the CLI by running `npm install -g codesandbox` followed by `codesandbox <directory>` and your done๐
๐จ ๐จ
We are pleased to announce that the Sandpack license has now been changed to Apache 2.0 and we can't wait to see the amazing things you build with it!
So many people create amazing things with CodeSandbox and we want to make it easier to showcase and share awesome sandboxes.
We're excited to announce our all new Discover Page which will make this possible๐
Finally! You can now search all files within a sandbox to quickly find and go to a particular string. Available via the search icon in the editor's action menu.
Weโre working on something big at CodeSandbox. During a virtual event, we would like to show it to you and tell you more about how you can get early access.
๐ Date: Thur, March 17th
โฐ Time: 11AM ET | 4PM CET
RSVP here ๐๐ฝ
Meet our unified development platform with elevated Sandboxes and Devboxes ๐ฅ
Level up a Sandbox to a Devbox and get:
๐ค Built-in AI
๐ VS Code support
Read the full blog post ๐
We're working on something big at CodeSandbox. We want everyone to be able to develop from anywhere, and the acquisition of play.js is a milestone toward much more to come.
More will be shared this summer! For now, read more about this big news here
๐จ The new Sandpack release is out!
It includes many feature requests and a ton of improvements. Here are a few highlights:
- ๐ฉโ๐จ Fresh design and new semantic UI tokens;
- ๐ Introduce SSR support;
- ๐ฎย `SandpackFileExplorer`ย component;
- ๐ย Much more!
Get started and learn more about machine learning using Tensorflow.js and this great tutorial by
@devdevcharlie
on
@smashingmag
. Complete with handy sandboxes to try out and fork ๐ฆ๐๐ฝ
So, why the hype?
Being able to run Node.js in any browser is huge.
Bring docs to a new level with server-side examples. Integrate with low-code tools. Offer disposable server-side instances.
A world of possibilities for creators, OSS maintainers & developers ๐
Today, we are celebrating a major milestone: 2 million registered CodeSandbox users ๐ฅณ
Our community is growing faster and stronger than ever! Thank you for being part of it and for creating amazing projects like these:
Exciting news for Sandpack users โจย
The new resizing feature allows for a more powerful code editor and preview experience. Perfect for responsive layouts, long pieces of code, and more!
Introducing Dev Container support in CodeSandbox โก
๐ Run any dev environment in CodeSandbox
๐ Reuse the same configuration in your local editor
๐ฅ Use our UI to configure it in seconds
Keep reading for the details and donโt miss our blog post:
Interactive coding playgrounds can drastically improve how developers learn from documentations, tutorials and blogs. ๐ก
Check out how
@JoshWComeau
uses Sandpack to build a world-class interactive playground for his blog. ๐ฅ
#webdev
Take Sandpack for a spin! ๐ฅ
Here are a few useful links to get started:
๐ Docs:
๐ฌ Discord:
๐ฑ GitHub:
Can't wait to see what you build! ๐
Episode 2 of Version One is out today๐
Listen along as
@rauchg
details his international journey into the startup world that eventually led to the start of
@vercel
. Check out this episode here โก๏ธ
Say hello to an improved cloud editor layout ๐ฅ
Everything you need, one click away!
๐๏ธ Previews
๐ป Terminals
โ๏ธ Tasks
Plus, you can create a custom view with resizable panels that highlight your most important DevTools!
๐
Congratulations to
@supabase
on another amazing Supabase Launch Week. ๐โจ
You can take Supabase for a spin right now on CodeSandbox. Check it out ๐
Introducing the Command Palette in CodeSandbox Projects.
โจ๏ธ Move faster with keyboard shortcuts
๐ง Run shell commands
๐ Search files by path
๐ Switch branches or create new ones.
All your commands. In one place.
We partnered with
@Ingressive4Good
, a non-profit dedicated to equipping young Africans with tech skills, to build solutions for a problem statement in their developer communities.
Read all about it here! ๐๐ฝ
You can prototype, build, and review any
@rustlang
project in CodeSandbox ๐ฆ
โก Spin up an environment in 2 seconds
๐ก IntelliSense support via rust-analyzer
๐ฑ iOS editor + VS Code integration
๐ฟ Built-in git
๐ฆ Use any cargo crate
Start here ๐
We hear you! So today, weโre very excited to release two new components for Sandpack! ๐
โ ย SandpackTests: run
@fbjest
tests directly in the browser
โ ย SandpackConsole: a vital devtool for any developer
Donโt they look fancy? ๐คฉ More details below ๐
Weโve been busy... ๐ฉ๐ฝโ๐ป
โซ๏ธ Layout changes,
โซ๏ธ Environment variables,
โซ๏ธ Support for GitHub actions, Binary files etc,
โซ๏ธ and much more.
Check out our updates for May. ๐
One of the biggest challenges of enabling this was performance.
So, we took the time to redesign the Sandpack transpiler using Rust, refined our caching and made many other optimizations.
The result? Nodebox is fast โก Vite examples start in 500ms with cached dependencies.
Now, you can run Node.js in *any* browser ๐ฅณ
Sandpack 2.0 introduces Nodebox, a Node.js runtime that is fully compatible with all the main browsers.
See it below running
@nextjs
๐
Introducing Sandpack 2.0 and Nodebox, a Node.js runtime for any browser.
๐ฑ Run Node.js in any browser, any device
โจ Vite, Next.js, Astro & more
โก Super fast, with a Rust-based transpiler
Hereโs why we believe this is HUGE ๐
We're excited to announce one of our new podcasts called Version One๐..
Explore the product development journey of your favorite online products with
@mauricecherry
Episode 1 launches on April 6th and will be available on all major podcast platforms
Exciting news ๐ฅ We just launched a major overhaul of our VS Code extension!
๐ฆ Create sandboxes in VS Code
โ๏ธ Run and manage multiple DevTools
๐จ Load extensions/themes automatically
Hereโs a rundown of the new features we introduced ๐
Introducing cloud sandboxes: the best way to build code prototypes โจ
โ๏ธ Fully powered by the cloud
๐ข Docker support
๐ Work with servers and databases
๐ฑ Code from any editor or device
๐ Share with a URL and build together
Hereโs what you need to know ๐งต
We are happy to announce our partnership with
@Tailscale
, which allows you to bring CodeSandbox Repositories into your network ๐
This is great to let your internal apps access CodeSandbox Repositories and vice-versa!
Big round of applause for
@pshrmn
for having the first user sandbox that reached a million views! ๐๐๐
Thanks for using CodeSandbox from such an early age already ๐
Place
#1
(25,555 views):
A Goo animation example created by
@0xca0a
! This sandbox is a demo of how react-spring could use React Hooks as a new API.
It cleverly shows how you can use the new API to create a trail effect and how Hooks make this easier.
We've added a changelog so it's easier to keep up with all the latest features and tweaks on CodeSandbox.
Our first update is out and it's a goody! From sharing code selections to faster dependency installs, we've shipped lots of small improvements:
We're very curious what you think! We have opened a waitlist now, which you can join from here: .
Over the coming weeks we're going to let more and more people in, if you have feedback, let us know!
With CodeSandbox Projects, you can open a PR in a single click.
We do all the work - creating the branch, the commit and pushing for you!
This doesn't only make you faster, it opens the door for more people to easily contribute to a codebase. ๐ฉ๐ฝโ๐คโ๐จ๐พ