Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/unkn0wnn4m3/skills-code-with-codespaces

My clone repository
https://github.com/unkn0wnn4m3/skills-code-with-codespaces

Last synced: 2 days ago
JSON representation

My clone repository

Host: GitHub
URL: https://github.com/unkn0wnn4m3/skills-code-with-codespaces
Owner: Unkn0wnN4m3
License: mit
Created: 2023-11-02T17:52:48.000Z (about 1 year ago)
Default Branch: main
Last Pushed: 2023-11-02T18:11:56.000Z (about 1 year ago)
Last Synced: 2023-11-03T18:41:39.365Z (about 1 year ago)
Language: HTML
Size: 12.7 KB
Stars: 0
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md
- License: LICENSE

Awesome Lists containing this project

README

# Code with GitHub Codespaces and Visual Studio Code

_Develop code using GitHub Codespaces and Visual Studio Code!_

## Step 2: Add a custom image to your codespace!

_Nice work! :tada: You created your first codespace and pushed code using VS Code!_

You can configure the development container for a repository so that any codespace created for that repository will give you a tailored development environment, complete with all the tools and runtimes you need to work on a specific project.

**What are development containers?** Development containers, or dev containers, are Docker containers that are specifically configured to provide a fully featured development environment. Whenever you work in a codespace, you are using a dev container on a virtual machine.

A dev container file is a JSON file that lets you customize the default image that runs your codespace, VS code settings, run custom code, forward ports and much more!

Let's add a `devcontainer.json` file and add a custom image.

### :keyboard: Activity: Add a .devcontainer.json file to customize your codespace

1. Navigating back to your **Code** tab of your repository, click the **Add file** drop-down button, and then click `Create new file`.
1. Type or paste the following in the empty text field prompt to name your file.

```
.devcontainer/devcontainer.json
```

1. In the body of the new **.devcontainer/devcontainer.json** file, add the following content:

```jsonc
{
// Name this configuration
"name": "Codespace for Skills!",
// Use the base codespace image
"image": "mcr.microsoft.com/vscode/devcontainers/universal:latest",

"remoteUser": "codespace",
"overrideCommand": false
}
```

1. Click **Commit changes** and then select **Commit changes directly to the `main` branch**.
1. Create a new codespace by navigating back to the **Code** tab of your repository.
1. Click the green **Code** button located in the middle of the page.
1. Click the **Codespaces** tab on the box that pops up.
1. Click the **Create codespace on main** button OR click the `+` sign on the tab. This will create a new codespace on the main branch. (Notice your other codespace listed here.)

> Wait about **2 minutes** for the codespace to spin itself up.

1. Verify that your new codespace is is running, as you did previously.

Note the image being used is the default image provided for GitHub Codespaces. It includes runtimes and tools for Python, Node.js, Docker, and more. See the full list here: https://aka.ms/ghcs-default-image. Your development team can use any custom image that has the necessary prerequisites installed. For more information, see [codespace image](https://aka.ms/configure-codespace).

1. Wait about 20 seconds then refresh this page (the one you're following instructions from). [GitHub Actions](https://docs.github.com/en/actions) will automatically update to the next step.

---

Get help: [Post in our discussion board](https://github.com/orgs/skills/discussions/categories/code-with-codespaces) • [Review the GitHub status page](https://www.githubstatus.com/)