Skip to content

Movie review app built in React using fetch API, Router, and Cypress testing.

Notifications You must be signed in to change notification settings

janitastic/rancid-tomatillos

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Rancid Tomatillos

Contents

Overview

This is a two week Turing Module 3 project built with React.js. This web app allows users to view movie reviews, plots, and release details.

It was designed and developed by Daniel O'Connell and Jani Palomino.

Demo

Features

Custom URLs for each Movie

Movie URLs

Fully Mobile Responsive & Toggle Between List or Grid View

Mobile Responsive

100% Lighthouse Accessibility Score

List-Lighthouse-Score Modal-Lighthouse-Score

Fully Tabable for Accessibility

List-Tabbing Modal-Tabbing

Goals

  • Gain competency with React fundamentals.
  • Test React components & asynchronous JS.
  • Create a multi-page UX using Router.
  • Create a fully accessible and mobile responsive application.

Technologies Used

  • React
  • Router
  • Cypress
  • JavaScript
  • HTML
  • CSS/SASS
  • Git
  • Figma
  • Webpack
  • Fetch API

Install & Setup

  1. Clone this repo git clone git@github.com:Daniel-OC/rancid-tomatillos.git
  2. Install the necessary package dependencies npm install
  3. Run the command npm start
  4. Start the server at http://localhost:3000/

Future Enhancements

  • Allow users to:
    • submit their own movie ratings.
    • filter movies by genre, name, or ratings.
    • search for movies.
    • login and select their favorites.
  • Improve accessibility for keyboard users.
  • Add a nav bar with more pages of content related to movies.

Project Spec & Rubric

Turing Schoold of Software & Design - Rancid Tomatillos Project Spec

Contributors

Contact Us on LinkedIn

Languages

  • JavaScript 64.7%
  • SCSS 29.6%
  • HTML 5.7%