🗓️ Today’s topics

• Learn about HTML tags and elements
• Create a page with HTML

Intro to GitHub Classroom

We are using a tool called GitHub classroom during this course. For each assignment, GitHub classroom will generate a repository (repo) on GitHub for each person to work in.

Each day we will share an assignment invitation here on this page. Clicking on the link will take you to a page where you will see a message that looks something like this:

You’ll see your github username as part of the repo name instead of amygori. When you accept the assignment, GitHub will create your homework repo and, when it is done, give you a link to it (from now on, this is the link you will use to see your project on GitHub, NOT the assignment invitation link). Go to that newly created repo and click on the green button to “Clone or download” your repo. This will copy the repo’s url to your clipboard. If you aren’t sure how to do this, there is a link to a video demo below.

In your terminal, navigate to the folder where you intend to keep your projects. When you are in the directory you want to be in (check with pwd!), type git clone url-for-your-repo, but in place of url-for-your-repo, paste in the url you copied from GitHub. You’ll see output indicating the repo is being cloned. When it’s done, make sure you cd into it and type git status to see that you are in a git repo. Open this repo in VS Code (an easy way to do this is to type code . when you are in the assignment repo) and do your work here. Add and commit in the terminal as you work.

Using VS Code

VS Code (or Visual Studio Code) is a code editor made by Microsoft. It is free and open source, and it’s used by many professional developers these days.

See Getting Started with VS Code for an overview and a video intro to using this tool. NOTE: The video begins with installation instructions, which you can skip. You installed this with homebrew in the computer setup instructions (by running brew install visual-studio-code), so you should be able to see an icon for Visual Studio Code in your Applications folder. If you have not installed it yet, make sure you do. We will use it every day from now on.

🎯 Project: Build a small business website

You submit this assignment by pushing your code to your assignment repo on GitHub. Please get as far as you can before class on Wednesday.

• Link to the assignment invitation
• Quick video showing how to clone your assignment repo

🔖 Resources

HTML

• MDN Getting Started with HTML
• MDN HTML Resources Page
• MDN HTML Element Reference

Tools & Technical Help

• Asking technical questions: Your Brain’s API This talk from PyCon 2015 is super useful and relevant. Worth 30 minutes of your time.
• Getting Started with VS Code
• How to use VS Code LiveShare
• VS Code LiveShare Extension

🦉 Code & Notes

• HTML notes
• Quick video showing how to clone your assignment repo
• HTML example
• Thinkific HTML section for reference/reinforcement

Today’s topics

• Orientation
• Developer tools
  • Setting up your computer
  • Using the command line
  • Git & GitHub

✅ TODO today

1. Fill out your first self-assessment.
2. Read the student guidelines and how we work remotely docs in their entirety.
3. Make sure your computer is all set up and ready to go.
4. Read the Really friendly command-line intro.
5. Read the Really friendly Git intro.
6. Complete the Git-It tutorial (below) and submit this form when you are done.

💻 Today’s Project: Git It

Complete Git-It, a tutorial program that will walk you through the basics of Git and GitHub.

To install it, run: brew install git-it

This should put the Git-it program in your /Applications folder. You can start it by pressing command-spacebar on your Mac and typing “git-it” and hitting return when you see the icon.

Git-it will tell you to install Github Desktop. You do not have to install this, although you can if you want. We won’t be using it in class.

The first time you run Git-it, you may get a notice that the application is from an unknown developer. If you do, right-click on the application and then choose “Open.” You will be presented with a dialog – choose to run the application.

Once the application is running, read the instructions and complete the tasks in Git-it. Completion of the assignment is the link to the pull request that you will make in the second-to-last Git-It task.

Your link should look similar to this, with a different number at the end: https://github.com/jlord/patchwork/pull/37062

Submit the link to your pull request url using this form.

🔖 Resources

First Day Orientation and Setup

• Student guidelines
• How we work remotely
• Tutorial on Using Slack
• Momentum Slack guidelines
• Setting up your computer

Command Line & Git References

• Really friendly command-line intro
• Really friendly Git intro
• Git Cheat Sheet PDF
• Git handbook from GitHub
• Git Command Explorer – this tool lets you look up commands by what you are trying to do

🦉 Code & Notes

• command line notes
• git notes