Day 2

Concepts

  • Git Branches
  • Bootstrap
  • Linking to Framework Best Practices
  • Pull Requests (PR)
  • Offset Columns
  • Practice
  • Take Home

Git Branch

  • Branches in git allow you to separate your work-in-progress from the main project
    • If you are working on a live website and making updates, you don't want your partial code to be displayed live before it's ready
    • Your senior developer can review your code separate from other users' code and assess what needs to be changed or what is working well
    • It reduces the headache of merge conflicts (we'll get to that part!)
  • Run git branch in your terminal (Git Bash or Atom terminal)
  • To create a new branch, run git checkout -b name-of-your-branch
  • Now you are on your new branch. All the changes you make will only effect this branch. The master branch will remain unchanged
  • Once you are done with your branch (we will see this condition later) you can delete your branch by running git branch -d name-of-your-branch
  • If you delete a branch locally, you should also delete it on Github.com. This is referred to as 'branch pruning' and is recommended as a regular practice in front end development

Bootstrap

  • Visit Bootstrap here.
  • Intro
  • Bootstrap Sites
  • Download Bootstrap
  • Intro to Grid System

Bootstrap Sites

Download Bootstrap

  • Click here to download Bootstrap.
  • Copy Files
  • Link CSS and JS files (use bootstrap template)

Grid System

Bootstrap makes it easier to layout web pages by using a grid system made up of rows and columns. Rows are horizontal and columns are vertical. You can have as many row as you'd like, however you can only have 12 columns and they are always nested inside rows. Click here for examples of the grid system.

Linking to Frameworks Best Practices

In order to use a framework, you have to reference it. The two ways we will talk about are using a CDN and native linking.

Read more here.

Pull Requests

When you push up your changes to Github.com while you're on a branch, you create a separate branch on Github.com. In order to get your changes from your feature branch into the master branch, you need to merge those two branches together. To do this, create a pull request.

Practice

  • Create a new repo on Github
  • Clone that repo into your projects folder
  • Create a file structure (index.html, style.css, etc.)
  • Add Bootstrap to your project

Take Home

  • Using the SAME repo from today...
  • Create a new branch
  • On your new branch, recreate this layout
  • Create a pull request
  • Slack me the link to your pull request
  • When you get the thumbs up, merge and delete your branch

Quote of the Day

  • “It's hard enough to find an error in your code when you're looking for it; it's even harder when you've assumed your code is error-free. ”
  • -Steve McConnell