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

"Chomper's" is an innovative app dedicated to revolutionizing the way Shark Week enthusiasts explore and manage their favorite episodes.

"Chomper's" is a user-friendly app designed to enhance the experience of Shark Week enthusiasts. The app simplifies the process of browsing and tracking episodes, allowing users to conveniently filter content by season. Additionally, the app provides users with interesting shark facts on the home page, adding an educational element to the experience. With features such as season-specific episode lists and the ability to mark favorite episodes, "Chomper's" aims to streamline the discovery and management of Shark Week content for users.

Chomper's" was developed as the final project for Turing School of Software and Design's Module 3. Within a span of just five days, the project was successfully completed, showcasing the advantages of efficient development practices and the utilization of cutting-edge technologies like React and Cypress.

• React
• CSS & HTML
• Webpack module bundler
• Cypress end-to-end testing framework
• Postman (for API request testing)
• GitHub Projects
• Figma for wireframing
• Adobe Illustrator for graphics and svgs

• Ashlee Webb - GitHub LinkedIn

Visit our deployed page here.

Despite the tight timeframe, I successfully utilized React and Cypress to deliver a functional and user-friendly app. I added a personal touch by creating custom icons and graphics, enhancing the site's style. One of the significant advantages of employing React in "Chomper's" is its component-based architecture, which promotes reusability and modularity. Breaking down the user interface into smaller, self-contained components streamlined and expedited the development process.

I encountered challenges while handling different types of information pulled from the API. Dealing with older data required a different approach, and I had to find a solution to remove HTML elements from the API's summary. Additionally, I faced difficulties with error handling and redirecting the error path, as it didn't always display properly during testing. It took time to fix these issues by refining my error handling and ensuring the error path updated correctly.

1. Fork this repository to your GitHub account.
2. Copy SSH key on GitHub inside the code dropdown.
3. Using the terminal, run git clone [SSH key here].
4. cd into the repository.
5. Open the repository in your text editor.
6. Run npm install
7. Run npm start
8. Click the hyperlink where the project is running to launch the application in the web browser, or enter http://localhost:3000/ into your web browser.

• MDN
• W3Schools
• React Docs
• Cypress Docs