Not sure what [[Git]] is? ### Working with GitHub Codespaces GitHub Codespaces provides a fully configured development environment directly in your browser. It's a powerful tool that allows you to write, run, and debug code from anywhere without the need for local setup. In this lesson, we'll guide you through creating a codespace, running an application, making changes, and personalizing your setup. #### Creating Your Codespace 1. **Navigate to the Template Repository**: Go to the [github/haikus-for-codespaces](https://github.com/github/haikus-for-codespaces) template repository. 2. **Create a Codespace**: Click "Use this template," then click "Open in a codespace." #### Running the Application 1. **Start the Application**: Once your codespace is created, enter the command `npm run dev` in the terminal to start the web application. 2. **View the Application**: Click "Open in Browser" when prompted to view your running application in a new tab. #### Editing the Application 1. **Edit the File**: Switch back to your codespace and open the `haikus.json` file. Edit the text field of the first haiku to personalize the application. 2. **View Changes**: Refresh the running application tab in your browser to see your changes. #### Committing and Pushing Your Changes 1. **Stage Changes**: Click next to the `haikus.json` file to stage your changes. 2. **Commit Changes**: Type a commit message and click "Commit." 3. **Publish Branch**: Click "Publish Branch," name your new repository, and select either a private or public repository on GitHub. #### Personalizing with an Extension 1. **Install an Extension**: Click the Extensions icon in the Activity Bar, search for "fairyfloss," and click "Install." 2. **Select the Theme**: Choose the fairyfloss theme from the list. #### Settings Sync Enable Settings Sync to synchronize extensions and settings across devices and instances of VS Code. More information can be found in [Personalizing GitHub Codespaces for your account](https://docs.github.com/en/codespaces/customizing-your-codespace/personalizing-github-codespaces-for-your-account#settings-sync). ### Next Steps - **Deep Dive**: Explore the technical aspects of GitHub Codespaces in the [Deep dive into Codespaces](https://docs.github.com/en/codespaces/getting-started/deep-dive). - **Custom Configuration**: Learn how to create custom configurations for Codespaces in the [Introduction to dev containers](https://docs.github.com/en/codespaces/customizing-your-codespace/personalizing-github-codespaces-for-your-account#settings-sync). ### Summary This lesson provides a hands-on introduction to GitHub Codespaces, guiding you through creating, running, and personalizing a codespace. By following these steps, you'll gain practical experience with this powerful development environment, enabling you to work on projects from any location without the need for local setup. Feel free to refer to the [Quickstart for GitHub Codespaces](https://docs.github.com/en/codespaces/getting-started/quickstart) for detailed instructions and further reading. Let me know if you need any adjustments or additional information! [  GitHub - github/haikus-for-codespaces  github.com ](https://github.com/github/haikus-for-codespaces)