Learn to build an online dual tic-tac-toe game. This game uses Flutter, Node.js, Express, Socket.io, MongoDB and Mongoose. This Flutter tutorial is for beginners looking to get some experience in Node + Flutter. This xoxo game is multiplayer game allowing two users to play at the same time against each other. You will learn to create and join rooms, play realtime without having the need to refresh the screen, display points and create a glow themed UI in Flutter. We will build an app available for Android, iOS, Web, MacOS and Windows!
Prerequisite for this tutorial is just to have a basic knowledge of Flutter & Dart!
Discord Link:
Source Code:
Flutter Clones Playlist:
TimeStamps:
(00:00:00) Introduction & Demo
(00:00:37) Flutter Project Setup
(00:17:07) Create Room Screen UI
(00:26:20) Join Room Screen UI
(00:28:43) Nodejs Intro
(00:33:58) Creating Nodejs Server
(00:45:33) Connecting to MongoDB
(00:51:33) Connecting to Socket.io
(00:57:53) Creating Rooms
(01:32:01) Adding Provider State Management
(01:39:50) Joining Rooms
(02:04:02) Waiting Lobby
(02:16:26) Scoreboard UI
(02:20:48) Tic-tac-toe Board UI
(02:26:16) Displaying X and O Realtime
(02:44:56) Playing According to User Turns
(02:48:06) Adding Animation
(02:48:57) Displaying Turn
(02:51:30) Checking & Displaying Winner of Round
(03:05:51) Clear Board
(03:08:30) Check Winner of Game
(03:14:25) End Game
(03:17:15) Conclusion
Resources:
DebugProfile.entitlements:
Regex for MongoDB ID Validation: /^[0-9a-fA-F]{24}$/
Connect With Me Here:
Instagram:
GitHub:
Linkedin: …
Facebook:
Mail: [email protected]
Medium:
Twitter:
#flutter #nodejs #game
Chen Lay
26.06.2022Seems like good to learn something through this video. 🙂
Ola Okunade
21.06.2022Thanks for this amazing build
Dinesh Bala
21.06.2022Amazing!
Random CS Guy
21.06.2022Working on it right away 🔥👏
Bünyamin ÇİFTÇİ
21.06.2022Really good timing
Bünyamin ÇİFTÇİ
21.06.2022Good job Master
FiNix CODM
21.06.2022Thanks now I won't need to waste paper and ink 😎
Priyanshu
21.06.2022I appreciate your work
Can you please make a Ludo multiplayer game please
It's an request
After board exam please humble request
Okey Shourov Roy
21.06.2022Please make a nodejs flutter apollo-express-graphql project with refresh token implementation 🙏🙏🙏
Btw very helpful video ❤️❤️❤️
fahad aljohani
21.06.2022It’s the best channel for me to learn flutter thanks a lot rivvan
Fahad KSA
Code with Haseeb Ullah
21.06.2022Bro create ma food delivery app with admin panel with flutter and firebase
Ibrahim Mugaibel
19.06.2022Thanks for amazing tutorial!
Android STC
19.06.2022thank you Rivaan Ranwat the best app and video lets go ! please make education app ! 🙂 good luck with your work
Programming Army
19.06.2022The best YouTuber ❤ I hope that you build a small e-commerce app using flutter and node js , mongo db, and hope that you explain file uploads with multer , good luck bro❤
Suleman Khan
19.06.2022Wow another brilliant project.. thank you so much ❤❤
Suleman Khan
19.06.2022I have one request please.. if you make a tutorial on flutter push notification (foreground,background,terminated) with node js..
popbob
19.06.2022I like how some ppl in the comments want him to basically make their entire app for them like wtf
Android STC
19.06.2022Good Game
Infect 3ds
19.06.2022Thank you so much!
waqar ali
19.06.2022Is Node.js or JavaScript basic knowledge is mandatory for this project ?
meek
19.06.2022Thanks for this
Abhishek
18.06.2022Thank You so much for such lengthy and informative videos, it doesn't matter how long you take to create these videos, it definitely teaches tons of things 💯💯 so keep going 🔥🔥
Gojo
18.06.2022Another one… in DJ Khaled voice. Great Job Rivaan.
If you don't mind, can you tell me how did you learn so much?
My lessons 📚
18.06.2022Great one .❤️
My lessons 📚
18.06.2022Can I give a flutter / firebase clone with spotify?
Meraklı Coder
18.06.2022how to deploy this server heroku,
I did it but it didn't work for some reason, can you post a post or something? 😓😪
August
18.06.2022Oww😍! Best tutorial for our best classic game of all time. Crossplatform too🔥🤜🤛.
Prahlad Shaktawat
18.06.2022How to Show multiple native Google mobile ads in listview
Abenezer Erkalo
18.06.2022Whooooo
Somnath Das
18.06.2022Awesome Bro ❤️💥✅
Parvinder Singh Kapoor
18.06.2022please make youtube shorts also
Arjun Arjun
16.06.2022Waiting for whatsapp clone…
George Sgoutas
16.06.2022Another great video Rivaan.
Onur Arda ÖZ
16.06.2022Hey, love your channel.
Can you please make a tutorial that includes maps? As in marking a place or an area publicly on a map or broadcasting live location to a selected user.
Thanks for the great content. Have a nice one.
Aman Singh
16.06.2022Hello sir, can u make video how to make and use flutter push notification with ffirebase cloud functions
Muazzem Hussain Khan
16.06.2022Could you please make a chat app using flutter so that we can use it on Instagram clone you made sir?.. It's so easy to learn things from you because of the way you explains❤️
ゆっくり解説科学
16.06.2022please teach us building "meetup app" with firebase
Aman Singh
16.06.2022Finaalyy completed , However i made the whole game without using MOngo db 🤣
How ever my game can be only plaayed by 2 people at a time as i use local variables in javascript to store my game state.
as i am too lazy to setup and create model in mongodb.
nice tutorial bro
My lessons 📚
16.06.2022How to create a recorded message from flutter. Like whatsapp record message.
Gagan Sharma
16.06.2022Hi, encountered an error "currentRound: ValidatorError: Path `currentRound` is required." while running the code at 1:30:09, so I removed the required property from room.currentRound and now its working. Just wanna know if it was right to do so? or removing the required property will throw errors in future?
Rohan
16.06.2022Bro you are so good at explaining things, I can watch you all day along. Keep more videos coming. Thanks !
HALL OF FLAME NYC
15.06.2022Your tutorials are the best on YT! Please don't stop! Also, please consider making a project with maps!!
Vikash Tiwari
15.06.2022dil se thank you bro ….
A K
15.06.2022Thanks for amazing tutorial!
Benfou21
15.06.2022I am doing everything as you but my io.on( … is not working. Do you know where could come the problem ? Thanks a lot ! And nice video by the way
Andrew Nasef
15.06.2022Awesome Tutor + Awesome Tutorial ❤
Beneficial Knowledge
15.06.2022Thanks
Beneficial Knowledge
15.06.2022Please more videos like this!!!
Beneficial Knowledge
15.06.2022Why did you make some parts of the sockets part blurred i couldn't see it and got stuck
Gabriel-Adrian Staicu
15.06.2022Hi! I builded an APK (work's fine) but I can't connect to the server (changed from "yourip" to my public address and still not working).