These instructions will guide you through the process of setting up Codespaces, an online IDE. IDE stands for Integrated Development Environment, which is a program that software developers use to write code. You can use any text editor to write code, but an IDE makes it much easier.
Think of Codespaces like Microsoft Word for code. You can write a really long essay in Notepad if you want to, but you'll almost always prefer to do it in Word or Google Docs.
Create a Github account. Github is a free service that stores code for you in the cloud. It is the industry standard for storing and sharing software code. Think of it like Google Drive for code!
For your username, <firstname>-<lastinitial>-ephrata-teals
format. So, if your name was Jane Doe, your username would be jane-d-ephrata-teals
.
- In a new tab in Chrome, go to https://github.com
- Click "Sign up" in the top right corner
- Enter your username in the
<firstname>-<lastinitial>-ephrata-teals
format - Enter your
<firstname>-<lastinitial>-ephrata-teals@outlook.com
email - Choose a password
- Solve the verification puzzle
- Click "Create account"
- In a new tab in Chrome, go to https://outlook.live.com/. You should see an email from Github asking you to verify your email address
- Open the email and click "Verify email address"
In this step you'll be copying an existing Github repository to your own account. You can think of a repository as a special kind of folder for code. It's actually much more complicated (and powerful) than that, but you'll learn about all of that another time.
-
In a new tab in Chrome, go to https://github.com/DataSnowman/EphrataTEALS
-
Click on "Fork" in the top right corner
-
If you are asked "Where should we fork EphrataTEALS?", click on your new Github username
You now have a copy of the EphrataTEALS repository in your GitHub. This is what you should see:
My username was darsch so the repository shows up as darsh/EphrataTEALS
.
Yours should be <firstname>-<lastinitial>-ephrata-teals/EphrataTEALS
.
Click on https://github.com/features/codespaces/signup to request access for GitHub Codespaces beta
Click on the button "Sign in to sign up for the beta" and sign in with your GitHub user and password.
We're on to the last part - setting up your Codespace.
Once you have access to GitHub Codespaces it will show up on the top menu
Step 1: Create your Codespace
-
Click "Codespaces" on the top menu
-
Click on "Create your first codespace" button
-
Enter your Repository and choose the master (or Main) branch
-
Click "Create codespace" button
-
Wait for the environment to be created
-
Wait for a minute or so while the environment is set up for you. It might look like nothing is happening, just be patient.
Step 2: Configure GitHub settings and remote for fork
This step will involve entering some commands into the terminal, or command line. If this if the first time you've used a terminal, it can be intimidating. Don't worry! Just follow the directions and copy and paste the commands exactly. When an instruction says to enter a command, it means to type (or paste) the command, and then press the Enter key to execute it.
-
Open a terminal in your Codspace using the keyboard shortcut
Ctrl + `
(you can also go to the menu in the top left and select Terminal > New Terminal)
Make sure it is a bash shell
- In the terminal, type or paste the following command and hit Enter:
pwd
- Now enter the following command (remember, "entering" a command means typing or pasting it into the terminal, then pressing Enter to execute it):
git status
Your terminal should now look like the following, except it will say "EphrataTEALS" instead of "TEALS1":
- Enter the following command, replacing
<GitHubusername>
with the<firstname>-<lastinitial>-ephrata-teals
username you created earlier:
git config --global user.name "<GitHubusername>"
- Confirm that you have set the username correctly by entering the following command:
git config --global user.name
- Enter the following command, replacing
email@example.com
with your<firstname>-<lastinitial>-ephrata-teals@outlook.com
email:
git config --global user.email "email@example.com"
- Confirm that you have set the email address correctly by entering the following command:
git config --global user.email
- Enter the following command:
git remote -v
- Make sure that your terminal displays the following:
> origin https://github.com/<firstname>-<lastinitial>-ephrata-teals/EphrataTEALS (fetch)
> origin https://github.com/<firstname>-<lastinitial>-ephrata-teals/EphrataTEALS (push)
- Enter the following command as-is (do not replace the username):
git remote add upstream https://github.com/DataSnowman/EphrataTEALS.git
- Enter the following command again:
git remote -v
- Make sure that your terminal displays the following:
> origin https://github.com/<firstname>-<lastinitial>-ephrata-teals/EphrataTEALS (fetch)
> origin https://github.com/<firstname>-<lastinitial>-ephrata-teals/EphrataTEALS (push)
> upstream https://github.com/DataSnowman/EphrataTEALS.git (fetch)
> upstream https://github.com/DataSnowman/EphrataTEALS.git (push)
- Finally, enter the following command:
git pull upstream master
Step 3: Run your CodespacesBeta.java program!
- In
sampleCode > GitHubCodespacesTest
, findCodespacesBeta.java
. The contents of the file should look like this:
package sampleCode.GitHubCodespacesTest;
public class CodespacesBeta {
public static void main(String[] args) {
String x = "Merry Christmas !!!";
System.out.println(x);
}
}
- Codespaces may automatically open some other tabs. If this happens, just close them and return to
CodespacesBeta.java
. - On the sidebar, click the "Run" button (the one with the play button and the little bug):
- Click "Run and Debug". Again, Codespaces may automatically open some other tabs. If this happens, close them and click "Run and Debug" again.
- You should see the following output in the terminal:
Congratulations! You just ran your first program!
Step 4: Copy the GitHubCodespacesTest folder and paste to studentWork folder and then change the code
- In
CodespacesBeta.java
, find the line that readspackage sampleCode.GitHubCodespacesTest;
- Change sampleCode to studentWork so it reads
package studentWork.GitHubCodespacesTest;
- In
CodespacesBeta.java
, find the line that readsSystem.out.println("Merry Christmas !!!");
- Replace
Merry Christmas
withHappy New Year
(or anything, really! You could writeHappy New Year <your dog's name>
orHappy Christmas
) - Click the "Run and Debug" button again
- You should see the new greeting in the terminal. You just wrote your first piece of code!
- To save your work, enter the following sequence of commands in the terminal:
git add -A
git commit -m "Modified CodespacesTest.java"
git push origin master
At the beginning of each class, after opening your Codepsace, you will open a terminal window (with Ctrl + `
or using menu and going to Terminal > New Terminal). Then you will enter the following command:
git pull upstream master
This command gets any new code from the instructors that you will need for the class that day.
At the end of every class, you will run the following sequence of commands:
git add -A
git commit -m "<description of your work for the day>"
git push origin master
This will save your changes by pushing them changes to your forked repository.