NYU — Spring 2014 / Week 1

Getting up to speed

We’ll do normal first-day things, like talk about why we‘re all here and what we want. Class goals and policies, introductions, office hours, grading policies, project overview, configuring our laptops, signing up for tutorial and presenation duty.

Finally, we’ll get inspired by some code we see online and use it for a quick demonstration.

Housekeeping

Make sure your info is right on the wiki
Are you sure you’ve signed up for the Google group?

Introduction

How Amanda Got Started Intern Delightful boxes The dots are real

How Kevin Got Started Grad school Intern Peaked

2013: The Year in Interactive Storytelling

Learn to think like Amanda or Kevin

Discussion:

What do you all want to get out of the class?
What kinds of jobs are you going to be looking for?
What has been missing so far in your journalism education?

Getting your machines set up

Everyone should download a text editor to their laptop, if they have one.

For Mac users, we strongly recommend Sublime Text 2. It eventually costs $70, but you can use it for free for a while. (Kevin still uses the free version and he uses it every day.) Other alternatives include TextWrangler (free) or BBEdit (not free).

PC Users might consider Notepad++.
Next, we need to make sure Git is installed on all our computers. Here’s a helper. If you have a Mac, you probably have it installed already. We’ll do this together.

Signing up for Github

If you’ve never used Git or Github before, don’t worry, it’s not as scary as it may seem at first. It’s basically like Dropbox for programmers, with enough goofy names and concepts to make it all feel a little more complicated than it really is.

First, go to Github and create a username and password, etc. .
Once you are logged in, click on “Create a repository.” You should see this screen: Name your repo data-journalism-home. Make sure you check “Initialize this repository with a README”. Finally, click the button that says Create repository.
Switch the branch from master to gh-pages. (It has to be called gh-pages to take advantage of some built-in magic with Github Pages.)
Copy the clone url on the bottom-right.
We’ve made a siccessful Git repository (called a repo). Nice! Now all we need to do is copy it to our computers.
Go to your home directory, it’s the one in your sidebar with a house icon. Kevin’s is called “kevin” and the keyboard shortcut to go there is: ⌘⇧H
Inside this folder, create a new folder called data-journalism-spring-2014. This is where we’re going to store our repository (and, later on, where we’ll put other ones).
Open up the Terminal application on your Mac and navigate to the folder you just created. (We’ll do some practice, too.) For later, here are some decent resources, from Codeacademy and Stanford.
Once you’re “inside” your folder on the Terminal, type git clone and then the URL you pasted from earlier. (For Kevin, it’s git clone https://github.com/kpq/data-journalism-home.git), but yours will be slightly different.
Open up the folder in a text editor (like Sublime or whatever you prefer). Create a new file called index.html and write
```
<h1>Hello, world!</h1>
```
Save the file and view it in a web browser. How does it look?
Let’s use git and the Terminal to push it back to Github. Type this in the Terminal. (Hit enter after each line.)
```
git add .
git commit -m "added index page, this is a commit message"
git push origin master
```
If it worked, you should be able to go to your web page (github.com/yourUserName) and see the result. And, after a while, if you’re on the gh-pages branch, you shoudl have a public-facing web site on yourUserName.gitub.io/. Sweet!

If there’s time: using an online example.

Say you want to make an interactive map of the United States and you don’t know where to start, but you DO know what you want your map to look and behave pretty much like this one you’ve already seen.

What’s next?

Open the page in a separate window and view the page source.
Copy all the code and paste it into a new file in your text editor. Call it week-1-map.html and save it into your class folder.
Open the file in a browser.
Say your data is not people per square mile but something else per state – say, dollars raised for a political campaign. Where does this map get that data from?
If you can, find the data and save a local copy. Then edit the data for New York and see what happens.
Broadly speaking, how can you use this example going forward?

Homework

Your assignment is to:

Have your github page publishing correctly before the next class. For now, that means yourusername.github.io should be rendering your index.html page with your name and the phrase “Useful links for Kevin and Amanda.” (We’ll be adding more links later.)
Bring data from all 50 states (or enough to be interesting) to class. This data should be of the type that could be shown on a map.