Hello everyone 👋🏾

Hope you have had an amazing start to your year!
Here at CodeSandbox, we have! With a lot of announcements like Docker, Rust support, and others that you might have already seen in our Blog.

Let’s dive right into our biggest updates!

Docker support ⛴️

We deployed native Docker support in CodeSandbox!

You can now add a Dockerfile to the .codesandbox folder, restart the branch and you’ll be in the environment of the Dockerfile. This means that you can now use CodeSandbox to code in new languages 🤯

We also give you root access inside the container, so you can run things like apt install htop.

Don’t miss our Docker starters and our walkthrough video.

Rust Support 🦀

CodeSandbox now officially supports Rust! This update allows you to spin up a Rust development environment within 2 seconds, with IntelliSense support and the ability to open the environment in iOS or VS Code.

Check out our Rust & Serde template and our Rust starter! Happy coding, Rustaceans! 🎉

Environment variables

We introduced environment variable support on Cloud Sandboxes. This is very useful for creating variables and secrets in your project, such as project-specific settings or access tokens for APIs. Can’t find them? See our short video!

Private NPM Registry support for Cloud Sandboxes

Now, teams can use their private npm registry (configured in their team settings) inside Cloud Sandboxes. This feature is only available for Team Pro subscribers.

💡 The sandbox has to be private for this feature to be enabled.

Seamless branching & forking

You asked for it, we shipped it! When you are in a protected branch or sandbox, you can just start coding—in the background, we will seamlessly branch the repo or fork the sandbox for you ✨

Sandpack updates

Experimental Sandpack layout on embeds

To gradually deprecate some v1 dependencies and support our new technologies, we have released experimental support for a new type of embedding that uses Sandpack. You can manually test it by adding the &sandpack=experimental tag to the iFrame’s URL.

New resizing feature

Sandpack now has a new resizing feature that allows for a more powerful code editor and preview experience. Perfect for responsive layouts, long pieces of code, and more. See it in action!

Support for code actions

Now, CodeSandbox has built-in support for code actions that are created by LSPs. This is useful for small things (like adding imports) but can also handle big operations (moving given code to a function). Plus, it is also available for Rust!

Several smaller fixes and updates

As usual, we also took some time to go over bug fixes and UX improvements to make sure that CodeSandbox gives you a smooth and powerful developer experience.

Community updates

Last, but not least, we have kept improving our templates and making them more accessible to everyone.
So, we now redirect several of our .new domains to cloud sandbox templates. Try it with:

• https://vite.react.new

• https://svelte.new

• https://gatsby.new

• https://js.new

• https://nodejs.new

• https://vue.new

We are incredibly excited about these updates and grateful for all the positive feedback we have received from our users. Thank you so much for your support ❤️

Yours,

The CodeSandbox Team

Hello there 👋 Hope everyone had a good start to November. How time flies!

We have been busy (as always) and are super excited to share all the exciting things we’ve been working on.

CodeSandbox for iOS update

Let’s start with our biggest news—a new update to our iOS app 🎉

We are really excited about the steady growth of our users on our app and appreciate all the great feedback we’re constantly getting.

So, what’s new in version 3.14.0? Best leave it to the words of our outstanding iOS developer Carlos Vidal💯

This release introduces Cloud Sandboxes which give you the flexibility you need to quickly prototype ideas or try new technologies without the hassle of setting up GitHub repository. Moreover, Cloud Sandboxes are powered by the micro-VMs used for larger projects so you can take advantage of the enhanced coding experience they provide.

On top of that, we have redesigned the dashboard, improved the sandbox creation flow, implemented a screen to manage sandbox permissions and enhanced the list of actions sitting above the keyboard while coding. And last but not least, if you were impacted by a bug that wouldn't allow you to link a GitHub account with your CodeSandbox account we've fixed that. Sorry for the inconvenience!

A new onboarding flow

We’re happy to have shipped our new onboarding flow, which will guide you through your first experiences with CodeSandbox Repositories and Sandboxes.

You’ll get more details and guides on how to get started with your projects in seconds. Plus, we have made further updates to our documentation, which now offers a unified experience that gives you specific details on all our clients (Web, iOS, VS Code) in one place.

Better VMs

We’re also working a lot on making everyone's Pro subscription more powerful.

Pro accounts will now get better and improved instance specs for Cloud Sandboxes and Repositories. You can find more details on our Pricing page.

Git experience improvements

We hear you; with repositories, there were a lot of cases when it was so hard to fix git issues, conflicts, etc.
From now on, you will see the notification if there is a conflict with the remote branch. With a single click, you can reset your workspace branch with the remote version; along with more fixes and small improvements to make your life easier.

VSCode support for Cloud Sandboxes

From today you can open and edit a cloud sandbox directly from your own VSCode editor with your own extensions, themes and keybindings!

(Much) more to come!

Besides all these updates, we have been cooking up some bigger improvements that we will share more about soon.

Finally, if you haven’t tried out our new Cloud Sandboxes, you absolutely should. These allow you to run all the magic of the recently released Next.js v13 with all its server-side functionalities at the click of a button. Try it out now over on codesandbox.io

Till next time.

Your CodeSandbox Team.

Hey everyone 👋

Hope y’all had a great start to Spooktober 🎃 This time we are very excited to share our latest release. We are happy to present our new and unified Dashboard experience which was released a week ago. Check out the release blog post to learn more about it.

But let’s share some of the highlights.

Dashboard

A new unified way to see Repositories and Sandboxes all in one place.

• Projects are now called Repositories and are integrated into the sidebar

• The general UI of the Dashboard was updated, with a sidebar clean-up

• You can now import repositories and create sandboxes all from one UI

And since last week's release, we added support to:

• Remove imported repositories from your dashboard

• Remove sandboxes and branches

Cloud Sandboxes

You can now use our brand-new Cloud Sandboxes. Instead of relying on the browser, these are powered by our unique Micro VMs, giving you native access to all SSR libraries and frameworks.

Try them out using our new Cloud templates (we are adding new ones regularly)!

Updated Pricing Page

We have also updated our pricing page to give everyone a better overview of the plans and resources available, especially with Repositories and Cloud Sandboxes. For current users, these changes will only take effect after November 14th.

As always, we also improved the experience across the board for all our clients.

Have a great weekend, and till next time.

Your CodeSandbox Team

Hey everyone 👋

Hope y’all are having a great start to this week. We are really excited to unveil what we worked on over the last two weeks. And here it goes:

Real-time collaboration between WebEditor and VS Code

• The biggest fix we are proud to share is the massive improvement to multi-client real-time collaboration. Should you be connected to the same branch with multiple clients like the WebEditor and VS Code, you’ll now experience much better syncing between all these clients.

  • If for some reason, an automatic sync is not possible, you’ll now be asked if you want to use your current version or the last one from the server. But the automatic sync will work 99% of the time 😉

  • For this one, the team took a deep-dive into VS Code internals to make sure we create the seamless experience we envision.

Other Updates:

• Fixed an issue in the Dashboard when creating a new branch would lead to a 404 page.

• Improved feedback when renaming branches to names that are already in use.

• DevTools got a neat little new icon in the Editor ✨

We know, it’s a shorter update this week - but there are many exciting things happening in the background right now that we can’t share yet. So, consider following us on Twitter and LinkedIn to make sure you don’t miss our upcoming updates.

Till next time, Your CodeSandbox Team

Hey everyone!

Enjoying your week so far? We're really excited to unveil what we worked on over the last two weeks. And here it goes:

Sandboxes

• Embedded sandboxes via Embedly (as in Medium) will soon support query params for setting up the panes, opening files, etc. thanks to a user coordinating with their support. We want to extend a big thank you and we are grateful to have such an amazing community.

Documentation

• We extended the documentation around the environment in CodeSandbox Projects. Read all the details here.

The Editor

• Better Astro support!

  • Autocomplete & IntelliSense

  • Linting

  • Type Definitions

  • A new template to start with, which you can find here.

• Improved the performance of the file explorer.

• Allow opening localhost URLs directly from the terminal, and they get rewritten to the right URL.

• Preview links will now be added as comments to pull requests instead of editing the pull request’s description. 🎉

• Added an improved menu on the top left in the header.

GitHub App

• Added Deployment support for every preview URL. This way you can easily run end-to-end tests against the preview URLs for every PR. This requires additional permissions in the GitHub App: “Read and write access to Deployments”. More info here.

• As an open source maintainer, you can now edit PRs of external contributors if they have enabled “Allow edits from core maintainers”.

• We now include the “VS Code Insiders” in the “Open in CodeSandbox …” list of links.

• We now also include preview URLs in the list of links.

iOS

• You can now sign in with Apple in the latest App version which gets rolled out across the App Store over the course of this week. The new login method is also available through the web browser. 🍎

We also released a new version of our beloved VS Code Extension with a few little tweaks and improvements.

Oh, and Sandpack has an awesome console now. 🙀

Finally, we want to say how much we appreciate all the support we get from all of our users on a daily basis. Thank you so much!

Yours,
CodeSandbox Team

Disclaimer - we changed the naming structure a little bit for the releases. The name now reflects the week we write the update and will cover what has happened since the last one. That should make everything a little clearer, we hope. So lets dive right in.

Since the release of the Projects public beta, we started an Engineering Cycle. This one is mostly focused on fixing a few cut corners, catching up on important tooling work, improving stability and performance, and tackling some necessary refactors. But our team also dropped in some delighters, so this update will still have a few surprises.

VScode

• We now support the VScode Insider build. Everything you want to know about this, you'll find in our updated documentation.
  This feature was highly requested, and we are super proud to be able to support it with the quality we strive for.

• In the participants section of our extension, you'll now see the proper avatars next to the names.

Projects Editor

• You can now branch from main through the command palette from any branch

• You can now edit multiple Environment Variables at once, allowing for copy-pasting

• New Language support for nix , dockerfiles and elixir

• Improved (and fixed) prettier support. If there is no prettier installed in the project, it will fall back to a provided version. (🤫 some cool performance updates are incoming)

Dashboard

• Improved layout for various screen sizes of our Project Dashboard

• Project Import of Open Source Projects now opens the proper dialog and lets you chose the GitHub Organization you want to fork the project to.

Internals

• Some major database migrations that allow faster queries and better maintainability of a few challenging relations

• Filesystem indexing which is happening in our VMs got a major performance update. The logic was rewritten from Typescript to Rust and in our our bigger project we saw a change from 30-60s down to 10-30ms. Yes, it's magnitudes faster. This will also impact newly imported projects to be available much faster.

• Improved stability and performance of our VMs especially. (We now offer US and EU locations btw)

• Addressed some syncing issues that occurred for people using the online editor and the VScode extension at the same time on multiple devices.

• We closed one workaround for classic sandboxes, where teams were able to fork private and unlisted sandboxes created in the past without having an active subscription at the moment. If a workflow depends on unlisted sandboxes, you can still invite collaborators manually to these Sandboxes.

Besides all this, we shipped a lot of little UI tweaks and bug fixes and more. Based on our Issue Tracker we shipped 96 Tickets in the last two weeks alone (and not all work was tracked in issues).

Also, have you seen our latest updates for Sandpack? Catch up here.

That's it for now, and keep your eyes out for the next update.

Your CodeSandbox Team

Features

• Release the Dracula theme 🧛: check out the documentation to know how to use it;

• Introduce custom NPM registries API: from now on, you can self-host a proxy server to provide private packages;

• SandpackCodeEditor: support markdown and plain-text syntax highlight.

Fixes & others:

• Themes: set new error values in the palette in order to improve the contrast between;

• Documentation: add a new Sandpack guide, which introduces live collaboration in the code editor component;

• CodeMirror integration: use the correct method to indent the code on the tab key press;

• SandpackCodeEditor: test-id should not be included in the bundler.

Since we launched in Public Beta last week over 2.2K new developers got active on using it. The feedback so far is really great and this keeps us going. Thank you so much for everyone helping us making the product better week by week.

So for this week we also have a few updates we want to share.

• We improved the List View on the Dashboard to be more straightforward and better organized

• You can now rename the active branch through the Command Palette (one less click in the UI 🎉)

• Your contribution branches now appear under your personal projects. Open Source contributions for everyone.

• We'll automatically stage git changes if the container needs to be restarted

• You can now search in folders through the file explorer context menu

• Fixed a bug where usernames with special characters could sometimes not create new unix shells.

• We further reduced the time for memory Snapshots (which is important for our branching approach). For example, 4 GB Snapshot takes now ~1 second, and a 1GB Snapshot is below the 500ms mark. Branching will get faster and faster as there is still work to be done.

Till next time 👋

CodeSandbox Projects is now in Open Beta

This is an incredibly exciting week for us. We've worked really hard over the last couple of weeks to make this a reality. We got a lot of invaluable feedback from our closed beta testers. and in the last couple of months, the product has come a long way. Now we can share it with the world and are beyond excited about this one.

If you want to learn more about the release itself, we recommend checking out the release blogpost Ives wrote.

New Documentation

Besides this we have also overhauled our Documentation for all systems. You can now access the following documentation pages:

• CodeSandbox

• CodeSandbox Projects

• CodeSandbox for IOS

A dedicated page to allow quick switching between the documentation is incoming. We focused on getting it all out in time and want to open it for contributions as soon as possible.

GitHub App

With the public beta release, we have also released our GitHub App to create a more seamless experience for all our users. Please check out the documentation.

If you have used the CodeSandbox Workflow in the past, please make sure to remove that one from enabled projects to avoid unexpected behavior. Using the app will allow us to post automatic preview links on PRs and in we'll be able to improve the CodeSandbox Dashboard performance and more, thanks to optimized data transfers that are just not possible with the default API.

Other Changes

We've also rolled out a few changes to our infrastructure. We've further improved our VM branching. Forking now works within a 2 second timeframe and you'll get an exact copy of the moment you clicked fork. See it in action in this video:

and on top we made various internal improvements in our graphQL API and usage to get faster queries, as we'll constantly look at optimizing performance for all our users. There's a ton of other little things we shipped, but

That's it for this week. Let us know on Twitter about your experiences with using CodeSandbox Projects. If you are curious how our team uses it, here's an excellent Thread written by our very own Alex Moldovan.

Here's a summary of the last two weeks. We've been busy. Lets dive right into it:

• Always on previews

  • You can now access preview URLs even if the VM behind it got hibernated and don't need to wait for it to wake up. It will then seamlessly start the VM if needed again.

• Tasks

  • Get a UI notifcation when setup-tasks are completed

  • Fixed the invalid taskId object reference that would sometimes show up

• VScode

  • Replaced “Create a Branch” with “Go to Branch” in the Repository tree view. You can now switch to any existing branch or create a new one within a single flow.

  • Introduced “Go to Repository” and “Go to Branch” commands to quickly switch between all your repositories or all branches within the currently active project respectively.

  • The project’s default branch is now marked with the label “Default” in both Repository tree view and when selecting branches in the “Go to Branch” quick pick window.

  • You can create a new branch much faster now due to the improved branch prompt.

  • Fixed an issue where “Import Project” context menu option would appear on irrelevant menus.

  • More reliable feedback when clicking "Open in VScode" and something is not working as expected

  • Fix issue with VSCode asking for a password sometimes if the users' name was not defined during the git setup.

• Other improvements, Fixes, and additions

  • Prompt GitHub scope updates if needed

  • You can directly fork a project if you do not have write permissions

  • Branching always takes you to the same file you were just looking at

  • Reorganized the Context Menu to avoid confusion. For example Discard Changes and Discard all (n) changes are now next to each other to not click the wrong one by accident

  • Improved the 404 page

  • Restarting a shell task now properly terminates the previously running task if possible.

  • We disabled git-access for read-only branches.

  • Don't show "Open PR" for read-only branches.

  • Get a generative gradient icon when the user didn't upload an avatar in the team settings.

  • Fixed a critical bug that could corrupt the VM and would force a reimport of the project.

  • Limited branch name length to 80 characters as sometimes GitHub would refuse to create branches through the API with too long names

And actually, a lot more happened in these weeks. Easily some of our most productive weeks in recent memory. But ... the coolest things are still on the very close horizon. So stay tuned!

Best,

Your CodeSandbox Team