When done, submit at here.
Follow the link here to debug vagrant and heroku. Heroku now is under maintenance, you can try heroku part later today

1


2


3

Common Commands

ls
cd <dir>
git clone <url>
git pull
git status
git add <file>
git commit -m "message"
git push

Git Combos

Get Updates

git pull

Commit Changes (locally)

git status
git add <file(s)>
git status
git commit -m "message"
Run git status to remind yourself which changes you're actually committing.

Save Changes to Github

git pull
git status
git push
Run git pull to make sure you're up to date. Run git status to double-check that you've committed all of the changes you want to save.

Hadouken!

↓↘→ X


4


5


6


7


8

Video

Terminal

$ cd ~/Documents/IntroHCI
$ ls
LICENSE             Vagrantfile         introHCI-extras.sh
README.md           cookbooks           lab1

Debug

I typed in $ cd and ...

Don't type the $. We are using the $ surrogate prompt to indicate lines which are commands to input. Then, we display lines of expected/example output without any $ prompt.


9


10

Video


11


12


13

Video

Terminal

$ vagrant up

Debug

I'm stuck at

Waiting for machine to boot.

If you've been waiting over a minute, something likely went wrong. Let's abort the vagrant up command and then try running it again. To abort in Unix, we push CTRL+C in our terminal.

I got the message

VM already provisioned.  Run `vagrant provision` or use `--provision` to force it

Don't run vagrant provision! If you do this, the virtual machine will get setup from scratch. (remember how long that took?)


14

Video

Terminal

$ vagrant ssh
vagrant@127.0.0.1's password:
...
vagrant@precise32:~$

Debug

What's the password?

vagrant


15

Video

Terminal

$ ls
cookbooks  intorHCI-extras.sh  lab1  lab2  LICENSE  README.md  Vagrantfile
$ cd lab2
$ ls
LICENSE  node_modules  package.json  Procfile  README.md  server.js  static

16


17

Video

Terminal

$ heroku login
Enter your Heroku credentials
Email:
Password:
Could not find an existing public key.
Would you like to generate one? [Yn]  Y
Generating new SSH public key.
Uploading SSH public key /home/vagrant/.ssh/id_rsa.pub... done
Authentication successful.

$ heroku create
Creating ...
...
Git remote heroku added

Debug

I didn't see Git remote heroku added after running heroku create

Did you run the create command inside of the lab2 directory?


18

Video

Terminal

$ heroku apps:rename msb-lab2
Renaming ...
...
Git remote heroku updated

Debug

I got the error No app specified.

Did you run heroku create inside the lab2 directory?


19

Video

Terminal

$ git push heroku master
The authenticity of host 'heroku.com (xxx.xxx.xxx.xxx)' can't be established.
RSA key fingerprint is xx:xx:xx:xx...xx:xx.
Are you sure you want to continue connecting (yes/no)? yes
Warning: Permanently added 'heroku.com (xxx.xxx.xxx.xxx)' (RSA) to the list of known hosts.
...

Debug

Wait, what did I agree to?

shhhhhhh, the NSA is listening! a detailed explanation


20


21


22


23


24


25


26


27


28

Video

Code

...
<link href="css/introHCI.css" rel="stylesheet">
...

29


30

Video

Code

...
<div class="project" id="project1">
...
<div class="project" id="project2">
...

31

Video

Code

...

.project {
    margin-left: 20px;
}

32


33


34


35

Video


36


37


38


39


40


41

Code

p {
    font-variant: small-caps;
}

42

Code

.project p {
    font-variant: small-caps;
}

43

Code

#project1 {
    font-variant: small-caps;
}

44

Code

margin-left: 1px;
background-color: #ab1234;
padding: 1px;
width: 1px;

45


46

Code

.project {
    margin-left: 20px;
    background-color: #deebf7;
    padding: 20px;
    width: 525px;
}

47

Video


48


49


50


51

Code

...
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-theme.min.css" rel="stylesheet">
<link href="css/introHCI.css" rel="stylesheet">
...
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://code.jquery.com/jquery.js"></script>
<!-- Include all compiled plugins (blelow), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
...

52

Video

Code

...
<a href="project.html" class="thumbnail">
    <img src="..." alt="..." class="img">
    <p>...</p>
</a>
...

53

Video

Code

<body>
    <div class="container">
        ...

54


55

Code

<div class="jumbotron">
    <h1>Michael Bernstein</h1>
    <p>human-computer interaction &middot; social computing &middot; crowdsourcing</p>
</div>

56


57

Terminal

$ git add static/index.html
$ git add static/css/introHCI.css
$ git commit -m"added CSS and Bootstrap"

$ git push origin master

$ git push heroku master

58

Video

Terminal

$ exit
logout
Connection to 127.0.0.1 closed.

$ vagrant suspend
[default] Saving VM state and suspending execution...

$ vagrant up
Bringing machine 'default' up with 'virtualbox' provider...
[default] Resuming suspended VM...
[default] Booting VM...
[default] Waiting for machine to boot.  This may take a few minutes...

59


When done, submit at http://hci.st/lab-submit.