GITing Started

Knowing how to use a source control system will be an invaluable tool for you going forward, perhaps personally, but especially in a team setting. At its heart, version control is just a way to manage the many changes that occur to your files over time, but that simple idea changes everything! It allows you to revisit previous versions of your code, work with different versions at the same time, and work in teams and track who made which changes. At its best, version control is like a journal that you use to track major, and minor, events in your project. At its most practical, it is like a backup system that prevents you from losing significant work if something happens to your machine. At its worst, it is simply a submit system where you only track your work when told to.

Version control systems have been around for over forty years and GIT is currently the cool tool to use (Linus Torvalds, of Linux fame, created it out of necessity and frustration to help him manage the Linux source code). Using source control well is not difficult, but it does take some practice and a little bit of command-line savvy.

Install GIT

• Download and install GIT
  on Mac or Linux, you can use the built in Terminal program to interact with GIT
  on Windows, it comes with a program called Git Bash that you can use to enter the commands below
• Within Terminal/Bash, configure GIT for your computer (note, these commands need to be done once for each computer you program on)
  

      git config --global user.name "YOUR NAME"
      git config --global user.email "preferred @duke.edu email address"

Login to GitHub and Join our Classroom

1. Within a Browser, create an account on GitHub (if you have not already done so)
   Complete GitHub's online profile, using whatever screen name you want.
   Your Duke email address must be one of the completed email addresses (either as the Primary or Backup address).
2. Go to Piazza to get the link to join this lab assignment.
   When you use this link for the first time, it will prompt you to join the Classroom by choosing your Name and NetID from the given class roster (and thereby letting us know the GitHub screen name you chose).
3. When you Accept this assignment, a personal version of the lab's starter repository will be made for you.
4. On the new repository page that appears, copy the URL that appears when you click on the green Clone or Download button:

       https://github.com/duke-compsci290-spring2018/lab_style-GIT_SCREEN_NAME.git

Cloning a Copy of the Repository onto Your Local Machine

1. Within Terminal, change to the folder in which you intend put your work for this course:
   

       cd PATH_TO_WORKSPACE_FOLDER

2. Download a local version of the project that is linked to your online repository
   

       git clone https://github.com/duke-compsci290-spring2018/lab_style-GIT_SCREEN_NAME.git

3. That command will create a folder named lab_style-GIT_SCREEN_NAME within your workspace folder that contains configuration information for GIT (e.g., .git)
   

       ls -a lab_style-GIT_SCREEN_NAME
     

Push Changes to your Project back up to GitHub

1. Within your preferred text editor, open the file README.md by double clicking on it
   Add your name and save the file
   
2. Within Terminal, add your changed file to those staged for your next commit
   

       git add README.md

3. Within Terminal, when you have added all the files to be grouped together into a single commit to the repository, note that with a message describing the changes contained in this commit
   

       git commit -m "Included my name in the README"

4. Within Terminal, push all your commits to the remote repository, e.g., GitHub, so that others (UTAs, team mates, those following your web page, etc.) can see your changes
   

       git push origin master

5. Within a browser, refresh the page to see your changed README file

Publish your Project to the Web

To allow anyone to view your web page on the World Wide Web, WWW, you must save it in a public location. In this course, this is going to be done through GitHub Pages for the static web pages we develop in the first half of the semester.

1. Within a browser, go to the Settings tab on your repository page
2. Scroll down to the GitHub Pages section (the last one before the "Danger Zone") and select master branch instead of None from the drop down list.
3. When you click Save, a URL should appear in blue above the Save button to the publicly hosted version of your repository's web site (it may take a few minutes before your site is available):

       https://duke-compsci290-spring2018.github.io/lab_style-GIT_SCREEN_NAME/

Make Style Changes

Complete the following tasks to practice the basic GIT workflow commands (add, commit, and push) and CSS. After you have completed each task, make a GIT commit with an appropriate comment (i.e., there should be at least four commits in your project history). After every two commits, push your changes up to GitHub so your online repository reflects the work you have done in lab today.

• Add different fonts to the text in the page
• Make the H3 headings have a background color and different text color
• Style the text of the class interesting so that it is different in some way
• Make the list with the id navbar list look more interesting that just a bulleted list
• Whatever else you want to experiment with

As a reminder, you will add your CSS styles by editing a separate file named style.css that is linked from the HTML file.

Resources

• GIT Commands Visualization
• GIT Commands Flowchart
• GIT Commands Summary Page
• Understanding Version Control Systems

Submission

What is in your lab_style-GIT_SCREEN_NAME repository on GitHub at the end of lab is what will be considered your submission. This is how all submissions will be done for this course — only what is in your online repository will be considered part of your work.