Poke-Dex

HTML | CSS | JavaScript | jQuery | Bootstrap

Check out the Poke-Dex app! | GitHub

poke-dex launch img

The Challenge

Poke-Dex was a learning project designed to explore the ins and outs of JavaScript and DOM interaction. The project also served as an introduction to libraries and honed some HTML and CSS skills at the same time. This project was a stepping stone to begin working on larger projects with more functionality and more advanced concepts and features.

poke-dex
poke-dex modal img

Tech Stack Explanation

HTML, CSS, JavaScript, along with jQuery and other third-party libraries are the backbone and foundation of most modern web development. So developing the Poke-Dex app was a fantastic way to incorporate some of the most fundamental elements of web development into a single project. Using minimal external libraries gives the site fast load times and responsive interactions despite a large JavaScript file.

The Process

The Poke-Dex app was first visualized through user stories. The user stories get converted into sketched wireframes, which provided a more concrete visual concept for the final product. Once wireframes are completed, programming begins, and each element and function are tested multiple times before being put into production.

poke-wireframes
poke-dex footer img

Lessons Learned

This project taught me a lot about patience and API interaction. Before I began this task, I only had a tenuous grasp of HTML, CSS, and JavaScript. I didn't know the first thing about making calls to APIs or how to iterate over data pulled from them. All the same, this simple project paved a path leading to more advanced concepts and far more exciting future projects.