Living Web Design on the Edge
Welcome to my Website
Pokedec
This simple JavaScript app was developed as a learning project to understand the principles of programming with JavaScript. By building this small web application, which utilizes HTML, CSS, and JavaScript to load data from an external API and allows for the detailed viewing of data points, the development process can be followed through the commit messages and branches of this project, providing insight into each step taken towards achieving the objective of creating a functional and interactive web application.
This simple JavaScript app was developed as a learning project to understand the principles of programming with JavaScript. By building this small web application, which utilizes HTML, CSS, and JavaScript to load data from an external API and allows for the detailed
viewing of data points, the development process can be followed through the commit messages and branches of this project, providing insight into each step taken towards achieving the objective of creating a functional and interactive web application.
Project Technologies
Project
Technologies
html
css
javascript
The Pokedec app at the start. As soon as the app is opened, an API call fetches the data of all Pokemons. By default a list of all Pokemons is shown as buttons.
The input bar at the top allows for searching Pokémons. The search bar filters the list of Pokémons while the user types, reducing the list of buttons and highlighting the matching characters.
When the user clicks on a button, a modal with the selected Pokemon appears. The modal shows the name, the image, the type and the abilities of the selected Pokemon. A click anywhere outside the modal closes it.
