HW 1 | Front end Development

Part 1: Background

• Finish Learn the Command line the Hard Way. If you take the time to go through the examples, you'll have a solid foundation as a hacker. Total time: 30-60 minutes.

• It's time to learn more about git, and install it! Go to http://git-scm.com/download and download git for your operating system. While you're waiting, watch the following videos:

  • Version control
  • What is git?
  • If you prefer reading to watching, read sections 1.1-1.3 of the Git book instead.
  • Make sure to actually install it after you download!
    Total time: 15 minutes

• Now that that you know about git and have it installed, you can make your first repository (called a "repo") on Github. Follow the instructions here up to but not including "Create a README". Name your repo "HackYale Homework" and make it public (private ones cost money).

• The way you submit your homework will be different from now on: instead of zipping up your file submitting it to Lore, you'll just upload your code to this repo. To make grading easy for the teachers, we want students to follow these instructions very carefully:

  • You should have a hackyale folder you created the first class. Open up your shell and cd to it.
  • In the hackyale folder, you should have at least two folders, called week_0 and week_1 (verify this with ls). From now on, week_X will be for classwork, and hwX will be for homework.
  • Make a directory called hw1 (mkdir hw1). DON'T cd into it.
  • Type git init into the command prompt (Initialize a git repository)
  • git add . (Add .—that's shorthand for the current directory—to the repo)
  • git remote add origin https://github.com/<your username>/HackYale-Homework.git (tell git about your remote on Github; more about this next class)
  • git commit -m "homework 1" (Make your first commit)
  • git push -u origin master (Send your code to Github!)
    Total time: 5 minutes

Total time for Part 1: 45-90 minutes

Part 2: Implementation

• You now know enough HTML and CSS to design most web pages on the internet. To prove that to yourself, you'll build a webpage wireframe, according to some specifications, which can be found here. We hope it looks familiar—lots of web sites follow this very layout (maybe inspecting those pages will give you a hint as to how to do the assignment...).
• You already made a hw1 folder in Part 1; put all your code there. Things to remember:
  • Your home page should be called index.html
  • All filenames should be lowercase (about.html not About.html)
  • Put all your images in a folder called images; link to them in your html file with <img src="./images/filename.jpg" >
• Lastly, in your hackyale folder (the parent of hw1) create a file called README (not README.txt or README.rtf). Write your name in it so we know whose repository it is.
• When you're ready to submit, make sure you're in the hackyale directory, run git add ., git commit -m "a message about what you changed (for example, 'added css')", then git push to send your code! After all is said and done, make sure it looks like https://github.com/rafi-khan/HackYale-Homework
• In Lore, don't submit the actual files, just a link to your new Github repo. Now you're officially a part of the open source community!

Total time: 1-3 hours, depending on your thirst to claim the next HY Oscar

Help!!

If you need help, first consult your best friend, Google (or Bing, or Yahoo! search...)
Then check out the [class page](https://github.com/hackyale/hackyale.github.io/wiki/Front-end-Development-(Fall-2013\)) or the lore.com site for information.
If you're still stuck, ask [email protected] or [email protected] for help.