A Better GitHub Workflow
React Native Paper (Material Design)
3rd August 2021
The Dart Programming Language
10th August 2021
While you’ve been able to import and export projects to and from GitHub for a while, the workflow was confusing. This update focuses on making that workflow more user-friendly. We’ve tackled five areas: refining the core flow, improving the UI, adding new functionality to keep sandboxes in sync, as well as adding new, quicker ways to import projects, and a better way to work with repos in the long-term. Let’s dig into the changes.
Core flow changes
When you import a project from GitHub, the resulting sandbox stays up to date with the repo on GitHub, and you can fork it to make changes on CodeSandbox. Now, once you’ve made changes, you can either commit them directly to master or create a new branch and start a PR while staying in the same sandbox.
UI changes
We’ve made the UI clearer with indicators and instructions on the status of your project and the next steps you need to take. Sandboxes from GitHub are now more easily distinguishable from regular sandboxes: there are different action bar menu items, and a GitHub info section replaces the regular sandbox info panel. This provides a link to the original repo along with instructions on making changes to it. There’s also an indication of the branch and repo it came from in the top menu bar.
Stay in sync and fix merge conflicts
We’ve added essential new functionality that enables you to keep a sandbox in sync with a repo and resolve conflicts if they occur. You no longer need to keep forking the imported sandbox to work with changes made to the repo outside of CodeSandbox. You can see when a change you make causes merge conflicts, and they can be resolved in the sandbox. This means you can more easily use CodeSandbox alongside your local development setup, or other tools, to contribute code to a repo.
Importing projects from GitHub to CodeSandbox
There are also some new ways to import projects from GitHub to CodeSandbox. You can replace ‘github.com’ with ‘githubbox.com’ in a URL to a repo, and we’ll import it. Thanks to CodeSandbox community user Dominik Ferber for putting this together using our import functionality. We’ve sponsored the project so you can rely on it being around for the long-term. You can also use our browser extensions for Chrome and Firefox, which add an import button within the UI on GitHub repo pages.
Overall, these updates should make working with GitHub on CodeSandbox easier to understand and do. Try it out and let us know how you get on.
