docs/content/codespaces/developing-in-codespaces/developing-in-a-codespace.md

title, intro, product, redirect_from, versions, type, topics, shortTitle

title	intro	product	redirect_from	versions	type	topics	shortTitle
Developing in a codespace	You can open a codespace on {% data variables.product.product_name %}, then develop using {% data variables.product.prodname_vscode %}'s features.	{% data reusables.gated-features.codespaces %}	/github/developing-online-with-github-codespaces/developing-in-a-codespace /github/developing-online-with-codespaces/developing-in-a-codespace	fpt ghec * *	how_to	Codespaces Fundamentals Developer	Develop in a codespace

About development with {% data variables.product.prodname_github_codespaces %}

{% data variables.product.prodname_github_codespaces %} provides you with the full development experience of {% data variables.product.prodname_vscode %}. {% data reusables.codespaces.use-visual-studio-features %}

{% data reusables.codespaces.links-to-get-started %}

1. Side Bar - By default, this area shows your project files in the Explorer.
2. Activity Bar - This displays the Views and provides you with a way to switch between them. You can reorder the Views by dragging and dropping them.
3. Editor - This is where you edit your files. You can use the tab for each editor to position it exactly where you need it.
4. Panels - This is where you can see output and debug information, as well as the default place for the integrated Terminal.
5. Status Bar - This area provides you with useful information about your codespace and project. For example, the branch name, configured ports, and more.

For more information on using {% data variables.product.prodname_vscode_shortname %}, see the User Interface guide in the {% data variables.product.prodname_vscode_shortname %} documentation.

{% data reusables.codespaces.connect-to-codespace-from-vscode %}

{% data reusables.codespaces.use-chrome %} For more information, see "Troubleshooting {% data variables.product.prodname_github_codespaces %} clients."

Personalizing your codespace

{% data reusables.codespaces.about-personalization %} For more information, see "Personalizing {% data variables.product.prodname_github_codespaces %} for your account."

{% data reusables.codespaces.apply-devcontainer-changes %} For more information, see "Introduction to dev containers."

Running your app from a codespace

{% data reusables.codespaces.about-port-forwarding %} For more information, see "Forwarding ports in your codespace."

Committing your changes

{% data reusables.codespaces.committing-link-to-procedure %}

Using the {% data variables.product.prodname_vscode_command_palette %}

The {% data variables.product.prodname_vscode_command_palette %} allows you to access and manage many features for {% data variables.product.prodname_github_codespaces %} and {% data variables.product.prodname_vscode_shortname %}. For more information, see "Using the {% data variables.product.prodname_vscode_command_palette_shortname %} in {% data variables.product.prodname_github_codespaces %}."