Code Your Own Kirby Game in a Browser - TypeScript GameDev Tutorial

  Переглядів 36,454

freeCodeCamp.org

freeCodeCamp.org

День тому

Improve your TypeScript skills by building a fun Kirby game clone. Learn how to use Kaboom.js to create a 2d platformer game based on the classic video game.
Code: github.com/JSLegendDev/Kirby-...
Live demo & download link for assets: jslegend.itch.io/kirby-like-p...
Download Tiled here : www.mapeditor.org/
✏️ Course created by @JSLegendDev
⭐️ Contents ⭐️
⌨️ (0:00:00) Intro & Setup
⌨️ (0:08:32) Loading assets
⌨️ (0:14:42) Drawing the level in Tiled
⌨️ (0:29:53) Creating the level scene
⌨️ (0:34:07) Implementing logic for displaying the level
⌨️ (0:54:29) Implementing logic for player and enemies
⌨️ (1:57:15) Conclusion
⌨️ (1:58:11) Bonus : How to export your game
🎉 Thanks to our Champion and Sponsor supporters:
👾 davthecoder
👾 jedi-or-sith
👾 南宮千影
👾 Agustín Kussrow
👾 Nattira Maneerat
👾 Heather Wcislo
👾 Serhiy Kalinets
👾 Justin Hual
👾 Otis Morgan
👾 Oscar Rahnama
--
Learn to code for free and get a developer job: www.freecodecamp.org
Read hundreds of articles on programming: freecodecamp.org/news

КОМЕНТАРІ: 34
@JSLegendDev
@JSLegendDev 16 днів тому
Hope you enjoyed the tutorial! If you want to see more JavaScript/TypeScript gamedev tutorials, head over to my channel!
@brunofelix5434
@brunofelix5434 16 днів тому
amazing class, gained +1 follower
@JSLegendDev
@JSLegendDev 16 днів тому
@@brunofelix5434 Thanks! Glad you liked it :)
@King_Sword77
@King_Sword77 16 днів тому
Where are you from?
@JSLegendDev
@JSLegendDev 16 днів тому
@@King_Sword77 Canada
@user-wk2qb4vg5f
@user-wk2qb4vg5f 9 днів тому
​@@JSLegendDev Can you make a 3D shooter game like 1v1lol ?
@skyguy3651
@skyguy3651 16 днів тому
Thank you very much! This is exactly what I wanted - improve my JS/TS skills by creating a little game!
@donaldflores6889
@donaldflores6889 16 днів тому
thanks for your hard work
@greeng448
@greeng448 16 днів тому
Thanks for the hard work ❤❤
@Marshall_dev
@Marshall_dev 3 дні тому
amazing tutorial!! Kaboom is super fun! ive added a coin collection system, fixed inhale bug while colliding, and working on more levels!
@JSLegendDev
@JSLegendDev 3 дні тому
Nice!
@MariaJuliaGomesdaSilva-ff3of
@MariaJuliaGomesdaSilva-ff3of 15 днів тому
thank you!!!
@cariyaputta
@cariyaputta 16 днів тому
Amazing.
@LiamEvan15
@LiamEvan15 16 днів тому
Thanks for this work !
@AlfinHidayat-br8hi
@AlfinHidayat-br8hi 13 днів тому
amazing
@rishiraj2548
@rishiraj2548 16 днів тому
👍
@teddysalas3590
@teddysalas3590 16 днів тому
hello,can you make a tutorial on huggingface how to make app with trained models using hugging face?
@yahyagoblin5498
@yahyagoblin5498 15 днів тому
hey there i was following your tutorial and then when you load the level after writing the code for displaying it I get a transparent/ checkers image could you please guide me on how to fix this edit- ok so now the background color is showing up but the level png is not edit2-ok I fixed it it was a typo
@theodorosgeorgitsis5600
@theodorosgeorgitsis5600 14 днів тому
Lol😂
@spellz1015
@spellz1015 4 дні тому
anyone else having a problem where sprites would sometimes slide off the platform after landing?
@dirkschiller9060
@dirkschiller9060 8 днів тому
How did you create the art itself - clouds, kerby and enemies, etc. ?
@JSLegendDev
@JSLegendDev 8 днів тому
I use the aseprite pixel art editor and did the pixel art myself.
@chenmzhang
@chenmzhang 3 дні тому
how can i get the picture "kirby-like.png"?
@SivaSai-fw3qp
@SivaSai-fw3qp 3 дні тому
why can't I download the assets
@ranma8890
@ranma8890 16 днів тому
Anything like this but React ?
@JSLegendDev
@JSLegendDev 16 днів тому
I'm thinking of starting to integrate React in future tutorials.
@48595157484812
@48595157484812 16 днів тому
thats the fun part - you transfer the knowdledge gained and do in your own ways
@themks8452
@themks8452 16 днів тому
First to comment
@Short_Clips44
@Short_Clips44 13 днів тому
Hello , what is meant with kirby?
@Short_Clips44
@Short_Clips44 13 днів тому
i see
@Nodsaibot
@Nodsaibot 16 днів тому
thank heavens no punjabi accent
@DiegoDellaV
@DiegoDellaV 15 днів тому
I hear a French accent.
Best OS for programming? Mac vs Windows vs Linux debate settled
8:41
How to Get a Developer Job - Even in This Economy [Full Course]
3:59:46
freeCodeCamp.org
Переглядів 2 млн
Історія загиблого Назара Небожинського
00:54
Суспільне Рівне
Переглядів 850 тис.
одни дома // EVA mash @TweetvilleCartoon
01:00
EVA mash
Переглядів 5 млн
Chernobyl Nuclear Fallout Is Still In Our Food
8:02
The Action Lab
Переглядів 34 тис.
Supersonic Aerodynamic Control
25:08
BPS.space
Переглядів 45 тис.
Learn HTML Images, Videos & Audio in 6 Minutes
6:28
Learndev
Переглядів 364
How I Made Kirby Maker
9:21
CodeNoodles
Переглядів 656 тис.
Designing my own Kirby Ability
11:32
Brandon James Greer
Переглядів 229 тис.
Start Your Game Creation Journey Today! (Godot beginner tutorial)
22:03
M4 iPad Pro Impressions: Well This is Awkward
12:51
Marques Brownlee
Переглядів 5 млн
I learned to code from scratch in 1 year. Here's how.
41:55
Thomas Frank
Переглядів 303 тис.
The ARM chip race is getting wild… Apple M4 unveiled
4:07
Fireship
Переглядів 684 тис.
Complete 2D Platformer in Godot 4 Tutorial - Zero to Shipped Game for Beginners
3:23:28
Історія загиблого Назара Небожинського
00:54
Суспільне Рівне
Переглядів 850 тис.