Giter Club home page Giter Club logo

jukebox's Introduction

Background & Objectives

We'd like to build a small Sinatra web application to display all the information from that Jukebox Database. There is a rake for this exercise that will test your sinatra app. Just launch it with the usual rake command.

Setup

Install the gems specified in your Gemfile with the following command:

bundle install

This will create an auto-generated Gemfile.lock file which specifies versions for each gem. It locks them actually.

Launch the sinatra app.

ruby lib/app.rb

Look! You can go to http://localhost:4567. You are now running a small webserver and are accessing it with your browser. No more command line!

Some words about Sinatra

Sinatra is what we call a web "microframework". It's basically a micro Rails, also following the MVC pattern. The app.rb file acts as the controller. The router layer is handled by Sinatra. We already created a controller method to handle the root of the web app. Sinatra maps the URL in the browser to the right method in app.rb. Take a look at the routing doc for more info.

Don't hesitate to read more about Sinatra in our homemade tutorial (skip the Setup part as you have already a boilerplate in the lib folder).

Specs

Home page

You should code a homepage / which displays a list of all the artists from the Jukebox. Clicking on an artist name, you should go to the artist page.

Artist page

You should code an /artists/:id page displaying all albums from this artist. Clicking on an album name should redirect you to the album page.

Album page

You should code an /albums/:id page displaying the tracks from this album. Clicking on a track name should redirect you to the track page.

Track page

You should code a /tracks/:id page displaying all the track info, and if you have time you can have a look at a video embed API service like youtube to also throw in a video on that page.

When you've finished, use ngrok to share your work on Slack ๐Ÿ‘Œ

jukebox's People

Contributors

favio102 avatar

Watchers

 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.