Set up repository
For all participants in the Front-end Crash Course an empty Git repository has been created on GitHub.
We'll need to configure GitHub properly to clone the repository subsequently.
Generate a SSH key
When using Git, the main form of authentication is SSH. In order to be using this you'll need a SSH key. It's recommended to create a SSH key using the Ed5519 algorithm. Already have one? Great! If not, execute the following command in the Terminal:
ssh-keygen -t ed25519 -C "your_email@example.com"
When you're prompted to "Enter a file in which to save the key," press Enter. This accepts the default file location.
When you're prompted to "Enter passphrase" press Enter. Otherwise you'll need to enter this passphrase after every Git command you'll execute.
Now the SSH key has been created it has to be added to the OS's ssh-agent. First, we have to make sure it's up and running:
eval "$(ssh-agent -s)"
If it's running correctly it will output something like:
Agent pid 123456
Then we need to create a configuration file for the ssh-agent and specify the SSH key there. Create the configuration file:
touch ~/.ssh/config
Then open the file in TextEdit so you can add the configuration easily:
open ~/.ssh/config
Paste the following configuration and then save the changes:
Host *
AddKeysToAgent yes
UseKeychain yes
IdentityFile ~/.ssh/id_ed25519
Finally, the SSH key has to be linked manually once by executing:
ssh-add -K ~/.ssh/id_ed25519
Add the SSH key to your GitHub account
Now we'll add the SSH key to your GitHub account so GitHub will recognize your account when using the SSH key with all Git command. We're going to copy the SSH key to the clipboard by:
pbcopy < ~/.ssh/id_ed25519.pub
Then go to GitHub and make sure you're signed in. Click on your avatar and then on "Settings". In the menu on the left choose "SSH and GPG keys" to go to the view where you can manage your SSH keys.
In the top right, click "New SSH key". Enter a title like "John's MacBook Pro" so you can identify the key and then paste the key itself. Press "Add SSH key", enter your password for confirmation and you're all set.
Cloning the repository
For your own convenience, it's smart to have a dedicated workspace for development projects and to group all projects by organization. Create a directory called "Development" in your user's root by executing:
mkdir ~/Development
For each organization you'll be working for, create a directory, ideally identical to the organization's name on GitHub. In our case, this is humanoidsbv, so do the following to create this directory:
cd ~/Development
mkdir humanoidsbv
Now it's time to clone the repository. Change the active directory to the organization and then execute the clone command:
cd humanoidsbv
git clone git@github.com:humanoidsbv/team-awesome-[your-first-name].git
Configuring Git
Author
Before you can actually commit the initial code you need to add your name and email address to the global Git configuration on your computer. This information is added to your commits and will be used by GitHub to recognize you as the author.
Execute the following code in the terminal to set your name:
git config --global user.name "FIRST_NAME LAST_NAME"
Then execute the following code to set your email address:
git config --global user.email "MY_NAME@example.com"
It's recommended to use the primary email address that's associated with your account.
File casing
Let's set the default casing configuration so filenames that are changed in casing are noticed by Git.
First change it for our current repository:
git config core.ignorecase false
Then, set it as a default setting for all your Git projects. Notice that the setting we just set for our current repository takes precedence over this global setting:
git config --global core.ignorecase false
When this setting is applied after changing the case, you can delete or move the file remotely:
git rm --cached src/components/filename.js
Committing the initial code
Preparing your code
In the next step we'll prepare the code you wrote for the repository. Simply using the Finder app to copy all files won't do as projects like this always contain hidden files. Therefore we'll copy all files using the Terminal app:
cp -r ~/folder-you-used-so-far/* ~/Development/humanoidsbv/team-awesome-[your-first-name]/
Now your Git configuration is complete the initial code can be committed.
Committing through your terminal
First, pull all code from the branch we're merging to. When working in teams, code might have been changed since your last alterations. Since this is a new branch, we are also making sure we're going to always branch from the main branch:
git pull origin main
Next, we're going to checkout to a new branch, so we can review our code before we merge it to our main branch:
git checkout -b feature/main-navigation
Check whether all the files you want to send to it are there:
git status
Stage all your altered files. The dot at the end tells the terminal to stage all altered files within the project:
git add .
Commit all your staged files with a custom message. As a convention we keep our messages brief and start out using a present tense verb to enforce clear and efficient communication:
git commit -m 'Start implementing team member form valdiation'
Push your local branch to the remote branch:
git push
If your branch doesn't exist remotely, you'll get a message with the link you can use to create the branch including your staged code.