Pokémon World

Overview

This Application started as a JavaScript project to build a Pokédex App, fetching data from an external API to display Pokémon stats.

While making the App I experimented with writing the code first in vanilla javaScript and then converted this to jQuery. For the navbar, modal components and layout I used Bootstrap.

After I completed this project I decided to expand the app and add a landing page, a quiz page and a game. I had fun experiementing with the CSS - like making the pokemon spin on hover on the index page and practiced DOM manipulation with the quiz.

Coding Beyond Tutorials

This App was essentially about getting a better grip with JavaScript. For the Pokédex and Quiz pages I followed tutorials for the basic code, adapting the code to my personal needs. This helped me to understand and read code, but I wanted to take it to the next level and write code. So I decided to make a Pokémon game using my own ideas.

I started by having a basic idea - poke as many pokemon on the screen as you can in 10 seconds. I then researched how to determine random places on the game screen and used the console a lot to help me see what was going on. This really honed my JavaScript skills and forced me to think through the whole process independently. It also brought to my attention the need for event delegation to attach event listeners to elements created in the DOM, as this was vital to the structure of the game.

At the end I wanted to create a screen for both mobile and desktop views, which required using media queries and figuring out ways to refactor the code.

Lessons Learned

I love CSS and using JavaScript for DOM manipulation. For me playing around with the visual and interactive experience is primarily why I chose to get into Web Development and I fully intend to explore UI design concepts further.

JavaScript is the foundation for learning so much about coding. Developing apps like Pokémon World have helped me to get a better grasp of the core concepts in programming which is essential to master other libraries and frameworks.

Links to Project

Code Live

Pokémon World

Overview

Coding Beyond Tutorials

Lessons Learned

Links to Project

Let's Build Something Together