Create Multiplayer Tic-Tac-Toe game with React-js, Node-js, Socket-io | Project tutorial in hindi

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

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

  • @patrik_bajzik
    @patrik_bajzik 2 месяца назад +3

    Even tho I understand nothing, everything works perfectly. Greetings from Slovakia 🇸🇰

  • @javabrain8480
    @javabrain8480 8 месяцев назад +3

    In 33:30 when i changed renderFrom to gameState my entire div is missing from the website.

  • @golumaurya7441
    @golumaurya7441 5 месяцев назад

    best project sir and audio quality is also best

  • @sahil007-d2h
    @sahil007-d2h 9 месяцев назад +2

    easy and efficient game logic and superb explaination , can you make a tutorial video for deploying socket IO app on any free hosting platforms like vercel or other ?

    • @arrayofsilicon
      @arrayofsilicon  9 месяцев назад

      Yes next video will be soon out on deploy

    • @JEETRICO
      @JEETRICO 4 месяца назад

      Can we extract the apk version of this web application???😊

  • @harsh_pathak27
    @harsh_pathak27 7 месяцев назад +2

    Hey! bhai kya hum ismein matchmaking aur rooms bana saktein hain? agar aap isko extend karkein ye sab banaye toh achha rahega! Great Work Bro!

  • @user-ml2hk1hv2u
    @user-ml2hk1hv2u 10 месяцев назад +3

    bro can you make a small 5-10 minute tutorial video on how to make the code work from the github source code cause i watched the whole video and followed the steps but nothing happened so please make a video where you download the svg icon code the other code from github and make them work in visual studio code.

    • @arrayofsilicon
      @arrayofsilicon  10 месяцев назад +1

      What problem is coming in your case?
      Can you tell me in details
      I am mentioning some steps to setup project from GitHub
      ⭐ Download project from GitHub
      ⭐ In both folder (server and client) run a command npm install
      ⭐ After that run this command :- npm run dev in client folder
      ⭐ Than run this command in server folder:- node server.js
      Make sure that you have installed node-js on your machine download 18 or 20 version of node
      Follow this steps if any error come than tell me in comment
      Thanks 🙏

    • @user-ml2hk1hv2u
      @user-ml2hk1hv2u 10 месяцев назад +1

      ​@arrayofsilicon now I get it I'm just starting coding and learning node js and stuff that's why I cloudnt figure it out. Thank you

    • @user-ml2hk1hv2u
      @user-ml2hk1hv2u 10 месяцев назад +1

      @@arrayofsilicon Also a quick suggestion that if you want to do it, you can teach others aswell as me is to make a play again button so both player dont have to manually start a new game and also you can make a line going through the circle or cross depending on winner as done in traditional tic tac toe game. I think it would be a great video to do that in this game. And thanjk you for making these videos

    • @user-ml2hk1hv2u
      @user-ml2hk1hv2u 9 месяцев назад +1

      ​@@arrayofsiliconWhen will the next chess video come?

    • @JEETRICO
      @JEETRICO 4 месяца назад

      Can we extract the apk version of this web application???

  • @AKSHAYVAYAK
    @AKSHAYVAYAK 10 месяцев назад +5

    Nice video sir

  • @bidyasagarmohapatra4014
    @bidyasagarmohapatra4014 21 день назад

    you dont tell about when user.playing state will true, so when a 3rd user is coming to play then it automatically pair is existing playing player

  • @codingpanda8819
    @codingpanda8819 9 месяцев назад +1

    can we deploy it........???????????
    It is also a very important part....

    • @arrayofsilicon
      @arrayofsilicon  9 месяцев назад

      Yes next video will be soon out on deploy

    • @arrayofsilicon
      @arrayofsilicon  8 месяцев назад

      ruclips.net/video/Vt9qqnUG0iE/видео.html

  • @memesdhamall
    @memesdhamall 4 месяца назад

    How to deploy on vercel?? I deployed but backend is not responding, frontend is there only

  • @tryxie2898
    @tryxie2898 11 дней назад

    52:19

    • @arrayofsilicon
      @arrayofsilicon  9 дней назад

      What happened ?

    • @tryxie2898
      @tryxie2898 7 дней назад

      @@arrayofsilicon oh, nothing. i was just putting it to remember where i stopped watch

  • @jyotitanwar2526
    @jyotitanwar2526 4 месяца назад

    i followed all steps but my socket.id key equal hi aa rhi h jiski vgh se waiting for opponent hi show kr rha h humesha... ho to resolve it

    • @arrayofsilicon
      @arrayofsilicon  4 месяца назад +1

      Please once refer to code in GitHub link is in description of video

  • @techmillions8047
    @techmillions8047 9 месяцев назад

    Sir my formal request from you please make a video on next js and next auth and mongodb with typescript with users roles.

    • @arrayofsilicon
      @arrayofsilicon  9 месяцев назад

      sorry but i have done till react and node i have to do the next js will sure look into it in future

  • @JSDev776
    @JSDev776 7 месяцев назад +1

    Vite is a French word for quick so It's pronounced as "veet" not "vyte".

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

      I am happy using white 😂

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

      @@arrayofsilicon as you wish! anyway thanks for the video , i am making a multiplayer card game called 29. and used this video as a starting point.

  • @nayankamble5911
    @nayankamble5911 8 месяцев назад

    Bro, It's not changing color if winning elements are diagonal. What to do?

    • @arrayofsilicon
      @arrayofsilicon  8 месяцев назад +1

      I have provided code with GitHub link please refer that one time

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

      In the first diagonal dynamic, paste this in upper line of return function - setFinishedArrayState([0, 4, 8]);
      and for second - setFinishedArrayState([2, 4, 6]);

  • @noorsworld3263
    @noorsworld3263 4 месяца назад

    Thank you for the project, project is very good but the code seems a little messy.

    • @arrayofsilicon
      @arrayofsilicon  4 месяца назад

      Yes, you are right I will try to make other projects code good

    • @arrayofsilicon
      @arrayofsilicon  2 месяца назад

      Hello, watch this video i have created a single video for making multiplayer chess game with html css js jquery(sometimes) socket and node
      See :- ruclips.net/video/zmfuLIbFJCc/видео.htmlsi=sSC5Gnd2mHiVnMdh

  • @JEETRICO
    @JEETRICO 4 месяца назад +1

    Can we extract the apk version of this web application???

    • @arrayofsilicon
      @arrayofsilicon  2 месяца назад

      i don't know this thing have to look

  • @pradyumnakumarnaik5881
    @pradyumnakumarnaik5881 8 месяцев назад +2

    how can I deploy this and play with my friends please reply

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

      Either have your friend and yourself connected to the same network or buy a webserver where your setup the website and databases.

    • @AvikNayak_
      @AvikNayak_ 5 месяцев назад

      Render

    • @arrayofsilicon
      @arrayofsilicon  2 месяца назад

      Please checkout this link i have created a deployment tutorial
      ruclips.net/video/Vt9qqnUG0iE/видео.html&lc=UgxQYQndkPKehL1RUPt4AaABAg

  • @SuperChiefToad
    @SuperChiefToad 8 месяцев назад

    hey i want to ask if I can make it online so i can play it with my friend . wherever we are in the world . I have made my own while watching your whole video now i want to know how to make it online

    • @arrayofsilicon
      @arrayofsilicon  8 месяцев назад

      Please Check This Tutorial i have created how to deploy means making it live on linux server :- ruclips.net/video/Vt9qqnUG0iE/видео.html
      you will need a server i recommend using linode (www.linode.com/) they will also give you 2 months free trial with $100 credit so just take a trial version and deploy with the tutorial

  • @i_am_groot3787
    @i_am_groot3787 8 месяцев назад

    can deploy it

    • @arrayofsilicon
      @arrayofsilicon  8 месяцев назад

      ruclips.net/video/Vt9qqnUG0iE/видео.html

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

    How can we deploy this ?

    • @arrayofsilicon
      @arrayofsilicon  2 месяца назад

      i have created video on deployment too
      ruclips.net/video/Vt9qqnUG0iE/видео.html&lc=UgxQYQndkPKehL1RUPt4AaABAg
      checkout this thanks

  • @mkunboxing
    @mkunboxing 9 месяцев назад

    I will try this hope everything works

    • @arrayofsilicon
      @arrayofsilicon  8 месяцев назад +1

      Best of luck! tell me more about it after trial i have mentioned my insta id under video btw thanks for watching

    • @mkunboxing
      @mkunboxing 8 месяцев назад

      Thanks bro for replying never stop replying of your viewers

  • @swatibhardwaj579
    @swatibhardwaj579 8 месяцев назад +1

    Hi, need assistance, at 2:25:25, how are you getting the opponentPlayer.playerName in server.js file as it is not stored anywhere.....Thank you in advance
    if(opponentPlayer){
    opponentPlayer.socket.emit("OpponentFound",{
    opponentName:currentUser.playerName
    });
    currentUser.socket.emit("OpponentFound",{
    opponentName:opponentPlayer.playerName
    });
    }

    • @arrayofsilicon
      @arrayofsilicon  8 месяцев назад

      have to check in depth will tell you in sometime

    • @arrayofsilicon
      @arrayofsilicon  8 месяцев назад

      socket.on("request_to_play", (data) => {
      const currentUser = allUsers[socket.id];
      currentUser.playerName = data.playerName;
      Whenever user it connecting or requesting to play the username is taken from the frontend side I mean we are sending it from frontend site and we are storing it in an object of user which is pushed into users array

    • @swatibhardwaj579
      @swatibhardwaj579 8 месяцев назад

      Thanks for the reply, I get that however I am confused as its not being pushed into allUsers object anywhere in the code. Now I took the code from github and working fine for me.

    • @arrayofsilicon
      @arrayofsilicon  8 месяцев назад +1

      @@swatibhardwaj579 okay Thanks subscribe the channel

  • @mkunboxing
    @mkunboxing 9 месяцев назад +1

    Can u convert this to react native pls

    • @arrayofsilicon
      @arrayofsilicon  8 месяцев назад +1

      i don't have enough knowledge about react native but definately see in future but you can try in react because i think both are same mostly logicwise

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

    It will be better if you used rooms to manage players

  • @harshayyy9
    @harshayyy9 9 месяцев назад

    can u show deploy

    • @arrayofsilicon
      @arrayofsilicon  9 месяцев назад +1

      Yes next video will be soon out on deploy

    • @arrayofsilicon
      @arrayofsilicon  8 месяцев назад

      ruclips.net/video/Vt9qqnUG0iE/видео.html

  • @itsYourType313
    @itsYourType313 10 месяцев назад +2

    # missing h isliye nhi a raha tha 😅

    • @arrayofsilicon
      @arrayofsilicon  10 месяцев назад +3

      where? can you tell me? i want to fix it

    • @kamee211
      @kamee211 10 месяцев назад +1

      ​@@arrayofsiliconYou fixed it already dont worry 7:37

    • @arrayofsilicon
      @arrayofsilicon  10 месяцев назад +1

      Thank you so much

  • @prasenjitdas4134
    @prasenjitdas4134 9 месяцев назад +1

    Please show the deploy

    • @arrayofsilicon
      @arrayofsilicon  9 месяцев назад

      Yes next video will be soon out on deploy

    • @arrayofsilicon
      @arrayofsilicon  8 месяцев назад

      ruclips.net/video/Vt9qqnUG0iE/видео.html

  • @javabrain8480
    @javabrain8480 8 месяцев назад

    Noce video but you are taking too much time on things which don't matter and hurrying on important concepts.

    • @arrayofsilicon
      @arrayofsilicon  8 месяцев назад +2

      Sorry 😔 I will take this point in consideration from next video

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

    Brother my name is Eisa Khan 14 Years Old Boy
    brother i always click on ad of education/coding video because with that they can get some finential help
    so you guys also do this
    भाई मेरा नाम ईसा खान 14 साल का लड़का है
    भाई मैं हमेशा एजुकेशन/कोडिंग वीडियो के विज्ञापन पर क्लिक करता हूं क्योंकि इससे उन्हें कुछ आर्थिक मदद मिल सकती है
    तो आप लोग भी ऐसा करें
    Thanks Love from INDIA, up,maharashtra