jwmccowan / pokedex

Pokedex Web App - React JS

###Pokedex

I saw a pokemon API online and wanted to display its contents! A simple little react web app that displays the original 150 and lets you see some information about them.

Uses React for UI, Redux for state, Redux-Thunk as middleware, and axios for http requests.

If you are interested in any of these technologies, following along as I develop (or looking at my project/git history) could be a fun way to learn a thing or two.

Currently in progress.

To run, clone the repo, run npm install then npm start

Open the page at localhost:3000. enjoy!

pokedex's Issues

Initial React Setup

Get the initial structure of the App up and running, with phony reducers.
Steps:

• index.js, which will setup redux store and provider and house a simple App React component
• an action folder, ok to be empty for now until we plan actions
• a reducers folder, we only need a phony reducer in there for now, which will be a function stored in the index folder
• a components folder, with only an App component in it, with a simple div in there

Once this is done, the ticket is complete

Pokemon Display

If the user selects a Pokemon, we want to display some more information about the species. Not sure what this will look like, but want to mark down that this is the goal eventually. Will edit with more details as the app comes into its own.

Search bar doesn't stay on screen

Right now, the search bar stays at the top of the list while scrolling.
It should always be visible.

Pokemon Filter

The list will be very long. As a user, I'd like to be able to filter the search down by typing in a text input located on top of the list.
I'm not sure right now if the Pokemon API supports searching, so we might need to filter client side. That might be better network wise anyways, depending on how often we want to refresh the filter.
This will require an action to filter the current Pokemon list (and a corresponding reducer).

List Pokemon

The first thing a user should see when they use our app is a list of Pokemon. Let's get that done first. This will require creating a grid view component, a grid item component, and an action and reducer for fetching the data. Goes without saying we'll need to hit the data endpoint as well.