Big thanks to INTO THE AM for supporting the creation of this video. Help support them and get 10% off sitewide using intotheam.com/chriscourses

@ChrisCourses

Жыл бұрын

@@delanataylor people don't search for "I'm doing stuff and you just watch," they search for "tutorial." SEO matters in business, including KZread.

@Movies._.334

23 күн бұрын

Hey I have a question I’m jumping way too fast and can’t figure out how to make it jump a bit slower Edit: nvm turned out I didn’t add a space😅

@taylormarie2009

5 күн бұрын

M

all i did was fall asleep for 40 mins...

@fillippro0996

21 күн бұрын

Yeah but I falled asleep for the whole video

@dragosludu3839

18 күн бұрын

Lmao frr

@Pyth0g

3 күн бұрын

same lol

What I like the most is your code improvement over each game. Awesome staff!

Hey I wanted to say that your tutorials are awesome. Structure of these videos is very cool for me because you divide it into sections - for example "Collision detection", "Collision blocks". I like to pause right after you end explaining what you are about to code and I code it in my own way. Thanks for beeing an inspirational creator. Have a good day and greetings from Poland.

Chris, I'd like to thank you for your awesome work. This is the best channel of 2022 I found this year. Top of the top.

@marcelo.victor

Жыл бұрын

Yes, i totally second this.

@averma4493

Жыл бұрын

+1❤

great tutorial as a beginner I appreciate how you explain what you are doing and don't just code through as fast as you can, it is nice to see what is working and why something "breaks".

Chris! Awesome course! Thanks for your knowledge and thanks for sharing this knowledge with us!

Here's a little css to enhance the graphics a little bit: canvas { image-rendering: pixelated; } You can also want to center the game: body { background: black; margin: 0; padding: 0; display: flex; align-items: center; justify-content: center; }

@coversluisito4650

4 ай бұрын

Do you know the name of the program he uses at the end to add the doors?

Awesome! It feels like you've coded this exact thing maaany many times, because you do it flawlessly :)

You make the videos i need to improve my programming skills. Thank you so much for the effort that you put on this tutorials. A hidden gem indeed. 💎👑

Another amazing tutorial! Your pace and clarity are just incredible. Your latest videos totally deserve more views!

@patrickhydar

Жыл бұрын

the pace of 0.4 tortoises

This is gonna be the year I get into coding, and this channel is straight up gonna be the reason for it. Top notch content and all for free, much appreciated!

@kynshra8960

10 ай бұрын

How did it go?

@sora1099

9 ай бұрын

@@kynshra8960 its been a slow process but I've noticed some improvement in other areas, JavaScript aside, I can now work with config files and make super basic websites!

@giovannibandinelli9792

6 ай бұрын

​@@kynshra8960they died of ketamine overdose may them rest in peace

Love these videos definitely want to support you making more

I’ve programmed with python and attempted swift. But the tutorials for swift were not great and I really struggled. I never thought I’d pickup html and js, but your videos showed up on my feed. I don’t think any previous channel I’ve followed has been able to show me so many important components of a language and also make it easy to understand! You’re killing it with these tutorials.

The presentation on these videos really sets them apart from the average KZread programming tutorial. Clean quality audio recording and clear, well spoken instructions elevates the final product. Great job.

I am totally jaw dropped. You are incredible in JS coding.

yow you are a genius, I've learned alot! Thanks man for giving valuable tutorials 🔥

Thank you for the video it's informative for someone like me who is basically a beginner! Very clear and easy to understand I like the step by step!

are u serious? THIS IS SOOOOOO COOOOLLLL BY FAR THE BESTTTT PROJECT U HAVE DONE SO FAR!!! In the start itself I can tell its gonna be a bit advance JS for a high-school student like me lmaoo but i will try my best to gain knowledge from this amazing tutorial!!!!

his voice is amazing and so is his concise and always clear way of explanation .

this is a great tutorial. tyvm ✌I have been a web dev for 10 years but never fucked with canvas. you explain this so simply it should be pretty easy to get to grips with after this. implementing gravity like that reminds me of my first actionscript game. going to make something cool with this real soon lol. if i remember ill come back here and drop a link lol.

Superb as always 👍

You are the best. Thank you so much for this course !!

I found the kings and pigs tileset a couple weeks ago and really wanted to turn it into a game for a 16-bit console, but I couldn't get the damn tiles to fit together like yours and his preview images, and then I just stumbled across this video thumbnail like a sign from God.. AND YOU HAVE THE LEVEL PRE-MADE?! 😤

Man, u r awesome. Keep doing what you're doing! And greetings from Belarus🎉

this tutorial was incredible, thank you!! I'm surprised at how well I was able to follow along and understand. However, I can never imagine being able to come up with how to do this on my own because it is SO complex lol.

@Movies._.334

23 күн бұрын

Can u ask u smthn? Abt the tiles im not sure why it won’t show the same as how it shows on he’s end 57:21 If u know how to fix it pls lmk

Great content, chris, thank you very much!

OMG, it really worked. Thank you so much!!

Great tutorial as usual! You're awesome 😎

This is one of the best tutorials i've ever seen.

I am a HTML5 JavaScript Game dev myself and I learned best way to make "dynamic sprite processing" from this great tutorial! Thanks and love 🙏

Very well done Chris

Good Work, especially u explain every single step u are doin , abo, membership + Thumbs up

Thank you for the Tutorials!

Thanks for all this content. Your tutorials are the best 🔥

Great tutorial, thanks. I see that you have an aversion to semi-colons. I 'd recommend highly always using semi-colons. Avoids some potential nasty pitfalls later on.

this tutorial its awesome, thanks!!

That's great! Thank you so much!

First thanks a lot for all those tutorials thay help me a lot ! I just pointed an issue about player movement when we press multiple keys at the same time. Press RIGHT then LEFT then release LEFT lets you go right then left then right, no problems it works. Press LEFT then RIGHT, player keeps going to the left not reacting to the second press. To solve this issue I did 2 things : - In the event listeners, I toggle keys.X.pressed only if (!event.repeat). - In index.js I put a variable called lastDir. It's set to 'none' by default when player is not moving, to 'left' if only LEFT is pressed, to 'right' only if RIGHT is pressed. Then before checking if a sole key is pressed I check if both LEFT and RIGHT are pressed. If so I make player go the opposite direction told my lastDir + I don't update lastDir. Don't really know why it works but it does 😅

thank you straight to the point

Bro, muchas gracias de verdad !!!!

The most fluent and understandable explanation I have ever watched, thank you very much.

@Chris Courses Happy to see you using object literals for sprite swapping :) One last note: be careful of attaching functions to animation data (either named such as image() or your own custom anonymous functions (such as the GSAP stuff). Often times animation data is stored in json files, and json cannot have things like functions set to them in the json file itself. To get around that, you load the json in, then dynamically attach additional functionality to them after its loaded in, or just dont alter it at all (this helps a lot of you plan on saving animation data to a file for a save game feature). I hope that makes sense. Next up? Dynamically generated levels ala Binding of Isaac with maze like generation? Just an idea :) I learned quite a deal trying that out and could be an idea for you to try (google recursive backtracker) Cheers!

1:24:00 you can use 'every' method for this. It will stop iterating when falsy value is returned from callback

Long time no see man. Very nice tutorial 😇🙏

Thanks for your mind-blowing work, Chris! It would be an awesome idea if you recreate Icy Tower with javascript.

Also if I forgot to upload any assets, just let me know here. Will be sure to add anything that's missing 👍

@Yusa_Beach

Жыл бұрын

Excuse me! I have a question, this was the very thing I was looking for, but I'm also wondering how you would be able to add a grid map?

@Ahmad-dd6fl

4 ай бұрын

what about the beautiful background music and sounds 😢

THIS IS THE MOST USEFUL VIDEO I SEEN

on the same era, with javascript game, there are no other contents like this bro! i already bought your subscription for 1year. make good contents more!!thx

@ChrisCourses

Жыл бұрын

Thank you! Really appreciate that support on the yearly sub. Hope you've enjoyed some of the premium content over there, I finally have the rest of the Pacman course in the works 🥲

@worldbest3097

Жыл бұрын

great!!! ❤

Hey chris, quick question If I am building a game from one of your tutorials and I want to make the game a full stack development project', I was wondering if you have any tutorials on how to integrate something like node, or node.js into the project for lets say a sign in page, or like a statistical point tracker?

Thank you soooooo much!

Great tutorial, I have few questions, how can multiple doors be applied into one level? and if I go to a previous level how can I spawn into a new position instead of the same position it was before in that level?

Thank you for the Tutorials! Do you plan to make a game based on ECS, without using third-party libs?

Thanks a lot 🛐

Really appreciate your job here man. Could you be so kind in telling me the difference between coding this in JS and in Python Py game? Doing so, are both possible to create an .exe file to start the game or it would only run on a browser? Thank you and I wish you much success! Regards from Italy.

Your channel is lit bro...

amazing!! how do i make the character have a swingable hammer??

Loving your tutorials - incredible stuff! Anyone know the following: How to make the player spawn on Level 3 to the idleLeft position instead of the default idleRight? How to solve the double jumping situation when holding down 'w'? Experimenting with both, but haven't quite got it working.

Thx bro,the best拾

My best developer uses my fav Javascript!

Tyy bang, sehat selalu!

You are my hero ❤

BRO U ARE SOO SMARTT

It is pretty good but it could hang for larger maps like in pokemon or metroidvenias instead you should use images and create a for loop for collisons with middle image it means you will need three images drawed on top of each other and need to check collision with middle image it can make game little blurry but it will make your game smooth fast and low on space

I am attempting to follow along but I do not want to use the "w" key to jump and instead want to use space. I figured out I could type case ' ': to simulate the space but when you enter the const, there are no single quotes. I am unsure of how to set the const to use the space key.

Nice one

AMESOME ! but how can you go back to the previous level ?

thank you so much~~

great teacher

You are a miracle.

;v esta muy bueno saludos bro 👍😎

you can make a walkthrough of platform game, NES style games, lode runner, nuts and milk, wrecking crew, etc. Where the game scenario is built dynamically by blocks

Nice one :)

one and only easy and working method

Hi what text editor do you use?

hey, I am sorry , I am a newbie at web dev, can you tell me if this is a dynamic website ? I am making a project for uni, we have been assigned to make a dynamic website , I am assuming a video game would be pretty dynamic, right?

Chris, my superman🤣

How would you recommend turning something like this into a desktop game? Electron?

around 38:40 you can jump infinitely by just holding down the 'w' key

Where do you get the soundtrack and sound effects from?

How would I go about adding enemies to this? I tried so much but I couldn't implement anything with this system

u are a boss👍

I ran into a problem when separating my Player class into its own file, where I got an error saying "Uncaught ReferenceError: c is not defined". "c" is our canvas context variable which doesn't exist in the Player.js file, so to fix it I had to add "c" as a parameter to the constructor class, and pass it in when instantiating a new Player. My question is, what did you do differently such that your code still worked even though you don't pass in "c" as a parameter to the Player class's constructor?

@ChrisCourses

Жыл бұрын

Player class might be imported after "c" is defined. If that's the case, things should still work when importing files via a script tag into a global namespace. Passing through via function like you're doing it though is the "correct" way since you'll be able to tell where certain variables are coming from

Can anyone tell me if we need graphic card for game development or not?

I'm still a little confused why you're using && operators for collisions around 1:27:09 . wouldn't that if statement only run if *all* sides are colliding at the same time? I see that it doesn't work that way, I'm curious why it works with && and not OR

@FaunFunc

Ай бұрын

It basically checks whether its colliding on both sides at the same time which cant be achieved using OR

Bruda u r th bst

Which code editor you used

Awesome)

wat program were you using to type your code?

@Jcassss

Ай бұрын

sublime text

Not hating… just curious… Why go through all the extra work to convert the collisions data into a 2d array? 2D Position in 1D array is y*width+x. I also wonder why it is necessary to create all of these collisionBlock objects? It seems 2 methods drawCollisionBlocks (would allow rendering the red boxes where they should be for debugging) and a quick lookup in the collision data to see if the value at the position of the current sprite location is 292 or not, would have taken much less work and created less overhead… so I’m curious as to weather this was necessary and why? Or what benefits come with doing it this way? My guess is that it is a style choice?

Damnnn Why do I always land on this video when I wake up??

guys hello when i put the code for the animation my "red square" doesn't move can anyone help me fix this

I can't get oncomplete in gsap to stop looping. Any suggestions?

Bro can you please give the whole tiles set in PNG. Cause I want to make my own custom and larger map. 😢 I appreciate all of your effort. Thanks

Instead of using "event.key" at 35:00 , I think it is much better to use "event.code" Which is for w key case is KeyW. Key codes are global, no matter what language is your code it's gonna be the same. event.code are based on the physical key. So let's say by accident someone had caps lock on. the Eevent.key would be capital W, meanwhile we are listening for small w. the event.code gonna be the same.

@ClowdyHowdy

7 ай бұрын

Great tip, I was wondering how to get around this. Thanks, it turned out great!

I have a question, is Javascript and HTML canvas good for large scale indie games?

hey man you should create a game engine in javascript, good job!!

NIIICE!

OMFG- thank you for your work ! I can t wait to go back home and start this project to night, but mister Chris, please, please have mercy upon us ... we need a tutorial of javascript about an inventory system, add and drop is enough and hide the inventory via a button, there is ONLY ONE tutorial about inventory-js from poth programming and it is more of a walkthrough code not a learning brick by brick process like you teach, pothonprogramming shared his github repo with community but his tutorial is absolutely useless because I cant replicate that in a way where i would be confident to include info from him into a personal project of mine, please, please once again, if you find a bit of time to show us an how to inventory, would be great !!!!

@ChrisCourses

Жыл бұрын

Hmm maybe I could add this into an RPG course. I can't guarantee it, but I'll definitely keep it in mind for some of the next vids I have comin out 🙌

anyone else having issues with the onComplete method ?? This is some awesome tutorials and I love learning from you. but I hit some roadblocks every now and then xD Edit: nevermind xD i figured it out

@dg_3

9 ай бұрын

did you have an endless loop? If so, how did you solve it?