Question with proper formatting here: http://imgur.com/a/vHWu0 Background Agains
ID: 3833073 • Letter: Q
Question
Question with proper formatting here: http://imgur.com/a/vHWu0
Background
Against all bureaucratic stereotypes, the Social Security Administration, provides a neat web site showing the distribution of names chosen for kids over the last 100 years in the US (https://www.ssa.gov/OACT/babynames/).
Every 10 years, the data gives the 1000 most popular boy and girl names for kids born in the US. The data can be boiled down to a single text file as shown below. On each line we have the name, followed by the rank of that name in 1900, 1910, 1920, ... 2000 (11 numbers). A rank of 1 was the most popular name that year, while a rank of 997 was not very popular. A 0 means the name did not appear in the top 1000 that year at all. The elements on each line are separated from each other by a single space. The lines are in alphabetical order, although we will not depend on that.
...
Sam 58 69 99 131 168 236 278 380 467 408 466
Samantha 0 0 0 0 0 0 272 107 26 5 7
Samara 0 0 0 0 0 0 0 0 0 0 886
Samir 0 0 0 0 0 0 0 0 920 0 798
Sammie 537 545 351 325 333 396 565 772 930 0 0
Sammy 0 887 544 299 202 262 321 395 575 639 755
Samson 0 0 0 0 0 0 0 0 0 0 915
Samuel 31 41 46 60 61 71 83 61 52 35 28
Sandi 0 0 0 0 704 864 621 695 0 0 0
Sandra 0 942 606 50 6 12 11 39 94 168 257
...
We see that "Sam" was #58 in 1900 and is slowly moving down. "Samantha" popped on the scene in 1960 and is moving up strong to #7. "Samir" barely appears in 1980, but by 2000 is up to #798. The database is for children born in the US, so ethnic trends show up when immigrants have kids.
Ultimately, we want to organize that data to graph it as shown below with the names Sam and Samantha...
One of the neat things about this project is that it uses real data (and lots of it!). There are over 4,500 names in the database. The data just records literally what people put on the forms, so there are things like "A" and "Baby" recorded as names (the data is more cleaned up in the later years). We will not worry about that, and we will not combine names that are similar in some sense – "Cathy" and "Catherine" and "Kathryn" and "Katie" and "Kati" will all count as different names. Looking at the data, long names ("Michael") are becoming more popular compared to their short versions ("Mike").
Requirements
For this assignment you will build a database-backed Node.js/Express/Jade/Mongoose web app to allow people to explore the baby names dataset.
You must use the datafile given (see Datafile section below) for populating your MongoDB database. Include in the root of your project folder a file named populate-database.txt that includes the full mongoimport command you used to load the data into your database.
Your code must convert the 0's to 1001 (see note in Datafile section below), not necessarily replacing them in the database, you may do this in your client-side Javascript.
The graphing will use Javascript and whatever Javascript graphing library you wish.
The graphing must be done as shown, namely, with the most popular (rank 1) at the top.
When the user enters a name your Javascript code must make an AJAX request (I strongly suggest you use jQuery) back to your Node.js/Express/Jade/Mongoose web app to get the data for that particular name.
The Node.js/Express/Jade/Mongoose web app will then look the name up in a MongoDB database and return the data or if not found an appropriate message.
Once the Javascript web page gets the response back it will either add the data to the existing graph (if the name was found) or let the user know that the name was not found.
You will have at least 2 routes in your web app -- the root, that is, /, will contain the web app itself. The other route will allow for names to be looked up in the database.
You must sanitize both the input from Javascript web page, as well as, the data coming out of the database.
Your HTML must validate as HTML5.
Any styling must be done as an external stylesheet that must validate as CSS3.
You must use Bootstrap (from CDN) to format your page.
Datafile
Here is a tab-separated text file containing the data. NOTE: A 0 occurring as a rank means that the name did not appear in the top 1000 for that decade -- so, your code will need to convert those to a 1001 to have the graph work correctly and accurately.
names-data.csvPreview the document
What to submit
Zip the folder containing your Node.js/Express/Jade/Mongoose web app into a zip file named NameSurferApp.zip and submit as an attachment below.