1
0
mirror of synced 2025-12-19 18:10:59 -05:00

Add 2 pane layout to "Setting up Codespaces" docs and update IA (#21700)

This commit is contained in:
Amy Burns
2021-11-24 14:41:30 -05:00
committed by GitHub
parent cfa19c157c
commit c3bc538cd4
49 changed files with 1409 additions and 1197 deletions

View File

@@ -0,0 +1,63 @@
---
title: Changing the machine type for your codespace
shortTitle: Change the machine type
intro: 'You can change the type of machine that''s running your codespace, so that you''re using resources appropriate for work you''re doing.'
product: '{% data reusables.gated-features.codespaces %}'
versions:
fpt: '*'
ghec: '*'
redirect_from:
- /codespaces/developing-in-codespaces/changing-the-machine-type-for-your-codespace
topics:
- Codespaces
---
## About machine types
{% note %}
**Note:** You can only select or change the machine type if you are a member of an organization using {% data variables.product.prodname_codespaces %} and are creating a codespace on a repository owned by that organization.
{% endnote %}
{% data reusables.codespaces.codespaces-machine-types %}
You can choose a machine type either when you create a codespace or you can change the machine type at any time after you've created a codespace.
For information on choosing a machine type when you create a codespace, see "[Creating a codespace](/codespaces/developing-in-codespaces/creating-a-codespace#creating-a-codespace)."
For information on changing the machine type within {% data variables.product.prodname_vscode %}, see "[Using {% data variables.product.prodname_codespaces %} in {% data variables.product.prodname_vscode %}](/codespaces/developing-in-codespaces/using-codespaces-in-visual-studio-code#changing-the-machine-type-in-visual-studio-code)."
## Changing the machine type in {% data variables.product.prodname_dotcom %}
{% data reusables.codespaces.your-codespaces-procedure-step %}
The current machine type for each of your codespaces is displayed.
!['Your codespaces' list](/assets/images/help/codespaces/your-codespaces-list.png)
1. Click the ellipsis (**...**) to the right of the codespace you want to modify.
1. Click **Change machine type**.
!['Change machine type' menu option](/assets/images/help/codespaces/change-machine-type-menu-option.png)
1. Choose the required machine type.
2. Click **Update codespace**.
The change will take effect the next time your codespace restarts.
## Force an immediate update of a currently running codespace
If you change the machine type of a codespace you are currently using, and you want to apply the changes immediately, you can force the codespace to restart.
1. At the bottom left of your codespace window, click **{% data variables.product.prodname_codespaces %}**.
![Click '{% data variables.product.prodname_codespaces %}'](/assets/images/help/codespaces/codespaces-button.png)
1. From the options that are displayed at the top of the page select **Codespaces: Stop Current Codespace**.
!['Suspend Current Codespace' option](/assets/images/help/codespaces/suspend-current-codespace.png)
1. After the codespace is stopped, click **Restart codespace**.
![Click 'Resume'](/assets/images/help/codespaces/resume-codespace.png)

View File

@@ -1,172 +0,0 @@
---
title: Configuring Codespaces for your project
intro: 'You can use a `devcontainer.json` file to define a {% data variables.product.prodname_codespaces %} environment for your repository.'
permissions: People with write permissions to a repository can create or edit the codespace configuration.
redirect_from:
- /github/developing-online-with-github-codespaces/configuring-github-codespaces-for-your-project
- /codespaces/setting-up-your-codespace/configuring-codespaces-for-your-project
- /github/developing-online-with-codespaces/configuring-codespaces-for-your-project
versions:
fpt: '*'
ghec: '*'
type: how_to
topics:
- Codespaces
- Set up
- Fundamentals
product: '{% data reusables.gated-features.codespaces %}'
shortTitle: Configure your project
---
## About dev containers
A development container, or dev container, is the environment that {% data variables.product.prodname_codespaces %} uses to provide the tools and runtimes that your project needs for development. If your project does not already have a dev container defined, {% data variables.product.prodname_codespaces %} will use the default configuration, which contains many of the common tools that your team might need for development with your project. For more information, see "[Using the default configuration](#using-the-default-configuration)."
If you want all users of your project to have a consistent environment that is tailored to your project, you can add a dev container to your repository. You can use a predefined configuration to select a common configuration for various project types with the option to further customize your project or you can create your own custom configuration. For more information, see "[Using a predefined container configuration](#using-a-predefined-container-configuration)" and "[Creating a custom codespace configuration](#creating-a-custom-codespace-configuration)." The option you choose is dependent on the tools, runtimes, dependencies, and workflows that a user might need to be successful with your project.
{% data variables.product.prodname_codespaces %} allows for customization on a per-project and per-branch basis with a `devcontainer.json` file. This configuration file determines the environment of every new codespace anyone creates for your repository by defining a development container that can include frameworks, tools, extensions, and port forwarding. A Dockerfile can also be used alongside the `devcontainer.json` file in the `.devcontainer` folder to define everything required to create a container image.
### devcontainer.json
{% data reusables.codespaces.devcontainer-location %}
You can use your `devcontainer.json` to set default settings for the entire codespace environment, including the editor, but you can also set editor-specific settings for individual [workspaces](https://code.visualstudio.com/docs/editor/workspaces) in a codespace in a file named `.vscode/settings.json`.
For information about the settings and properties that you can set in a `devcontainer.json`, see [devcontainer.json reference](https://aka.ms/vscode-remote/devcontainer.json) in the {% data variables.product.prodname_vscode %} documentation.
### Dockerfile
A Dockerfile also lives in the `.devcontainer` folder.
You can add a Dockerfile to your project to define a container image and install software. In the Dockerfile, you can use `FROM` to specify the container image.
```Dockerfile
FROM mcr.microsoft.com/vscode/devcontainers/javascript-node:0-14
# ** [Optional] Uncomment this section to install additional packages. **
# USER root
#
# RUN apt-get update && export DEBIAN_FRONTEND=noninteractive \
# && apt-get -y install --no-install-recommends <your-package-list-here>
#
# USER codespace
```
You can use the `RUN` instruction to install any software and `&&` to join commands.
Reference your Dockerfile in your `devcontainer.json` file by using the `dockerfile` property.
```json
{
...
"build": { "dockerfile": "Dockerfile" },
...
}
```
For more information on using a Dockerfile in a dev container, see [Create a development container](https://code.visualstudio.com/docs/remote/create-dev-container#_dockerfile) in the {% data variables.product.prodname_vscode %} documentation.
## Using the default configuration
If you don't define a configuration in your repository, {% data variables.product.prodname_dotcom %} creates a codespace with a base Linux image. The base Linux image includes languages and runtimes like Python, Node.js, JavaScript, TypeScript, C++, Java, .NET, PHP, PowerShell, Go, Ruby, and Rust. It also includes other developer tools and utilities like git, GitHub CLI, yarn, openssh, and vim. To see all the languages, runtimes, and tools that are included use the `devcontainer-info content-url` command inside your codespace terminal and follow the url that the command outputs.
Alternatively, for more information about everything that is included in the base Linux image, see the latest file in the [`microsoft/vscode-dev-containers`](https://github.com/microsoft/vscode-dev-containers/tree/main/containers/codespaces-linux) repository.
The default configuration is a good option if you're working on a small project that uses the languages and tools that {% data variables.product.prodname_codespaces %} provides.
## Using a predefined container configuration
Predefined container definitions include a common configuration for a particular project type, and can help you quickly get started with a configuration that already has the appropriate container options, {% data variables.product.prodname_vscode %} settings, and {% data variables.product.prodname_vscode %} extensions that should be installed.
Using a predefined configuration is a great idea if you need some additional extensibility. You can also start with a predefined configuration and amend it as needed for your project's setup.
{% data reusables.codespaces.command-palette-container %}
1. Click the definition you want to use.
![List of predefined container definitions](/assets/images/help/codespaces/predefined-container-definitions-list.png)
1. Follow the prompts to customize your definition. For more information on the options to customize your definition, see "[Adding additional features to your `devcontainer.json` file](#adding-additional-features-to-your-devcontainerjson-file)."
1. Click **OK**.
![OK button](/assets/images/help/codespaces/prebuilt-container-ok-button.png)
1. To apply the changes, in the bottom right corner of the screen, click **Rebuild now**. For more information about rebuilding your container, see "[Applying changes to your configuration](#applying-changes-to-your-configuration)."
!["Codespaces: Rebuild Container" in the {% data variables.product.prodname_vscode_command_palette %}](/assets/images/help/codespaces/rebuild-prompt.png)
### Adding additional features to your `devcontainer.json` file
{% note %}
**Note:** This feature is in beta and subject to change.
{% endnote %}
You can add features to your predefined container configuration to customize which tools are available and extend the functionality of your workspace without creating a custom codespace configuration. For example, you could use a predefined container configuration and add the {% data variables.product.prodname_cli %} as well. You can make these additional features available for your project by adding the features to your `devcontainer.json` file when you set up your container configuration.
You can add some of the most common features by selecting them when configuring your predefined container. For more information on the available features, see the [script library](https://github.com/microsoft/vscode-dev-containers/tree/main/script-library#scripts) in the `vscode-dev-containers` repository.
![The select additional features menu during container configuration.](/assets/images/help/codespaces/select-additional-features.png)
You can also add or remove features outside of the **Add Development Container Configuration Files** workflow.
1. Access the Command Palette (`Shift + Command + P` / `Ctrl + Shift + P`), then start typing "configure". Select **Codespaces: Configure Devcontainer Features**.
![The Configure Devcontainer Features command in the command palette](/assets/images/help/codespaces/codespaces-configure-features.png)
2. Update your feature selections, then click **OK**.
![The select additional features menu during container configuration.](/assets/images/help/codespaces/select-additional-features.png)
1. To apply the changes, in the bottom right corner of the screen, click **Rebuild now**. For more information about rebuilding your container, see "[Applying changes to your configuration](#applying-changes-to-your-configuration)."
!["Codespaces: Rebuild Container" in the command palette](/assets/images/help/codespaces/rebuild-prompt.png)
## Creating a custom codespace configuration
If none of the predefined configurations meet your needs, you can create a custom configuration by adding a `devcontainer.json` file. {% data reusables.codespaces.devcontainer-location %}
In the file, you can use [supported configuration keys](https://code.visualstudio.com/docs/remote/devcontainerjson-reference) to specify aspects of the codespace's environment, like which {% data variables.product.prodname_vscode %} extensions will be installed.
{% data reusables.codespaces.vscode-settings-order %}
You can define default editor settings for {% data variables.product.prodname_vscode %} in two places.
* Editor settings defined in `.vscode/settings.json` are applied as _Workspace_-scoped settings in the codespace.
* Editor settings defined in the `settings` key in `devcontainer.json` are applied as _Remote [Codespaces]_-scoped settings in the codespace.
After updating the `devcontainer.json` file, you can rebuild the container for your codespace to apply the changes. For more information, see "[Applying changes to your configuration](#applying-changes-to-your-configuration)."
<!--
## Supported codespace configuration keys
You can use configuration keys supported by {% data variables.product.prodname_codespaces %} in `devcontainer.json`.
### General settings
- `name`
- `settings`
- `extensions`
- `forwardPorts`
- `postCreateCommand`
### Docker, Dockerfile, or image settings
- `image`
- `dockerFile`
- `context`
- `containerEnv`
- `remoteEnv`
- `containerUser`
- `remoteUser`
- `mounts`
- `runArgs`
- `overrideCommand`
- `dockerComposeFile`
For more information about the available settings for `devcontainer.json`, see [devcontainer.json reference](https://aka.ms/vscode-remote/devcontainer.json) in the {% data variables.product.prodname_vscode %} documentation.
-->
## Applying changes to your configuration
{% data reusables.codespaces.apply-devcontainer-changes %}
{% data reusables.codespaces.rebuild-command %}
1. {% data reusables.codespaces.recovery-mode %} Fix the errors in the configuration.
![Error message about recovery mode](/assets/images/help/codespaces/recovery-mode-error-message.png)
- To diagnose the error by reviewing the creation logs, click **View creation log**.
- To fix the errors identified in the logs, update your `devcontainer.json` file.
- To apply the changes, rebuild your container.

View File

@@ -10,8 +10,10 @@ redirect_from:
topics:
- Codespaces
children:
- /configuring-codespaces-for-your-project
- /personalizing-codespaces-for-your-account
- /changing-the-machine-type-for-your-codespace
- /setting-your-default-editor-for-codespaces
- /setting-your-default-region-for-codespaces
- /prebuilding-codespaces-for-your-project
---

View File

@@ -10,7 +10,7 @@ topics:
- Set up
- Fundamentals
product: '{% data reusables.gated-features.codespaces %}'
shortTitle: Prebuilding Codespaces
shortTitle: Prebuild Codespaces
---
{% note %}

View File

@@ -0,0 +1,26 @@
---
title: Setting your default editor for Codespaces
intro: 'You can set your default editor for {% data variables.product.prodname_codespaces %} in your personal settings page.'
product: '{% data reusables.gated-features.codespaces %}'
versions:
fpt: '*'
ghec: '*'
redirect_from:
- /codespaces/managing-your-codespaces/setting-your-default-editor-for-codespaces
topics:
- Codespaces
shortTitle: Set the default editor
---
On the settings page, you can set your editor preference so that any newly created codespaces are opened automatically in either {% data variables.product.prodname_vscode %} for Web or the {% data variables.product.prodname_vscode %} desktop application.
If you want to use {% data variables.product.prodname_vscode %} as your default editor for {% data variables.product.prodname_codespaces %}, you need to install {% data variables.product.prodname_vscode %} and the {% data variables.product.prodname_github_codespaces %} extension for {% data variables.product.prodname_vscode %}. For more information, see the [download page for {% data variables.product.prodname_vscode %}](https://code.visualstudio.com/download/) and the [{% data variables.product.prodname_github_codespaces %} extension on the {% data variables.product.prodname_vscode %} marketplace](https://marketplace.visualstudio.com/items?itemName=GitHub.codespaces).
## Setting your default editor
{% data reusables.user_settings.access_settings %}
{% data reusables.user_settings.codespaces-tab %}
1. Under "Editor preference", select the option you want.
![Setting your editor](/assets/images/help/codespaces/select-default-editor.png)
If you choose **{% data variables.product.prodname_vscode %}**, {% data variables.product.prodname_codespaces %} will automatically open in the desktop application when you next create a codespace. You may need to allow access to both your browser and {% data variables.product.prodname_vscode %} for it to open successfully.
![Setting your editor](/assets/images/help/codespaces/launch-default-editor.png)

View File

@@ -0,0 +1,23 @@
---
title: Setting your default region for Codespaces
intro: 'You can set your default region in the {% data variables.product.prodname_github_codespaces %} profile settings page to personalize where your data is held.'
product: '{% data reusables.gated-features.codespaces %}'
versions:
fpt: '*'
ghec: '*'
redirect_from:
- /codespaces/managing-your-codespaces/setting-your-default-region-for-codespaces
topics:
- Codespaces
shortTitle: Set the default region
---
You can manually select the region that your codespaces will be created in, allowing you to meet stringent security and compliance requirements. By default, your region is set automatically, based on your location.
## Setting your default region
{% data reusables.user_settings.access_settings %}
{% data reusables.user_settings.codespaces-tab %}
1. Under "Region", select the setting you want.
2. If you chose "Set manually", select your region in the drop-down list.
![Selecting your region](/assets/images/help/codespaces/select-default-region.png)