Pokedex application logo

The case study

Overview

Pokédex is a small application built with HTML, CSS, and JavaScript that loads data from an external source about Pokemons and enables the viewing of data points in detail, as well as a search engine.

Purpose & Context

Pokédex is a personal project I built as part of my web development course at CareerFoundry with the methodology to learn to program while programming.

Objective

The objective of the project was to develop a complete and fully functional JavaScript web application to showcase in my professional portfolio. My focus was on creating a visually appealing and easy-to-use front-end interface.

// About JavaScript

JavaScript (or simply JS) is the programming language of the web browser and serves as the third pillar alongside HTML and CSS. It breathes life into web pages, enabling interactive and dynamic experiences without the need for page reloads. With JavaScript, web pages can respond in real-time to user actions, facilitating animations and enhancing interactivity.

In the image on the side are three simple JavaScript functions I created to display formatted data to the user. These functions were necessary because the data from the API did not specify any units of measurement.

Screenshot of functions in JavaScript
Pokedex gif showing how the application works

Retrospective

I can say that I am proud of this project. In the beginning, I researched how to create an app about Pokémon, focusing on their colors and logo to capture the Pokémon theme.

Additionally, I made sure to display formatted data to the user instead of presenting raw data without units or measurements, which could cause confusion.

Looking back, I would improve this project by considering the display on larger screens and optimizing it to show multiple Pokémon per row, taking advantage of the available space instead of displaying just one Pokémon per row.