-
find slackhappy on github.com and find the
Mr_Potato_Headrepository:https://github.com/slackhappy/Mr_Potato_Head -
Fork the Repo
In Cloud 9:
- Create a new workspace by going to "Repositories" https://c9.io/account/repos. You should see
Mr_Potato_Head. Click "Clone to Edit". - Add your assigned body part to
potatohead.html. All you need to do is add asrc=tag for your body part in the html just like the"body"img. You can find the images you need right in theassetsdirectory. Use "Preview" or "Run" to make sure you did it correctly. Don't add anyone else's body part, just your own. - Once you are complete with the html, do the following steps:
In Cloud 9 terminal:
git status
You should see that potatohead.html is modified, like this:
modified: potatohead.html
Stage your changes in the index with git add ., then commit them. The string after -m in git commit is the commit message. Don't use "Commit message" as your message!
Instead, say what you did, for example "added body part [your assigned body part]"
git add .
git commit -m "Commit message" <<< but change the message!
Push your local commit up to github
git push origin master
look at your github: http://github.com/[myusername]/Mr_Potato_Head You should see the commit you just made! If you click "Commits" you can see the all of the work that has been put into Mr Potato Head, and you are at the top!
From your GitHub create a "New Pull Request" (the green button) to send your changes to the instructor. The instructor will merge all of the changes (everyone's body parts), and at the end hopefully we'll have a whole Mr. Potato Head.
-
Update the body part image or css for your body part (see
assets/potato.css). Stage, commit, push, and send another pull request! -
Update your repository with the instructors' changes:
[once]
git remote add upstream https://github.com/slackhappy/Mr_Potato_Head.git
[as needed]
git pull --rebase upstream master
- There is a click handler in
potatohead.html. Right now, it just logs to the browser console. Can you make it do something cool?
- In C9, click "Run" on
potatohead.htmland open up the link from the c9 console in a new tab - Press Option-Command-i to open the developer console.
- Click on a part of the potato head, you should see the part logged in the console.
- Can you do something more? Try animating a change to the height or width, for example.