Build a Pokedex with JavaScript and PokeAPI

Channel:

Kenny Yip Coding

Subscribers:

50,600

Published on February 20, 2022 12:37:38 AM ● Video Link: https://www.youtube.com/watch?v=dVtnFH4m_fE

Category:

Tutorial

Duration: 32:08

7,352 views

123

In this coding tutorial, you will learn how to build a pokedex using javascript html css with the pokeapi! Using javascript, we will populate pokemon data from the API onto the pokedex. You will also learn how to use css to make the pokedex scrollable.

https://pokeapi.co/

Code: https://github.com/ImKennyYip/Pokedex
Demo: https://imkennyyip.github.io/Pokedex/

Website: https://www.kennyyipcoding.com/

Java Game Programming Projects Playlist:
https://www.youtube.com/playlist?list=PLnKe36F30Y4Y1XQOqNsL9Fgg_p6nYhcng

JavaScript Game Programming Projects Playlist:
https://www.youtube.com/playlist?list=PLnKe36F30Y4bLhA-st9sC4ZthyV7nsL2Q

Subscribe for more coding tutorials 😄!

.normal {
background-color: beige;
color: black;
}

.fire {
background-color: orange;
color: white;
}

.grass {
background-color: green;
color: white;
}

.water {
background-color: blue;
color: white;
}

.ice {
background-color: lightblue;
color: black;
}

.electric {
background-color: gold;
color: black;
}

.fighting {
background-color: darkred;
color: white;
}

.flying {
background-color: skyblue;
color: black;
}

.bug {
background-color: yellowgreen;
color: white;
}

.ghost {
background-color: purple;
color: white;
}

.rock {
background-color: sienna;
color: white;
}

.ground {
background-color: burlywood;
color: black;
}

.steel {
background-color: silver;
color: black;
}

.dark {
background-color: darkgray;
color: white;
}

.psychic {
background-color: palevioletred;
color: white;
}

.fairy {
background-color: pink;
color: black;
}

.dragon {
background-color: teal;
color: white;
}

.poison {
background-color: darkviolet;
color: white;
}