Learn how to create a platformer game using vanilla JavaScript.
First, learn to organize the code using the Model, View, Controller (MVC) strategy and the principles of Object Oriented Programming (OOP). Then, learn how to program movement, draw a tile map, and detect collision. Finally, see how to animate the sprites, load levels, and collect items.
💻Code and assets: https://github.com/frankarendpoth/frankarendpoth.github.io/tree/master/content/pop-vlog/javascript/2018/006-rabbit-trap
🔗Working example: http://frankpoth.info/content/pop-vlog/javascript/2018/006-rabbit-trap/rabbit-trap.html
⭐️Course Contents ⭐️
⌨️ (00:00) Part 1: Organization
⌨️ (14:38) Part 2: Movement
⌨️ (51:25) Part 3: Tile Map
⌨️ (1:04:30) Part 4: Tile Based Collision Detection And Response
⌨️ (1:29:08) Part 5: Sprite Animation
⌨️ (1:53:22) Part 5 1/2: Tunneling
⌨️ (2:05:34) Part 6: Loading Levels
⌨️ (1:26:59) Part 7: Collecting Items
Tutorial from Poth on Programming. Check out his channel: https://www.youtube.com/channel/UCdS3ojA8RL8t1r18Gj1cl6w
—
Learn to code for free and get a developer job: https://www.freecodecamp.org
Read hundreds of articles on programming: https://medium.freecodecamp.org
And subscribe for new videos on technology every day: https://youtube.com/subscription_center?add_user=freecodecamp
source
Thanks for the great video, this is great for a newb like me…
Trying to go to the Code & Assets, and working example pages gives me a 404 message…
🙁
gött
if anybody can't access the source codes go to his youtube channel to watch the same video and there you can access it
i cant download the code
is there a code formula that still works?
for anyone who can't find the code:
https://github.com/frankarendpoth/frankarendpoth.github.io/tree/master/legacy/content/pop-vlog/javascript/2018/006-rabbit-trap
thank me later 🙂
Code and sample isn't there anymore… 404 on both. That is sad, I wanted to follow up.
Where's the source code? the links in the description dont work
Very strangely structured video. You showed a video of a bunch of code on a screen and talked about it, similarly to how all of my professors did in school.
Business Opportunity in Ruvol
I have invented a Board Game [still unpublished and not yet out in the market] that I believe is guaranteed to be as challenging and exciting as CHESS. I called it “RUVOL.”
It is my hope that one day Ruvol may surpass chess as the “Number One Board Game in the World.”
The weakness of chess is it always starts in fixed positions that the opening moves become “memorizable.” In fact, not a few have so mastered the moves that they can play against their opponents “blindfolded.” It is for this very reason that the great Bobby Fischer introduced his so-called “Fischer Random Chess,” where the starting position of the pieces is “randomized” to make the memorization of openings impracticable. Fortunately, it is also for this reason that I invented Ruvol where “every game” has been calculated to be a challenging one to play.
HOW IS RUVOL PLAYED and HOW YOU CAN MONETIZE IT?
I detailed everything in my YouTube video. Here is the link: https://www.youtube.com/watch?v=jcqth0m3-R0
BIG MONEY POTENTIAL IN RUVOL!
It is worthwhile to note that the people who play chess will be the same people who will play Ruvol. In my Google search, I learned there are around 800 million chess players in the world. Even just a small percentage of these 800 million is good enough to earn big money from Ruvol either as an ONLINE GAME BUSINESS or as a PHYSICAL PRODUCT DISTRIBUTOR.
You may contact me at: rodolfovitangcol@gmail.com.
Thanks and God bless!
RODOLFO MARTIN VITANGCOL
The Ruvol Inventor
what is this program were you make this?
sorry just asking
code kha ha bhai
whats the website you code with?
Do you still have a code somewhere for inspiration? Cause link on GitHub doesn't work and rewinding video is much slower way as seeing original code. By the way, the video is pretty cool explained. Thanks.
PS: Sorry for trash english
First two links in description they don't work
the github link doesnt work
why you never write the code in the video so we can understand better
but any how it is great !!!!!!!!!!!!!!!!!!!!!!!!!!!!
Thanks!This is the best!After 2 weeks stuck at the development,finally this is a good tutorial.
I got some tips for you:
Use visual tutorial,instead of write the code first than explain the code…
you write the code live while explaining the code you write.
<hl1>Thanks!</hl1>
EDIT:Tile-based collision is complicated.
Roses are red,
Violets are blue,
Ctrl+C,
Ctrl+V,
exactly what I was looking for! 🙂
Your GitHub link is a 404 error. Please fix.
I just needed help building a quiz game, I can see this is far beyond my understanding lmao.
and is this regular java
I learned a lot 🤩
JavaScript Game ⤵️
https://www.youtube.com/channel/UCly_GAz2m-7FEdPgeS672nw/videos
Your Github page and working example URL is broken
Wow I am a "kid 12 year" old learn a lot man !!!. "thanks"..
I have a noob question. Why are you using var instead of let? I was told by my tutor that using var in programs can lead to some errors.
Do you have a facebook or instagram?
What the heck? I see the browser says Not secure.
Example links are broken.
getting a 404 on the github link, was anyone else able to find the source code from this video?
What software do you need to code this like what programme? thank you
Hi!. i want to ask if you can help me. i want to create a simple program/game for mobile that. when the character reach the end of screen(mobile) it will load to another map like side scroling for mobile thank you
"if at any point on this video you get the feeling you are learning" xd
It would be really cool to be able to add bookmarks to this, so as to better navigate it when reviewing.
who is in any ivy college i have alot of question reply it 🙏☺️
Cannot find the project anymore
Around 33:00 I understand the oo world. But it is strength and the weakness. It is a bit organised spaghetti Goto code old days. Unless the object one can delegate the idea to, it is very hard to follow what is going on and where to maintain the state. Now that the source git is sort of gone (at least the link is dead) it is impossible to follow.
working example link is broken, thank you!
Is there a way to find the files of this project?
kalau untuk android platform gimana ?
cool but i would not call this a tutorial
it's more of a showcase
Hi! the code for live example and code are broken. Thanks for the tutorial!
https://youtu.be/ow252tVItrE
is this a tutorial
can u please show how to make frame rate independed movment?
to much bro
but very good
Links in description are broken, could you please update them ? Gonna start with your code as base to make my minigame 🙂