State Management in Games

Поделиться
HTML-код
  • Опубликовано: 28 окт 2024

Комментарии • 126

  • @Frankslaboratory
    @Frankslaboratory  2 года назад +29

    Happy 2022 everyone 💪❤ What project will you build next year?

    • @adedoyinemmanuel7802
      @adedoyinemmanuel7802 2 года назад +1

      Next year, is gonna be awesome, planning on taking my game development skills to the next level by adding backend features like PHP,SQL

    • @perromacana
      @perromacana 2 года назад +3

      i gona try, to not cry to much when i code

    • @Frankslaboratory
      @Frankslaboratory  2 года назад +1

      @@adedoyinemmanuel7802 Great to hear Ade, I also want to do some backend this year

    • @Frankslaboratory
      @Frankslaboratory  2 года назад +1

      @@perromacana Why do you cry when you code :D

    • @adedoyinemmanuel7802
      @adedoyinemmanuel7802 2 года назад

      @@Frankslaboratory that's gonna be awesome, I also wish to learn how to use tilemaps, in game dev, I have been trying to wrap my head around it for the past days now

  • @graydhd8688
    @graydhd8688 Год назад +3

    Finally, an explanation of modules that actually made sense. I feel like a lot of people teaching online forget they are talking to beginners and explain things in ways that leave me more questions, and sometimes the concept can be extremely simple like this but they just can't really convey that. Thanks so much for actually taking the time to really break down some of the simple concepts other educators often take for granted. I leave your videos feeling I have a better understanding, whereas so many others honestly just leave me with more questions than I went in with.

  • @zakbabu804
    @zakbabu804 2 года назад +1

    Going to start game dev this year... and it's because of you... Thanks Frank

  • @Dunamix15
    @Dunamix15 2 года назад +1

    Great video, you deserve much more views, considering how much effort u put in you video, all this animations to keep viewers understand with examples...

  • @sertansantos3032
    @sertansantos3032 2 года назад +1

    Can' wait to follow this when I have the time for it. Really like the advanced tutorials with cleaner code structures

  • @kylecostello4954
    @kylecostello4954 2 года назад +2

    I’m just starting getting into js game programing and this video is a godsend. Thank you Frank!

  • @thisisreallyme3130
    @thisisreallyme3130 Год назад

    Wow, what an excellent presentation. I don’t use JavaScript (by choice) and found this by accident, but the quality narration kept me hanging on. Thanks for explaining what you are doing, and why in a way most videos don’t. 😊

  • @AshTech-Designs
    @AshTech-Designs 2 года назад +5

    I was waiting for this , thanks a lot you are the best keep up the good work

  • @mhbaando
    @mhbaando 2 года назад +8

    This is what I like frank, keep up the good work buddy 🔥

  • @Eternam
    @Eternam 2 года назад +1

    Happy new year Frank!! glad to see an explanation about modules and arrow functions

    • @Frankslaboratory
      @Frankslaboratory  2 года назад +2

      Hi Eternam, happy new year! I'm trying to slowly include more ES6 syntax :D

  • @h989l
    @h989l 2 года назад

    I am in love with your game devlopment playlist.

  • @javifontalva7752
    @javifontalva7752 Год назад

    Every time I watch an old video I learn something new.

    • @Frankslaboratory
      @Frankslaboratory  Год назад

      This is probably the most complicated video on my channel. I woul use similar logic to give a game multiple levels

  • @PhorssaOneDev
    @PhorssaOneDev Год назад

    Very, very cool video, Frank...I appreciate this. Thank you for the clear descriptions!

  • @AK243RDC
    @AK243RDC 2 года назад +3

    Happy new year 2022 ❤❤!! Again an amazing video . I learned module, export/import and the way you handled the player states is awesome!

    • @Frankslaboratory
      @Frankslaboratory  2 года назад +2

      Happy new year Tshitolo, and thank you for giving me such a nice feedback

  • @sushikung9828
    @sushikung9828 11 месяцев назад

    I'm beginning to study js because my class project doing game with js. This clip good explain and teach me a lot. thanks you so much

  • @piersonlippard2911
    @piersonlippard2911 2 года назад +3

    Happy New Year Frank, I hope 2022 brings you great joy, happiness and a lot more coding fun. Thanks for this great tutorial to start off the year of the tiger with.

    • @Frankslaboratory
      @Frankslaboratory  2 года назад +1

      Hi Pierson, good to see you here again, I wish you a lot of success in 2022 💪❤

  • @GiuTor73
    @GiuTor73 2 года назад +1

    Hello Frank you can use the word DEFER inside the javascript tag. It will wait for the DOM to complete loading before executing the script.

  • @PrimeTime416
    @PrimeTime416 2 года назад +1

    State Machines are a complex concept and pattern, Frank your implementation of state management in the game example really helped me understand State Machines a little bit more, thanks.

    • @Frankslaboratory
      @Frankslaboratory  2 года назад +1

      Glad you found it useful, state design pattern implemented in this way looks complex at first, but when you use it for a couple of projects it will become much easier and you should be able to write a custom one for other projects as well. I will use it again for a different game soon managing menus and play/pause/restart

  • @henilrmistry
    @henilrmistry 2 года назад +1

    Happy new year frank and to all fellow viewers!! 🥰 by the way hey frank... I have felt that this was very informative session for me because before this video was out I was using that so called "spaghetti code" But now that you have showed such a good way for switching animation states I will use that and also I am very thankful to you..... Because you have shared such a good knowledge.

    • @Frankslaboratory
      @Frankslaboratory  2 года назад +2

      Hi Henil, happy new year :D Sometimes spaghetti code version is ok, for example if you have only 2 or 3 player states, it might be the better solution, but when you are building a bigger projects, state management becomes necessary

  • @kashnigahbaruda
    @kashnigahbaruda 2 года назад +1

    Great stuff! Finally using modules too hehe!

    • @Frankslaboratory
      @Frankslaboratory  2 года назад

      Yea, I was avoiding them because I have to explain how to install live server every time I use modules :D

  • @tytalksYT
    @tytalksYT 2 года назад

    You make excellent relevant tutorials, I love it

  • @kazukisenpai2405
    @kazukisenpai2405 10 месяцев назад

    Nice video! I learned a lot after watching 👌👌
    Thank you!

  • @elzemcorem
    @elzemcorem 2 года назад +3

    I really like your tutorial, keep it up. Please can you do a tutorial on a 3d car racing video game with javascript?

    • @Frankslaboratory
      @Frankslaboratory  2 года назад +3

      I want to look into racing games, thanks for the tip Bill

  • @havefun5519
    @havefun5519 2 года назад

    Very detail, very useful, very clear

  • @proxikal
    @proxikal Год назад

    Amazing!!! 😊 keep up the great work!

  • @JUNGELMAN2012
    @JUNGELMAN2012 Год назад

    Implementing the concept of a StateMachine was very interesting to watch. But codewise it wasn't easily readable and thus confusing (like the overuse of the word state in many versions). I had to rename it all to my understanding.

    • @Frankslaboratory
      @Frankslaboratory  Год назад

      Hi, this is an advanced concept and it is a good idea to write it in your own way. I need to get better with choosing my variable names, noted

  • @dericksanto2853
    @dericksanto2853 2 года назад

    thanks
    i don't understand yet but i can get the concepts this help a lot

    • @Frankslaboratory
      @Frankslaboratory  2 года назад

      Hi Derick, design patterns are an advanced topic, it takes time you will get there eventually

  • @Dasein23
    @Dasein23 Месяц назад

    Great video, thanks for this. Question though - wouldn’t it make more sense for the states array to be a set rather than an array? Since the state will always be unique?

    • @Frankslaboratory
      @Frankslaboratory  Месяц назад

      Yes, you can use Sets, I don't think it's better or worse performance wise. Personal preference here :)

  • @jakubhampl4
    @jakubhampl4 2 года назад

    Great video, when will you record the bonus episode what you mentioned about using multiple keys simultaneously, thanks.

    • @Frankslaboratory
      @Frankslaboratory  2 года назад +1

      Hi Jakub. I will do multiple keys technique in the video that comes out next. Its simple

  • @Xyzzzz307
    @Xyzzzz307 2 года назад +1

    Happy new year Frank 🎉🥳🎊
    May God help you achieve all you want in life 🙂🙂

  • @samehzaky
    @samehzaky 2 года назад

    Amazing tutorial as you always do

  • @oboxtechnologies1368
    @oboxtechnologies1368 2 года назад +1

    Wow. this helped alot!! keep it coming frank. Loved the way you are going to teach design pattern using games. quality content bro!!!!

    • @Frankslaboratory
      @Frankslaboratory  2 года назад +1

      Hi, thank you for your feedback, nice to hear someone found my tutorial useful :)

  • @ThunderstruckElectronix
    @ThunderstruckElectronix 2 года назад +1

    Awesome stuff!

  • @Falzer
    @Falzer 2 года назад

    Happy new year! thank you

  • @jakubgadzala7474
    @jakubgadzala7474 2 года назад

    Great video! Happy new year!

  • @ctheart8833
    @ctheart8833 2 года назад +1

    Hello , can anyone show , how to use the bind function in-place of arrow function at 21.00 thank you.

  • @adedoyinemmanuel7802
    @adedoyinemmanuel7802 2 года назад

    Great one frank, I love you videos ✌

  • @arcei5726
    @arcei5726 2 года назад

    the list of tutorials was very usefull

  • @alexkirmel8049
    @alexkirmel8049 2 года назад

    Hi Frank, Happy 2022. Any plans for BFS algorithm? It would be awesome to look your approach to it.

    • @Frankslaboratory
      @Frankslaboratory  2 года назад

      Hi Alex, I would probably use breadth-first search algorithm for a project, rather than to make a special video about it. I will put it on my list and will try to include it in something

  • @romanchutak
    @romanchutak Год назад

    It’s so awesome!

  • @madlink1650
    @madlink1650 2 года назад

    im having a blast with that channel, do u have any discord or community to learn with ? im new to code and any help and source its valuable ^^ thanks

    • @Frankslaboratory
      @Frankslaboratory  2 года назад

      Hi, glad you found so value, no discord so far, might do it eventually

  • @romanisopenko4011
    @romanisopenko4011 2 года назад

    Thank your for your job! It is a great video tutorial!

    • @Frankslaboratory
      @Frankslaboratory  2 года назад +1

      Hi Roman, thank you for this feedback, much appreciated

  • @walidnaceri2571
    @walidnaceri2571 11 месяцев назад

    why on the super you did put standing left, but in the input you check for press right!!? and also the class is standing left, why you check for right!

    • @Frankslaboratory
      @Frankslaboratory  11 месяцев назад

      Hi, can you give me a timestamp for this? I will check. I just released an updated version for this technique. Will use the state pattern again for a new game tutorial I'm working on right now.

  • @jamahashi1411
    @jamahashi1411 Год назад

    Hey. Thank you for this great work.
    I am getting an error while implementing the state.js and I don't know if I made a mistake. So can your share the code with us please in github or somewhere?

  • @sertansantos3032
    @sertansantos3032 2 года назад

    Do you have a link where I can support you with a donation?

  • @modaya3382
    @modaya3382 2 года назад

    Great work thank you !! is there a place where i can find the source code ?

  • @user-wr9ul
    @user-wr9ul 2 года назад

    Can you do a Kaliedoscope effect tutorial

  • @zhiyiguo-u8s
    @zhiyiguo-u8s 7 месяцев назад

    Hi Frank, can u just show me the source code of this video? I just can't found it on your codepen. Thank u!

    • @zhiyiguo-u8s
      @zhiyiguo-u8s 7 месяцев назад

      when I click right or left quickly, the animate will block for a while and I don't know why.

  • @waelfathy2199
    @waelfathy2199 2 года назад

    I love that guy 😍

  • @NileshDadheech
    @NileshDadheech 2 года назад

    Happy new year 💕 in advance 🎉 sir 😊

  • @viktorsarge6285
    @viktorsarge6285 2 года назад

    Awesome as always Frank, but the music in the first few minutes is killing my focus.

    • @Frankslaboratory
      @Frankslaboratory  2 года назад +1

      Hi Viktor. Thank you for letting me know. I will keep the music down next time I'm explaining something that requires focus

    • @viktorsarge6285
      @viktorsarge6285 2 года назад

      @@Frankslaboratory Thank you! Your editing style seems to have changed and I overall like it because I think it might help your channel grow. So with adjusted volume it'll be great.

  • @aidanbenbow6682
    @aidanbenbow6682 2 года назад

    42:30 let's not over complicat things.....indeed!

    • @Frankslaboratory
      @Frankslaboratory  2 года назад

      Hi Aidan, not sure if you are agreeing with me of being sarcastic, this code can be challenging for beginners :)

    • @aidanbenbow6682
      @aidanbenbow6682 2 года назад

      @@Frankslaboratory Yes, it seems like an understatement! The code is complicated, but doable with a bit of practice!

    • @Frankslaboratory
      @Frankslaboratory  2 года назад

      @@aidanbenbow6682 It's a design pattern, I know it's hard to follow how the values travel around, but it does have a solid logic and once you create a mental image it becomes simple. I would like to use this pattern more often but I think it's too complex for beginner coders

  • @sashaleandrofernandezdhaem4185
    @sashaleandrofernandezdhaem4185 2 года назад +1

    What is the name of the game

  • @sharmarahul384
    @sharmarahul384 2 года назад

    You are unique!

    • @Frankslaboratory
      @Frankslaboratory  2 года назад +1

      Thank you Rahul :)

    • @sharmarahul384
      @sharmarahul384 2 года назад

      @@Frankslaboratory Actually I have watched almost all your content and they all are unique and inspiring Artworks! Canvas seems to be a great tool!

    • @Frankslaboratory
      @Frankslaboratory  2 года назад +1

      Wow. That's a lot of videos Rahul. You are dedicated to learning. Great job. Thank you for your kind feedback ❤

  • @prometheusli101
    @prometheusli101 2 года назад +1

    game effects,this is what i expected,but not included in this video

    • @Frankslaboratory
      @Frankslaboratory  2 года назад +1

      You mean the fireball and dust trails? I will use those when I show how to build a full game, this video was focused on state management

  • @_GOUTHAM
    @_GOUTHAM 2 года назад

    Data structures visualization

  • @dvd522
    @dvd522 Год назад

    can you make a platformer game

  • @RonanTI
    @RonanTI 2 года назад

    Github?

  • @worgenzwithm14z
    @worgenzwithm14z 2 года назад

    imagine someone new to html5 trying to debug their images not showing because of img{ display: none; }

    • @Frankslaboratory
      @Frankslaboratory  2 года назад

      I take your point, I should have given that image id not apply it to generic img tag

    • @1kvolt1978
      @1kvolt1978 Год назад

      @@Frankslaboratory Class, not ID. In case you'll need to add more sprites.

  • @1kvolt1978
    @1kvolt1978 Год назад

    Why do you do this strange thing with export-import when you can just load all needed js using tag? What's the point?
    Also now I understand why people started shitting on over-OOP and praising functional programming last years. It's ridiculously complicated for no reason.

    • @Frankslaboratory
      @Frankslaboratory  Год назад +1

      The point was to get used to more modern syntax. You can't use a script tag with React in the same way. Also modular code is easier to navigate in. There is no right and wrong approach here. Up to everyone's preference. You can't always replace functional and object oriented programming to make the code cleaner. If you refactor this code into functional codebase you will find out why. Be more specific about the details if you want to discuss things like this.

    • @Frankslaboratory
      @Frankslaboratory  Год назад +1

      Also this is probably the most complicated codebase on my channel so don't worry if you struggle to follow. I should have made it more clear in the beginning that this is advanced.

    • @1kvolt1978
      @1kvolt1978 Год назад

      @@Frankslaboratory I'm not an OOP hater, don't get me wrong. I just think in this particular case it's possible to reduce amount of classes and it would make code more clear.
      And thanks for replying, didn't know about React (I don't use frameworks).

  • @doctorjcw5857
    @doctorjcw5857 2 года назад

    I need to do this kind of stuff without server, don't always have internet, So I can't use server relient bs, why is every tutorial on the internet all based around stuff you will need internet for, you telling me, everyone always uses internet, even before internet to make games? bro this is bs how tutorial videos always got some side details that are very preventativie if you dont have everything that is in the video. I just want to make characters and sprite sheet, then make the characters do the things I want them to do, and put them in a world I build, not all this server mumbo jumbo, and all this roblox bs, and this stupid unity code spiderweb crap

    • @1kvolt1978
      @1kvolt1978 Год назад +1

      Then just don't use key words "export" and "import", instead load all js files using tag in HTML file.

    • @doctorjcw5857
      @doctorjcw5857 Год назад

      @@1kvolt1978 Thanks, thats a lil helpful. I am still trying to learn coding. All I really know how to do is style, and put together webpages. It is hard for me to understand concepts without them being explained in a way they can actually be used.
      Right now, everything I learn code from, shows me how to code something like:
      Log both apples, and trees.
      const apples = 3
      const trees = 1
      Then your supposed to put console.log() 2 times after they never even asked you to do something like that before. This is a lot more than I knew when I originally left my comment. But holy fkn sht this is a load of useless horse shit in my mind. I need to look at information that actually does things

    • @johnsmith1789
      @johnsmith1789 Год назад

      Once you have downloaded the plugin, "Live Server" the add on does not require an internet connection. It "Acts" as a server would, so that you can test and develop on your localhost:. "Local host" as in your 'local' machine, no internet required.

  • @mrCetus
    @mrCetus 2 года назад

    Happy new year 2022 ❤❤!! Again an amazing video . I learned module, export/import and the way you handled the player states is awesome!