Build a Pokedex with Vanilla HTML, CSS, and JavaScript

Learn how to Build a Pokedex with Vanilla HTML, CSS, and JavaScript! Let's combine two of my favorite things, Pokemon and JavaScript, to build a Pokedex of the original 151 Pokemon. We will only be using plain vanilla HTML, CSS, and JavaScript!

Build your next awesome project:

Assets / Github / Source Code:

Chapters:
00:00 What we are building / Finished Pokedex
02:05 Project setup

Hope you enjoyed this tutorial. Leave a like if you did, and feel free to subscribe for more tutorials like this in the future!

Design Inspiration:

[AlejandroGonzalez-xedd]

i built a super similar web app in the summer except instead of using pokeapi i created my own api using mongodb and js. and then i created a react app for the front end and let me just tell you ur website is a much cleaner design. Mine doesnt work on mobile at all since i didnt have any css knowledge at the time and was just learning as i went. May have to redo my website after seeing this lmao

[samimustafa]

Brother You are One OF the best youtuber, the way u explain is so understandable keep posting vids with api in html css js

[gamingexpert]

Really thank your so much, without ur help if would have take me a lot of time doing something like this, you saved a lot of time for me. This project is really going to help me a lot. thanks a lot teacher.
you have explained almost everything clearly, no doubts. thnak you so much ❤

[themangosmooviee]

This was an incredible tutorial. So helpful and informative! Thank you!

[enderman]

When i try to get pokemon above #649 (genesect) i am not able to get the images for those pokemons. could someone help me

[swoldu]

This is great and you teach so well. How long would this take you from the initial inspiration stage? I'm new to coding

[Sonyemman]

Working through this tutorial. Why do we use removeEventListener in regards to the left and right arrow in the details.js? If we are adding navigate pokemon functionality to the arrows then why are we removing the event listener when there is a click?

[davidmolina]

When creating the pokemon.js in the first const with document.Queryselector the log tells me "document is not defined". I tried putting the script at the end of the body, checked the folder structure path and any typos but everything is okey. Why it gives me that error?

[akshatagrawal]

from where i can find the pokemon images?? as it is not showing images of the pokemon

[aliasname]

in pokemon.js - line 76 - i had to add a 'return' statement at the beginning to get name searches to work. I'm only about an hour into the video and hadn't had any other issues with it other than that.

"return

I'm still learning so can you add some insight on this, do you know why i would have had to make this change from the original code?

[russkydeutsch]

How long have you been programing? I just completed a full stack bootcamp, but I feel there is just too much to learn, snd it will take too long to become good at it.

[orangeapple]

Why would you link JS in the title with defer when you can just put it at the end of the body? Is there an advantage to doing it this way?

[akshatagrawal]

Raw githubusercontent URL is not working here

[websitewalaofficial]

I'm not able to watch your video. It's loading bro. I think there is something wrong