Git Product home page Git Product logo

blocbuster's Introduction

Blocbuster

Demo Video

Blocbuster is a TV show discovery web application built in Ruby on Rails. It uses the Movie Database API to populate content within the application.

Prerequisites

  • Ruby 2.5.3
  • Postgresql 9.6

Preparing a Development Environment

Install Postgres

brew install postgresql

Start Postgres

brew services start postgresql

Create database user

createuser -s foo

Log into Postgres instance

psql

Create development database

CREATE DATABASE blocbuster_development;

Log out of Postgres

\q

Setup

Clone the repo

git clone [email protected]:brandonbaker40/blocbuster.git

Enter the directory. cd into the directory:

cd blocbuster

Linux or Mac

Set up your environment:

bundle exec bin/setup
bundle install

Manual or Windows

Install dependencies:

bundle install

Migrate, Seed, and Initialize

Run migrations. See Active Record Migrations for more info.

rails db:migrate

Seed the app

rails db:seed

Initialize the app

rails s
bundle exec rails server

Functional Requirements:

#1 When first loaded, there should be a list of popular TV shows and a search bar.

Starting the rails server calls the index method in the tv_shows_controller.rb, as specified in routes.rb

routes.rb

    root 'tv_shows#index'

tv_shows_controller.rb

    def index
        ...
        response = HTTParty.get(endpoint)
        @tv_shows = response["results"]
    end

A list of 20 popular TV shows will populate the application.

#2 Upon searching for a TV show in the search bar, the user should see a list of shows whose title matches the search.

When the search bar is selected, a cursor will appear and the user will be able to enter input into the search bar. Upon pressing the return key, the value in the search bar becomes the search query. The user is directed to a search results page which contains a list of tv show titles that match the pattern of user input.

#3 After clicking on a TV show, the user should be taken to a page with more information about that particular TV show.

Each TV show title generated by the search results page (and also available on the index page) links to a profile page for that show. This profile page contains the name, poster, creators, networks the show is available on, show overview, and a button to search for the tv show on YouTube.

Technical Requirements

#1 Create a full-stack application with a backend that communicates with the movie API.

Front End: Ruby ERB, HTML, CSS, JavaScript, jQuery, Materialize CSS library Back End: Rails, HTTParty Ruby gem

Communication with the Movie DB API was made possible through the HTTParty gem. For example, to get search results for a particular query, I created a search_results method in my tv_shows_controller.rb file and used it to store the search_query, make a GET request to the API for search results, and render a template in which to fill those search results.

        def search_results
            search_query = REGEX (see file)
            ...
            HTTParty.get(search_endpoint)
            render template: "tv_shows/_search_results"
        end

#2 The front-end should be intuitive to use.

Users can search for tv shows and click on the results on their searches to display a profile page for that TV show. There is little more that this application does.

#3 Accompany your code with a full test suite.

I used the RSpec gem to create tests for my application. I tested the controllers, requests, and views. You can run tests locally as follows:

rake spec to run all Ruby tests

rake spec:controllers to run Ruby controller tests

rake spec:views to run Ruby view tests

rake spec:requests to run Ruby request tests

rspec ./spec/path/to/my_spec.rb to run all Ruby tests in the file my_spec.rb

#4 Deploy your site to a web host (e.g. on Amazon EC2, Heroku, Netlify, Google AppEngine, etc.).

Blocbuster is deployed on Heroku at: https://stormy-island-80155.herokuapp.com/

Reasoning behind technical choices:

Ruby on Rails: Since I had one week to do this project, I chose a framework that emphasizes speed of development more than anything else. Rails meets that criteria, and I'm very comfortable with Rails.

JavaScript, jQuery: I knew the search feature would need to use some form of JavaScript, so I used a combination of vanilla JS and jQuery to build the search feature.

Materialize CSS: I'm comfortable with this library and find it a suitable alternative to others like Bootstrap.

Any trade-offs?

I don't like to use third-party gems if I can help it. I've used Ruby's Net:HTTP module but found configuring the HTTParty gem for this project to be easier.

Anything you left out?

I met all the minimums. Autocomplete, which was not a required feature, is only implemented locally. Autocomplete will only scan for tv show titles that already appear on the page.

What you might do differently if you had more time to spend on the project?

I would have created a search_controller to handle search instead of including it in the tv_shows_controller. If I would have added movies also, I would have had to create a search controller anyway to handle search results for both tv shows and movies.

I would have spent time writing asynchronous JavaScript code for autocomplete instead of trying to create a half-baked autocomplete feature that only handles values that appear on the page.

And I would have completely removed ActiveRecord and Postgres. I shouldn't have included it in the first place. There is absolutely zero need for a database system or ORM in this application based on the way I built it, not that this application couldn't have used it. When I was sketching out how to build this application, I had a feeling I wouldn't need an ORM, but I included it anyway just in case. And now I have parts in the application which serve no purpose.

blocbuster's People

Contributors

brandonbaker40 avatar

Watchers

James Cloos avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.