Rancid Tomatillos

Table of Contents

• Introduction
• Technologies
• Contributors
• Illustrations
• Deployed Page
• Wins
• Challenges & Improvements
• Set Up
• Sources
• Project Spec

Introduction

Welcome to Rancid Tomatillos, a tasteful twist on the well-known movie rating site Rotten Tomatoes. Cooked up during our first week of Mod 3 at Turing School, this dynamic duo implemented full functionality and a ✨sprinkle✨ of extra features in just two weeks.

Taking our first steps into the world of React framework, Router, and Cypress testing, we got great exposure into learning the ins and outs of React components and asynchronous JavaScript.

As you explore Rancid Tomatillos, you'll find clickable movie posters that unveil a wealth of information about the selected movie. Go ahead and search for movies by title, and you'll discover details such as overviews, ratings, budgets, revenues, genres, and even trailers that play right on the page. When you're ready to return to the main page, simply navigate back to the home page for more 'definitely-not-rotten' movie adventures.🎥🍿🎬

Technologies

• React
• Router
• Cypress
• Agile methodology

Contributors

• Kara Anderson
• Lauren 'Larry' Seward

Illustrations

Deployed Page

Visit our deployed Rancid Tomatillos page!

Wins

• Efficiently created and followed user stories, ensuring features catered to our target audience, promoting clear team communication and focus on user value.
• Maintaining a steady pace throughout the project, meeting deadlines as expected
• Effectively learning new concepts through self-teaching and exploration
• Conducting comprehensive testing using Cypress for a robust application
• Successfully incorporating accessibility features to ensure a more inclusive user experience
• Employing the "data down, actions up" principle to implement a seamless search feature
• Prioritizing User Experience by focusing on intuitive routing and providing multiple user-friendly ways to navigate back to the main page

Challenges & Improvements

• Determing the most appropriate use of functional vs class components
• Overcoming the learning curve associated with Cypress testing, while ensuring comprehensive test coverage for various user interactions and edge cases
• Identifying and resolving issues related to asynchronous code execution and data fetching
• Possible future improvements and features:
  • Implement user authentication and login functionality, enabling personalized user experiences
  • Allow users to favorite movies, creating a curated collection of their top picks
  • Introduce a "recently viewed" section, providing users with easy access to movies they've recently explored
  • Enable users to submit their own reviews and ratings for movies, fostering a sense of community and user engagement
  • Allow a user to search for movies by genre or rating, offering more refined search capabilities
  • Build our own backend using Express.js to better tailor the data and endpoints to our application's specific needs

Set Up

1. Fork this repo
2. Clone the repo to your local machine
3. Run npm i, then npm run build, then npm start
4. View the project in the browser by opening localhost:3000

Sources

• MDN
• W3Schools
• React Docs
• Cypress Docs

Project Specs

• The project spec & rubric can be found here