@@JamesQQuick This was almost exactly a question in an entry level interview hahaha. They just wanted a click able list of names. Watching this video has been a huge step to something that will change my life. Really can't thank you enough.
Wow bro, I just was doing something like this 2 days ago, a spa of a Pokedex with Vanilla JS and I was stucked with those 2 fetch calls to get pokemon's data like name, type, sprites..... now with your fantastic video it's like discover gold, thanks a lot!
wow.... grid-template-columns:repeat(auto-fit, minmax(320px, 1fr)) just changed my life. i never ever know i could basically have a decently responsive design without annoying overly complicated media queries at several breakpoints!!! who know that with ONE line of CSS i could do this!
How can you separate js files and and use many js together? require and module doesn't work. im using node so not sure if that has anything to do with mutliple js's files not talking to each other if so then someone needs to make a tutorial on how to talk with multiple js files using node for browser displaying. Ugh, think you may need to make a tutorial on using an api and having multiple js files talking to each other using node.
i want to change the color of the types to match the ones we see in the games (blue for water, orange for red, green for grass, etc.), how can we do that here?
Hey, James! Since I see that you still answer questions to this video, (which is f-ing great) I've a few : 1. Isn't it better to make 1 request to pokeapi and get every pokemon in big array that way and only then map it to your way, rather than making 150 requests? 2. Can you do the same thing but with async/await and not with promises and should you, if yes then how
i'm trying to add "if" statements to my javascript to add certain classes to my types so i can change the text color according to type but im having a bit of trouble
I really appreciated the video. Just got to know your channel. I'm a beginner at vanilla js, but I liked that in the video you would say "oh I made a video about that go check it out". My humble suggestion is that you linked other videos that you made in the description, bc at some points I was just copying you bc I didn't actually know what was going on. But again, that's just me as a beginner. Thanks again :)
Great tutorial! Could you make a pagination system for this tutorial? For example, showing 10 pokémon per page and allowing someone to advance and go back with buttons
@@JamesQQuick I figured it out.. the top part wasn't coded like yours. basiclly because for my top part i didnt need all 150 pokeman lol.. still new to promises any videos on that? maybe using pokeman lol
@@JamesQQuick still breaks :-( link below jsfiddle.net/amorlett/0mjo3aqr/5/ yes keeps breaking on last .map I'm not sure why :-( the only thing I changed is the for function and added a var
If anyone else is wondering why they can't hear him like I was, his audio only comes in through the left headphone. I had one headphone off and couldn't hear anything he was saying. lol
Thank you very much, there are not many GOOD full stack tutorials like mern, i d be very gratefull if u can do one ... anyways thank you again for this awesome video
the audio from the voice only comes through the left channel.
thanks for the codepen you're an incredible teacher
Yeah sorry about that :( glad you’re enjoying it though!
@@JamesQQuick
This was almost exactly a question in an entry level interview hahaha.
They just wanted a click able list of names.
Watching this video has been a huge step to something that will change my life. Really can't thank you enough.
this teaches me more stuff than my own school does, great job!
Wow that’s cool feedback!
Thank you! Had a great time with this project. I'll be on the look out for the next one
Part 2 coming this week!
Wow bro, I just was doing something like this 2 days ago, a spa of a Pokedex with Vanilla JS and I was stucked with those 2 fetch calls to get pokemon's data like name, type, sprites..... now with your fantastic video it's like discover gold, thanks a lot!
Glad it helped!!
wow....
grid-template-columns:repeat(auto-fit, minmax(320px, 1fr)) just changed my life.
i never ever know i could basically have a decently responsive design without annoying overly complicated media queries at several breakpoints!!! who know that with ONE line of CSS i could do this!
Haha yep I was really happy when I found that!
How can you separate js files and and use many js together? require and module doesn't work. im using node so not sure if that has anything to do with mutliple js's files not talking to each other if so then someone needs to make a tutorial on how to talk with multiple js files using node for browser displaying. Ugh, think you may need to make a tutorial on using an api and having multiple js files talking to each other using node.
i want to change the color of the types to match the ones we see in the games (blue for water, orange for red, green for grass, etc.), how can we do that here?
was this prior to destructuring was a thing?
thats pokemon['name']=results.name stuff hurts my eyes lol
couldn't you have used data.sprites.front_default vs ['front_default']?
Everytime it give me an error code on javascript, how do I fix this?
is sprites vs code specific or is there something I have to import, because I am trying to follow the video and it's not highlighted.
Awesome as always James. Would love to see such tutorials.
Working on it :)
One question, if i want to do it, but with fakemons... (i dont have the api) what could i do???
I’m really not sure what that is and what you’re asking?
@@JamesQQuick I wanna make a pokédex with invented pokemon and i haven't an api, what can i do
Toskan4134 build your own fakemon api
Image links are not working??!
Give me error line num 30 in app. Js
Can you compare your code to the example?
Hi James! I was wondering if you could do a tutorial on how to put a search feature on it? Love the vids btw
He actually has a video about it :) I will try to implement both this and the search for a school project. Can let you know how it goes ;)
@@agentsscouts2110 Thanks
I love that you made this!! May i use this project for my resume?
Please please: HOW DO I ADD A SEARCH BAR TO THE JAVA SCRIPT FILE????? Im breaking my brain here.
Great tutorial quick, would like to see more like this from you!
Thanks! Any particular type of video you’d like to see?
Can you send the course of css grid?
thanks!
Hey, James! Since I see that you still answer questions to this video, (which is f-ing great) I've a few :
1. Isn't it better to make 1 request to pokeapi and get every pokemon in big array that way and only then map it to your way, rather than making 150 requests?
2. Can you do the same thing but with async/await and not with promises and should you, if yes then how
i'm trying to add "if" statements to my javascript to add certain classes to my types so i can change the text color according to type but im having a bit of trouble
i am a noob with js so pls dont be too harsh when i post my attempt at adding my script lol
Promise.all(promises).then((results) => {
const pokemon = results.map((data) => ({
name: data.name,
id: data.id,
image: data.sprites['front_default'],
type: data.types.map((type) => type.type.name)
.join(', ') if (type == 'grass') {
type.classList.add("green")};
}));
displayPokemon(pokemon);
});
Hello, this app makes 151 requests for access.. can you explain how can we do to access the api without been blocked ?
Please anybody can tell me how to use recursion instead of for loop?
I really appreciated the video. Just got to know your channel. I'm a beginner at vanilla js, but I liked that in the video you would say "oh I made a video about that go check it out". My humble suggestion is that you linked other videos that you made in the description, bc at some points I was just copying you bc I didn't actually know what was going on. But again, that's just me as a beginner. Thanks again :)
Great suggestion! Sometimes I forget to do that. Thanks a lot for watching and your feedback!
@@JamesQQuick could you also share your friend's course link?
@@leonardojaques6586 Here's the regular link. I'll see if I can get your a discount link shortly! www.udemy.com/course/practical-css-grid/
if i want to show 1 or some cards each time by creating next and also previous button how could i do that? i will be appreciate to let me know
image links not working
whats ur friends css course?
+1 for the cutout effect overlay special effects FTW!
Lol thanks!
How we used Ascyn/await catch here
Only left channel audio
Rats! I thought I fixed this before publishing. Shitty thing is youtube won't allow me to swap out the video. I would have to create a whole new one
Yeah, I started with headphones on and that quickly had to change... lol
How do I write the arrow function on keyboard?
Equals sign = followed by a great than symbol >. So =>
Where are the videos that you suggested for review on fetch, promises, etc..?
Ahh I forgot to link them. You can look at the JavaScript playlist on my channel :)
How can I get your boiler plate extension.
Search the store :)
Would love a link on the CSS grid
Does anyone know how to do this, but for Jojo Stands? (I'm counting Hamon as a stand by the way).
Huh?
@@JamesQQuick You heard me correctly
@@firefallgaming12 I'm confused...
@@JamesQQuick What are you confused about?
Thanks for the video, you explained very well! ❤️
it already sends i in json...
Great tutorial! Could you make a pagination system for this tutorial? For example, showing 10 pokémon per page and allowing someone to advance and go back with buttons
That’s a great idea. Going in the backlog!
@@JamesQQuick :D
Thanks to this video I finally got the images of the pokemons showed on my api. Great video!
So glad to hear it!
im learning soooo much the last 5 minutes haha. that simple bounce animation was soooo easy! thank you :)
Haha glad to hear it!
THANK YOU!
good, I need more new js web teaching,nice video
More incoming :)
I got uncaught promise in pokeman .map I tired everything even copy and paste your Javascript and nada :-(
Hmm are you able to share your code?
@@JamesQQuick I figured it out.. the top part wasn't coded like yours. basiclly because for my top part i didnt need all 150 pokeman lol.. still new to promises any videos on that? maybe using pokeman lol
@@upperlevelmedia Glad you got it figured out! I've got a discord you can join if you have questions in the future. discord.gg/vM2bagU
@@JamesQQuick still breaks :-( link below
jsfiddle.net/amorlett/0mjo3aqr/5/
yes keeps breaking on last .map I'm not sure why :-( the only thing I changed is the for function and added a var
@@upperlevelmedia What's the error?
Really good man, thanks!!!!
Glad to hear!!
as a beginner is a nice project to practice async topics, and some CSS too. a nice tutorial
Glad to hear it!
PLEASE DO THE WEAKNESSES
Cool channel ! Great stuff 😄 subbed 💪
Awesome!!! Thanks for watching!
Thanks, heres a comment and a like!
Ayyy!!!
This is my childhood. Guessin you were born 1990 like me?
Haha 91!!
If anyone else is wondering why they can't hear him like I was, his audio only comes in through the left headphone. I had one headphone off and couldn't hear anything he was saying. lol
Haha so sorry. This was one video I forgot to split the audio :(
Fantastic video
Thanks!
my left ear loved this
Is the audio off?
Thank you very much, there are not many GOOD full stack tutorials like mern, i d be very gratefull if u can do one ... anyways thank you again for this awesome video
whats is this bro?
What?
@@JamesQQuickwhich vs code theme you using? => looks diffrenet in mine VS code
@@devmnnu5334 oh lol Cobalt 2 by Wes Bos
@@JamesQQuick thnq my frand (translation: Thankyou my friend)
@@devmnnu5334 :) you're welcome!
slow down
Cool
ay cuh my audio fucking up, left ear audio gang?
It was my fault. Sorry!
I can hear your voice just on the left 👂ear !!
Yeah I messed up a couple of my audios back then :)(
padding-inline-start? WTF!!! lol. never seen that.. everything else pretty easy for me :)
Haha apparently you can also just do padding-left too
@@JamesQQuick lololol ok phew i thought i was missing something crazy