← All freeCodeCamp videos

Build a Dev Portfolio as a 2D Game – JavaScript Course

185,881 views 6,587 likes 2024-04-03 1:37:41 Watch on YouTube ↗ freeCodeCamp ↗
Game DevelopmentFrontendJavaScript

Chapters (10)

Show the creator's full description
Learn how to use Kaboom.js to create a 2d game that is actually a developer portfolio. This is a creative way to show off your skills. Live demo: https://jslegenddev.github.io/portfolio/ Source code: https://github.com/JSLegendDev/2d-portfolio-kaboom Map files (map.json + map.png): https://github.com/JSLegendDev/2d-portfolio-kaboom/tree/master/public Spritesheet: https://github.com/JSLegendDev/2d-portfolio-kaboom/blob/master/public/spritesheet.png Fonts: https://datagoblin.itch.io/monogram Tiled software: https://mapeditor.org Substack post explaining how to implement mobile controls : https://jslegenddev.substack.com/p/how-to-implement-player-controls Course developed by @JSLegendDev ❤️ Try interactive JavaScript courses we love, right in your browser: https://scrimba.com/freeCodeCamp-JavaScript (Made possible by a grant from our friends at Scrimba) ⭐️ Contents ⭐️ ⌨️ (0:00:00) Intro ⌨️ (0:03:35) Setup ⌨️ (0:16:40) Loading assets ⌨️ (0:19:36) How to use Tiled to draw maps ⌨️ (0:36:23) Writing logic to display map ⌨️ (0:45:02) Creating the player ⌨️ (0:52:13) Writing logic to display boundaries ⌨️ (0:58:07) Writing logic to display dialogue ⌨️ (1:16:28) Spawning the player + player movement logic ⌨️ (1:26:33) Writing logic for scaling the camera + animations + dialogue text 🎉 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: https://www.freecodecamp.org Read hundreds of articles on programming: https://freecodecamp.org/news

Description and video by freeCodeCamp.org. This page is an independent companion view; the video is embedded from YouTube.