Mod 3 Stretch Tech: Gotta Ketchum All!

Visit our deployed app here

Table of Contents

• Abstract
• Technologies
• Code Architecture
• Illustrations
• Install + Setup
• Contributors
• Wins
• Challenges + Improvements
• Project Specs

Abstract

Our goal was to build a React app with Typescript and the PokeApi. Our app allows users to view pokemon by generation or all at once. Users can search for a pokemon by name and their search results will filter in real time. If a user clicks on a pokemon card it will show the user that pokemon's details. Users will also be able to favorite pokemon that will show up on a seperate favorites page.

Technologies

• Javascript
• React
• Typescript
• VScode
• PokeApi
• React Router v6
• Cypress

Illustrations

Main page:

Pokemon details:

Search by name:

Favorites:

Install + Setup

• Clone this repo to your machine.
• cd into the directory Pokemon-Stretch-
• Run npm install
• Run npm start

Contributors

• Jessica Organ
• Brian Peterson
• Susanna Carey
• Enzo Jimenez-Soto

Wins

• App styling is on point.
• Our app functions the way we intended it to.
• Good communication and workflow.

Challenges + Improvements

• Learning a new language is difficult.
• Styling on favoriting button within the favorites view is not consistent (but the functionality is there!).
• Passing state around makes it difficult to keep track of the data used within different parts of the app.

Future Iterations

• Comparison feature to compare type strengths and weaknesses between pokemon.
• The ability to search by properties other than name.

Project Specs

• The project spec & rubric can be found here