Getting Started with CodeSandbox | CodeSandbox 101

Step-by-Step Tutorial: Getting Started with CodeSandbox

1. Create an Account and Log In:

   • Visit the CodeSandbox website and create an account or log in to your existing account.
   • Head to your dashboard after logging in.

2. Select a Workspace:

   • From your dashboard, select a workspace that you belong to. Workspaces can represent different teams or projects.

3. Create a New Sandbox:

   • In the workspace dashboard, choose to create a new sandbox.
   • Sandboxes are isolated instances where you can code anything you want.
   • Select from a wide library of cloud templates for different languages like Rust, PHP, etc.
   • Click on a template to create the environment.

4. Import a Repository:

   • To demonstrate faster and easier coding and collaboration, import a repository into CodeSandbox.
   • Paste the repository URL and click on import to bring the project into CodeSandbox.

5. Customize Your Environment:

   • CodeSandbox will detect your project files and suggest an ideal environment setup.
   • You can customize the suggested environment or configure your own from scratch.
   • Add Dev container features like Docker as needed.
   • Define setup tasks to install and run anything required for your environment.
   • Customize variables and further configure your environment.

6. Install CodeSandbox Requirement:

   • Install the CodeSandbox GitHub app to add a bot to your GitHub repository.
   • This allows for easy access to branches or PRs in CodeSandbox for development preview and staging.

7. Review and Approve Setup:

   • Review your setup and make any necessary improvements.
   • Restart the VM if needed.
   • Once satisfied, resume your project using an existing snapshot for instant development continuation.

8. Commit Dev Container Changes:

   • It's recommended to commit the Dev container changes to make them available to your team members.

9. Finalize and Develop:

   • With the setup complete, you are ready to start developing in CodeSandbox.

By following these steps, you can efficiently get started with CodeSandbox and begin coding and collaborating on your projects.