What is Github Codespaces

In this guide, we’ll provide a very straightforward explanation about Github Codespaces and why we think it’s an excellent tool for learning coding-related skills, that’s why it’s one of the leading teaching tools we use at 4Geeks.

What is GitHub Codespaces?

In plain English: Github Codespaces is a computer builder “on the go”. Instead of using your own computer or working on your code locally; instead, you can ask Github Codespaces to create a remote computer and give you access to it; you can use that remote computer to work on your project or code.

Why use GitHub Codespaces?

One of the most significant issues when learning a new coding-related skill is configuration. E.g: When I started learning PHP (a coding language) it took me 1 week to successfully install it on my computer.

Following online tutorials is tricky because everyone has a different computer, with different configurations, operating systems, languages, etc.

Focus on learning instead of configurations

When you open a GitHub repository using Github Codespaces instead of your local computer, you will use a perfectly-configured environment to run your tutorial or project.

• Every student or classmate has the same type of computer and configuration.
• Focus on learning the topic or skill you want to learn instead of doing a lot of configuration before you can start learning.
• Easily share your remote computer with your teacher or classmates.
• Since the code will run in the cloud, your computer does not need a lot of resources; you can use an iPad or Chromebook.

What are Codespace's disadvantages?

• Being a cloud-based solution, if you lose your Internet connection, you won’t be able to continue working on your project.
• Additional cost: You have to pay for the remote computers additionally; Instead of working for free on your own local computer.

How does Github Codespaces work?

Are you familiar with GitHub and what a Git Repository is? If you already know what Github and Git are please skip this next 3 paragraphs, otherwise read it carefully:

What are GitHub and Git?

Git: You can think of GIT like “Google Docs but for code”. Software developers don’t like to save their progress on their own personal computers. Saving your code in your local hard drive makes it hard to share with your teammates; everyone in your team should have access to the code almost in real-time. Git was created to help share your project code among the team, track changes from everyone and help merge and sync those changes back into every single developer in the team.

Github: On the other hand, you can think about GitHub as a social network for coders and development teams; instead of sharing images like Instagram or videos like Tiktok you will be sharing code; people can review and comment on your code, and you can invite people to contribute to your code, etc.

GitHub is a website that compliments Git significantly; Github will provide you with an online website or URL where you can upload your code (using Git) and invite other people to review it.

Work on a “codespace” instead of your computer

With codespaces, your code will still be saved on Github (using git), but instead of downloading the code to work on your computer, you press a button to open a remote computer called a “Codespace” that will contain the latest version of your code.

How to open a GitHub Codespace

Note: this example is for educational purposes on how to work in a professional setting. Each project we will undertake will have its instructions in the Readme.md file, please read carefully on how to initialize them.

Let’s follow the process exactly like a real-life software developer would do. For example:

Maria gets hired as a developer to join an ongoing project; during the first day of work she needs to get access to the code, so she asks the project leader for the project URL within github.com.

1. Team leader said that the code is located on the following website: https://github.com/breatheco-de/exercise-postcard.
2. Maria opens her browser and navigates to that website; Here is an explanation on what you will see once you open the website.
3. Maria then looks for the “code” button, and creates the new codespace.
4. Once the codespace is opened, Maria will see the VS-Code coding editor open with a copy of the project code.

The terminal

To work on your projects you will need access to the terminal, you can always find or open the terminal by clicking on the hamburger menu on the top left and selecting the “terminal” => “new terminal” option.

What is the terminal or command line?

Every computer has a terminal, and you use it to do almost everything you want: open an application, create a file, folder, etc. However, in Codespaces, the terminal will only control the virtual computer.

You don't have to learn the terminal's commands yet, but we strongly recommend reading this lesson to get familiar and know its functions and limitations.