11/23/14

Movie Log

Visit my Movie Log!

Below is a summary of what I learned in the making of this app, as well as a snapshot of its functionality. I'd suggest looking through the app before reading.

Nokogiri

To acquire a list of most popular movies in the last 30 years I used Nokogiri to parse movie titles from http://www.boxofficemojo.com/yearly/chart/?page=1&view=releasedate&view2=domestic&yr=2014&p=.htm (with page and year parameters changing). The resulting text file was used for the autocomplete function below.

Lessons Learned:
1. How to use Unix > operator to output results into a text file
2. Using querySelectorAll to find a CSS selector for Nokogiri's css method
3. Using HTTParty to make HTTP requests


Autocomplete


When a user begins typing out a movie's title into the input field (shown above), jQuery makes a request to my application's API endpoint, which returns the top five titles that most closely match the input value, determined via a regular expression. jQuery's autocomplete widget dropdown menu appears with the results.

The submitted value is then sent to Rotten Tomatoes' APIs to retrieve movie attributes.

The dropdown is needed to A) improve user experience and B) send more expressive values to Rotten Tomatoes' API ("Harry Potter and the Sorcerer's Stone" VS. "Harry Potter").


Lessons learned:
1. How to make a relative path in Ruby on Rails
2. The value of responding with a JSON object
3. Don't use the passive voice or else you'll sound politician-y


Knockout

Once the information from Rotten Tomatoes is received, it is parsed and automatically assigned to the movie's proper attributes.



The user can then fill in the empty fields as well as change those that have been filled automatically. To achieve this I used Knockout, a javascript library that allowed any changes made to the values to be automatically detected and saved.


Lessons Learned:
1. How to use Knockout bindings
2. How to use Knockout computed values to send jQuery POST requests


Lightbox

I made a post earlier about a lightbox that I had made in preparation for this project. I wish I had known about Knockout back then, because it would have saved me making "visible" and "invisible" classes to hide and show the lightbox. The Knockout library has an "if" binding that would make displaying/hiding the lightbox a simpler process.


Lessons Learned:
1. Knockout "Foreach"
2. Improved understanding of Javascript classes and methods
3. Overflow: scroll;


















Visit the movie log HERE
Visit my github HERE


No comments:

Post a Comment