Full Code Reviews in CodeSandbox

Necoline - Aug 2 '23 - - Dev Community

At CodeSandbox, we run your code in our cloud infrastructure, configure the environment for you and keep your code always ready, behind a shareable URL. Give it a try with this Next.js example or import your GitHub repo!


The way we review PRs hasn’t changed much in the last few decades. But that doesn’t mean it should remain the way it is

If we zoom into the process itself, it quickly becomes clear it’s highly inefficient for both the person requesting a review and those reviewing it.

Typically, the person creating the PR will try to organize their work into meaningful commits, provide some context in the description, and then add reviewers. Those reviewing the PR will likely need to stash the changes of their current work before spinning up the review branch locally, and then hop between their local editor and GitHub to reference any prior conversation.

Even though this is status quo, each step of the way opens the door to context-switching, fragmented communication and ambiguity. So that’s why we’re thrilled to present CodeSandbox as an all-in-one solution for code reviews 🎉

The Cost of Review Chaos

As we found in our recent report on “The State of Code Reviews”, one of the main frustrations of the code review process is context switching. More than breaking your current flow, stopping your work to checkout another branch locally is a significant time sink—especially when you have to tinker with the setup if something is not up-to-date.

Then, spinning up a dev server to visually inspect the changes may result in 5+ minutes of idle time waiting for the server to start. And to cap it all off, communication is often scattered between GitHub, Slack, Jira and synchronous meetings—which builds up ambiguity and frustration for everyone involved.

Multiply all this by the number of reviews done per week and you’ll likely land on 1-5 hours lost every week for each developer in the company. Of course, some developers might choose to avoid dealing with all of this and just check the code diffs and “LGTM!”.

Suffice it to say, this is far from ideal.

Code Reviews in CodeSandbox

As a team of developers, we have felt this pain at CodeSandbox. So we decided to build a PR review workflow that solves what we have identified as the fundamental problems of code reviews:

  1. Context switching: This breaks the coding flow and siphons energy from developers.
  2. Idle time: Setting up and running a branch locally takes too much time and is prone to errors and inconsistencies.
  3. Lost context: Scattered communication leads to loss of context, ambiguity, cop-out reviews, and lower code quality.

Thanks to the instant cloud development environments provided by the “new” version of CodeSandbox, we are giving a dedicated microVM to every branch (and every PR) while making sure that it resumes in 1 second. And if you configure our GitHub App, we automatically comment on every PR with a link to this microVM, so you can start reviewing immediately.

Video thumbnail

This is a game-changer. It means that you’ll never have to wait for a dev server ever again. Plus, because we run it all in our cloud infra, you can open as many simultaneous branches as you’d like, each with its own dev server running. Then, you can share them with a URL with any team member so they can access them just as quickly—either through our web editor, VS Code, or our iOS app.

While this already brings a lot of value, we still wanted a way to improve problem #3: communication. And that’s the latest major update we’ve brought to CodeSandbox: built-in review functionality.

This update brings all the review tooling you know and love, built into CodeSandbox with two-way sync with GitHub. Now, on the new PR review panel you will find:

  • a list of reviewers
  • the review state
  • a view of changes by file
  • support for adding line comments to diffs
  • AI-generated review messages
  • support for submitting reviews directly through the CodeSandbox UI.

Video thumbnail

After beta testing this with the first batch of teams, we have received overwhelmingly positive feedback and are happy to roll it out to everyone!

If you’re interested, don’t miss our tutorial on how to set things up. You simply need to set it up once per repo—and in most cases, it just takes 5 minutes!

A Win for Builders

Code reviews are probably not every developer’s cup of tea. But they’re still a crucial part of the development process.

So we are thrilled to empower builders to win back hours every week that they can reinvest in the parts of coding that they love.

Give it a try by importing a repo! We have a 14-day free trial you can use to test all our features.

And as always, do let us know how we can make this experience even better for you. Leave a message on Discord or tag @codesandbox on Twitter. We’d love to hear from you!

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .