______      _         ______     _            _           
|___  /     | |        | ___ \   | |          | |          
   / /  __ _| | _____  | |_/ /__ | | _____  __| | _____  __
  / /  / _` | |/ / __| |  __/ _ \| |/ / _ \/ _` |/ _ \ \/ /
./ /__| (_| |   <\__ \ | | | (_) |   <  __/ (_| |  __/>  < 
\_____/\__,_|_|\_\___/ \_|  \___/|_|\_\___|\__,_|\___/_/\_\

-------------------------------------------------------------

With so much content and information these days, live filtering is very crucial feature for websites and it can considerably affect the user experience. I created my own live filtering Pokedex to learn and explore React and to create something I wish I had as a kid. I used the design principles learned in Brown's CS1300 UI/UX class, such as making the site responsive for different devices (with CSS Flexbox and Bootstrap's Grid), providing whitespace between distinct elements, and constructing easily learnable, memorable, and efficient search parameters. My goal was to make it as user-friendly and interactive as possible!

Some code is adapted from the Bootstrap Documentation. Pokemon data and images were provided from Bhargav at codementor.io: https://drive.google.com/file/d/0ByYe7McX3nVPZ1RLY01UbUN0Snc/view

The Pokedex can be viewed live here: https://cs1300-pokedex-development.herokuapp.com
The original code is posted here: https://github.com/zweg25/Pokedex


Once you have downloaded the code, you can deploy it yourself using React. All you have to do is:

1. Check that you have node installed by running node --version in your terminal
2. If you don’t have node you can install it here: https://nodejs.org/en/download/
3. In your terminal, run sudo npm install -g create-react-app (you will need to type in your system password)
4. Once everything is downloaded, run create-react-app pokedex
5. Then run cd pokedex to go into that directory
6. Replace your “public” and “src” folders with mine
7. Run npm start to start your app
8. On your browser, go to http://localhost:3000/ to see the app live!