Skip to content

Latest commit

 

History

History
40 lines (30 loc) · 2.31 KB

README.md

File metadata and controls

40 lines (30 loc) · 2.31 KB

Rancid Tomatillos

Overview

Rancid Tomatillos is a Mod 3 paired project for Turing, School of Software and Design. From start to completion we had one week to learn all of the concepts to create a front-end movie website using React, Router and Cypress for testing.

Learning Goals

  • Gain competency with React fundamentals
  • Make several network requests and handle asynchronous JS
  • Test React application with Cypress
  • Create a multi-page application using Router
  • Practice refactoring

Link to deployed site

You can view the deployed application here: Rancid Tomatillos

Screenshot/gif of app

Rancid Tomatillos Homepage

Credits

Devlin Lynch https://github.com/DevKLynch
Terra Manning https://github.com/TDManning

Challenges

When refactoring our code to use Router v6 we ran into some challenges in identifying what step in our refactor were problematic. During the refactor process, we were unable to render our site in the browser until all of the refactor changes were made. As a result, if we made a mistake it was initally difficult to identify the exact issues without extensive debugging and console.logs.

Wins

After some difficulties with refactoring our app to use Router, we broke up the implementation steps into smaller, more manageable pieces as well as having a clear plan in place ahead of time. In the end we were able to implement router! Another win was setting up a detailed Excalidraw file in order to plan out our entire app from a big picture standpoint and also on a more granular level. The Excalidraw also made it possible for excellent communication and collaboration since we were working both synchronously and asynchronously throughout the project.

Set Up

  1. Fork this repo
  2. Clone and rename this repo: git clone [remote-address] [new-name]
    For example: git clone [email protected]:turingschool-examples/rancid-tomatillos-starter.git rancid-tomatillos
  3. cd into the directory
  4. Install necessary dependencies with npm install
  5. Run your React app with npm start
  6. Go to http://localhost:3000/ and you should see a page with some starter elements
  7. Enter control + c in your terminal to stop running the React app at any time
  8. To run Cypress tests, use npx cypress open