Classwork 1

Building a Personal Website using Git, GitHub, and RStudio with Quarto

Author

Byeong-Hak Choe

Published

January 25, 2023

Modified

February 9, 2024

Getting a GitHub account

Step 1. Create the GitHub account with your Geneseo email.

  1. Go to GitHub.
  2. Click “Sign up for GitHub”.
  • Choose your GitHub username carefully:
    • https://USERNAME.github.io will be the address for your website.
    • Byeong-Hak’s GitHub username is bcdanl, so that Byeong-Hak owns the web address https://bcdanl.github.io.
  • It is recommended to have a username with all lower cases.



Installing git if you do not have one.

Step 2.

  1. Check whether git is installed in your laptop.
  • From the Console Pane in RStudio, click Terminal tab.

  • From the Terminal, run the following command to check if your laptop has git installed.
git --version
  • If your computer has git installed, you will see the message below and you do not need to install git:
git version 2.xx
  • If your computer does not have git installed, you will see the message below and you need to install git:
'git' is not recognized as an internal or external command


  1. Install git if you do not have one. Move to the next step if you have git installed in your laptop.

Mac

  • Go to http://git-scm.com/downloads, and download the file.
  • Click “macOS”, scroll down the webpage, and then click “installer” from the Binary installer section.
  • Run the downloaded file.

Windows

  • Keep clicking “Next” to complete the installation of git.

  • After the git installation is done, close RStudio and re-open it.

How to open git installation file on Mac?

  1. Run the downloaded file.
  2. Click Okay
  3. Go to “Setting” > “Privacy and Security”
  4. Go to “General” or scroll down
  5. Click “Open Anyway”



Setting up GitHub Credential on your local Git.

Step 3. In Terminal, run the following commands one by one:

git config --global user.email "YOUR_EMAIL_ADDRESS"
git config --global user.name "YOUR_USERNAME"

For example, the email address for my GitHub account is bchoe@geneseo.edu, and my GitHub username is bcdanl, so that I ran below:

git config --global user.email "bchoe@geneseo.edu"
git config --global user.name "bcdanl"


Step 4. Obtain a personal access token (PAT) from GitHub.

  • In RStudio Console, run the followings line by line:
install.packages("usethis")
usethis::create_github_token()
  • Then, click “Generate token” in the pop-upped web browser.

  • We can think of GitHub’s personal access token as a password that expires. You can decide how long it remains valid. My recommendation is to set its expiration for May 31, 2024, or later.

  • Then, copy the generated PAT, and paste it to your clipboard or R script.


Step 5. Set the GitHub credential using the PAT.

  • In RStudio Console, run the followings line by line:
install.packages("gitcreds")
gitcreds::gitcreds_set()
  • You will be asked to provide your PAT.
  • Paste your PAT to the RStudio Console, and then hit Enter.
Note
  • It does not harm to create multiple PAT for one GitHub account.
  • After the PAT expires, you should repeat the following if you want to update your GitHub website:
  1. Create a new PAT:
usethis::create_github_token()
  1. Replace the current PAT with the new PAT:
gitcreds::gitcreds_set()
  • Select the option 2: Replace these credentials by typing 2 and hitting Enter on R Console.



Establishing the Connection between GitHub repo and your local Git

Step 6. Login to your GitHib and make the repository.

  1. From https://github.com, click the plus [+] icon in the upper right corner and select “New repository”.

  2. Name this repo USERNAME.github.io, which will be the domain for your website.

  • e.g., If your GitHub username is abc9, the name of your repo should be abc9.github.io, not abc_9.github.io.
  1. Then, copy the web address of your GitHub repo, https://github.com/USERNAME/USERNAME.github.io
  • For example, the web address for Byeong-Hak’s GitHub repo is https://github.com/bcdanl/bcdanl.github.io.


Step 7. Create a RStudio project with Version Control

  1. Click “Project (None)” at the top-right corner in RStudio.

  2. Click “New Project” > “Version Control” > “Git”

  3. Paste the web address of your GitHub repo to the Repository URL menu.

  4. Click “Browse” to select the parent directory for your local project directory (I recommend “Documents” folder.)

  5. Click “Create”

Note

If Step 7 does not work on your laptop, try below Steps 7-1 and 7-2 instead. If Step 7 DOES work well, skip Steps 7-1 and 7-2.

Step 7-1. Use git clone to establish the connection between GitHub repo and your local laptop:

  1. Change directory to “Documents” in Terminal using cd command.
cd <pathname of "Documents" directory>
  • Here, you need to know the pathname of “Documents” directory.

  • For example, LAPTOP_USERNAME below is not your GitHub username but one for your local laptop.

Mac

cd /Users/LAPTOP_USERNAME/Documents

Windows

cd C:/Users/LAPTOP_USERNAME/Documents
  1. Use git clone to creates a local copy of the GitHub Repository.
git clone <repository-url>
  • For example,
git clone https://github.com/USERNAME/USERNAME.github.io


Step 7-2. Create a RStudio project from Existing Directory

  1. Click “Project (None)” at the top-right corner in RStudio.

  2. Click “New Project” > “Existing Directory”

  3. Click “Browse” to select the local copy of the GitHub Repository

  4. Click “Create Project”



Downloading Website Template Files

Step 8. Download the files of website template:

  1. Go to the following webpage: https://github.com/bcdanl/danl-website-template

  2. From the webpage above, click the green icon < > Code, and then click “Download Zip”

  3. Extract the Zip file you have downloaded

  4. If there are the files, .gitignore, .DS_Store, or *.Rproj, in the folder, delete all of them.

  5. Move all the files that were compressed in the Zip file to your local project directory, USERNAME.github.io.

  • Select all the files in the danl-website-template folder (Tip: Ctrl + A (Windows) / command + A (Mac) selects all files in a directory).
  • Then, Ctrl + C (Windows) / command + C (Mac) to copy them.
  • Then, go to your local project directory USERNAME.github.io.
  • Then, Ctrl + V (Windows) / command + V (Mac) to paste them to your local project directory USERNAME.github.io.
  1. Remove the danl-website-template directory from your local project directory, if you have one.
  • All the website files should be located at the same level with the R Project file (USERNAME.github.io.Rproj), shown below.



Pushing the Website Files to the GitHub repository

Step 8. Push the files to your GitHub repository

  • On Terminal within RStudio, execute the following 3-step git commands, which will stage, commit, and push all the files in the local working directory to your GitHub repository:
  1. git add . adds changes in your local working directory (e.g., edited files, new files, deleted files) to the staging area, which is a temporary area where you can prepare your next commit
git add .
  1. git commit -m "..." records the changes in the staging area as a new snapshot in the local working directory, along with a message describing the changes.
git commit -m "any message to describe the changes"
  1. git push -u origin main uploads the local changes to the online repository in GitHub.
git push -u origin main
Note

If git push -u origin main gives error, try the following:

git push -u origin master
  • The name of the default branch in a GitHub repo is usually main, but sometimes GitHub gives master default branch instead.


Step 9. Check whether the files are well uploaded.

  • Go to the webpages of your GitHub repository and your website:
  • Add a URL for your website (https://YOUR_GITHUB_USERNAME.github.io/) in About section in your GihtHub repository webpage by clicking the setting. Below describes how to do it:



Discussion

Welcome to our Classwork 1 Discussion Board! 👋

This space is designed for you to engage with your classmates about the material covered in Classwork 1.

Whether you are looking to delve deeper into the content, share insights, or have questions about the content, this is the perfect place for you.

If you have any specific questions for Byeong-Hak (@bcdanl) regarding the Classwork 1 materials or need clarification on any points, don’t hesitate to ask here.

Let’s collaborate and learn from each other!

Back to top