Building A Game with Phaser JS and NextJS

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

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

  • @ecwb
    @ecwb Год назад +8

    Looks great, I like how you have combined a solid application framework like Next JS into your application and leveraging a game engine within it, fantastic!

  • @dc_dalin
    @dc_dalin 2 года назад +6

    Solid! I've been looking into JS game engines as well. Phaser looks neat

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

      Its great! highly recommend

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

    very helpful, thankyou

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

      Glad you found it helpful!

  • @daniyal6710
    @daniyal6710 6 месяцев назад

    Hey,
    Hope you're doing well. This video is super helpful! I just have a question one question regarding the usecase I'm trying to address.
    So I have an existing nextjs 14 app. My game dev team have shared a build for the game which is made in phaserjs. How am i supposed to integrate (or embed) the build into my app so that the game can run?
    I'd appreciate some assistance, thanks!

    • @yxgen4
      @yxgen4  6 месяцев назад +1

      Hey Daniyal, I'm not sure about the Phaser HTML export, but I think you could host the JS bundle of game in the /public folder and link to it on the page where you want the game to load

    • @daniyal6710
      @daniyal6710 6 месяцев назад +1

      @@yxgen4 Yup, got it working. Thanks!!

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

    i've heard of phaser3 it's been used in one of my favourite online games but i'm trying to make my own web game in HTML5 using pixi or create js both options for me are complex and can't do it i think phaser3 was supposed to be more simplified

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

      Phaser is definitely easier to digest than pixi or create js. I highly recommend using phaser to create a game, especially if its your first game

  • @a.skamander
    @a.skamander Год назад

    Hi! Perhaps you can help me. Do you know how to remove this colored border around the character?

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

      Hi there, if by colored border you mean that pink box, then that will be removed by removing the develop prop in the phaser config

    • @a.skamander
      @a.skamander Год назад +1

      @@yxgen4 Oh, thanks a lot for your help! I did it!

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

    Hi :) Can you please say if there is an option to make the whole game in one HTML file not adding JS one? I saw some tutorial on phaser web but nothing more…

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

      Unfortunately, there's no way to have interactivity without javascript! The HTML and CSS would just be static elements on your page

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

    Hey man, what's your vs code theme? Also great video, helped me a lot on my project...

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

      1984 theme -- cyberpunk !
      marketplace.visualstudio.com/items?itemName=juanmnl.vscode-theme-1984

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

    Could you give your github project link?
    i don't understand some things, and i think if i see project, i can understand

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

      Sorry Lucas, I'm not sharing the github publically, but I've linked a github in the description that is extremely similar
      cheers

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

    Have you got a source code?

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

    Amazing explanation! Would you upload a sample code of this any time?

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

      Thanks for the comment!
      I've updated the description with some helpful links

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

      @@yxgen4 Thank you!

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

    Hey amazing video there! Could you please link us to a repository of your project so that we could follow up?

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

      Hi There! I'm not sure I'll be releasing the repository publically, but I've linked some helpful repositories in my other videos

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

      I 2nd this! Super helpful video, the code would be super helpful to have as a reference. Working on integrating React with Phaser myself ATM, and there's very little out there on the topic

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

      @@wesleygrant2245 Hi Wesley, thanks for the feedback! If you have any specific questions about it let me know and I'll try to answer in an upcoming video.
      Right now I'm wrapping the phaser creation in a useEffect so it only loads on the client. That's pretty much all the setup you need, although I do cover passing data into phaser in another video

  • @brutal4815
    @brutal4815 3 месяца назад

    You are cute

    • @yxgen4
      @yxgen4  3 месяца назад

      Thank you! Haha

  • @denisblack9897
    @denisblack9897 7 месяцев назад

    I’m so sad everyone and his mom do “tech startups” now…
    I wasted all my childhood and youth in front of a screen learning this stuff only to get lost in a tsunami of black t-shirt guys making bullshit videos and portfolios 😅

    • @yxgen4
      @yxgen4  7 месяцев назад

      Sorry you feel that way! Thanks for your perspective

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

    Dude where'd u get a duolingo plushy?

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

      They have a store !