I Tried Making a 3D MMORPG Game in JavaScript
Вставка
- Опубліковано 7 лют 2021
- I tried to build a 3D MMORPG (ie. World of Warcraft clone) in this project.
Support me on:
Patreon: / simondevyt
Follow me on:
Twitter: / iced_coffee_dev
Instagram: / beer_and_code
Github: github.com/simondevyoutube/
Here I tried to build a 3D MMORPG, completely from scratch in JavaScript/Three.js/Node.js. I'm not a networking expert, pretty far from it, but I make a stab at it. I took a bunch of code from previous tutorials, like the rpg game we build earlier, threw in some free assets, procedural terrain, and built a node.js backend for the whole thing. The code could server as a nice starting point for someone looking to build a larger project out of it.
The goal of this was to mash together a bunch of elements to get a mmorpg skeleton, using just JavaScript and node.js. All of the bits and pieces of a working mmo should be there, there's some basic inventory and items, stats, fighting, movement, chat, and a world full of npc's. Hopefully from this, you should be able to understand how to use Three.js and node.js to build out this kind of project and build your own multiplayer games.
What I'll cover:
* Getting a basic websocket connection going
* Starting a node.js server
* Sharing code between server and client
* Hacking three.js shaders to inject new fragments
* Adding chat
* Supporting multiple players
* Supporting thousands of npc's
Like always, full source is available, just check the github repo. Go ahead and do whatever you want with it.
References:
mmotidbits.com/2011/03/09/why...
www.ibm.com/developerworks/li...
opengameart.org/content/smoke...
www.donmccurdy.com/2017/11/06...
developer.valvesoftware.com/w...
www.gamasutra.com/view/featur... - Наука та технологія
Have you found my videos helpful or useful? Support me with a coffee/beer on Patreon: www.patreon.com/simondevyt
Awesome stuff once again Simon, just added you to my Patreon list.
Since you worked on Prototype, any chance of doing some procedural or otherwise city type stuff? Cheers!
Awesome, thank you!
I've had procedural city stuff on my list forever, I'd love to take a stab there. IIRC Prototype didn't do any runtime procedural stuff with the city, it was all hand placed. The builds were kinda procedural, but as part of the art pipeline.
Keep up the work and maybe you will have a good mmo.
if i had mney.....
I only support videos that do a walk through you always start in the middle of something on ALL your videos so NO I wont be supporting you if you make a video from start to finish then hit me up.
dreamworld developers be like: holy shit this probably took years
Best comment of the day
Please refrain from using that blasphemous phrase
Dude what you are doing is another level of JavaScript which makes all the other channels dwarves.
ty
@@simondev758 Can't take long for this channel to explode in popularity. Let's try and help it along.
Cool new MINECRAFT video you made there btw!
Yeah we even got some scam spam going! Picking up steam
I love how this kicked off, let’s make WoW in JavaScript.
@@metagen77 true
> CORS error
> "I'm a little ashamed of how long that took"
Oh how I know this feel.
This literally happened to me a few days ago, lolol
Not alone…
Oh this hit me in the feels
not to mention the 20 stack overflow tabs lol
Despite having to handle CORs in many projects: every time it's a challenge
"I will choose the less clever way because its easier"
Basically my programming journey...
Ive seen a couple videos of yours now, and I’m honestly blown away by what you can accomplish in Javascript. Really cool videos, thank you for sharing them!
1 dude makes this in one week and actually looks decent for what it is,
Dreamworld: *Starts to sweat*
I love your videos. They're another level above what's on UA-cam. You really go deeper that any other UA-cam dev I follow and it's really enjoyable to watch. Thanks for making these videos!
No worries, glad to have you around! Let me know if you have suggestions as well
When you gonna release your game you've been hiding that's gonna be the wow killer
It's coming along, just need to design it.
The 2 idiots at dreamworld should take notes from this guy, fo real!
@@muajin 5 minutes into the video it was more complete than dreamworld
@@tada103ify Heck yea!! At least his vid had combat with mobs, stats and a character avatar. Dreamworld is just pitiful...
How his game can kill a dead game?
You are one hell of a JavaScript developer” dont let anyone tell you otherwise!!! Insane!!🔥
This is just AWESOME ! I'm looking forward into JS Game dev, this video makes me believe in myself and wanting to push myself far enough to be able to do what you have done so far
I’m so glad I found your channel!! What you’re doing with JavaScript is top tier!! I’ll start learning three.js!! Thank you so much for your knowledge!!
I loved watching this little demo come together, really cool stuff! Also I enjoyed your dry sense of humor :)
Brilliant work, seriously. Very impressed that you managed to create this in a week.
Your videos are incredible man, thanks for putting them out there. Hope you keep it up!
Again awesome content Simon! Thanks for all your efforts.
np, happy that you're enjoying it!
I've been programming for 10 years..... And I'd give anything to have your level of talent. Excellent work
Time... That is what we must all sacrifice, as well as likely money and emotions too. I've been coding for 20 years and have worked on multiplayer and MMO tooling and some server scripts. I've never encountered one human that has so much of it in their head at once.
@@LewisCowles why dont you make yt Videos
@@LewisCowles It's not time, its dedicating yourself to something you find fun.
i can easily put a weekend into 17 hours a day and its sudddenly monday.
wow. i like how each video is a part of something grand. i first thought the first few videos were just random let's code in js but then again, it all leads to building an MMORPG. good stuff.
Indeed, I love this part of it all. Not just teaching us random stuff, but also examples on how to put it all together.
Thanks! Yeah the smaller ones are all part of what i would consider more fundamental knowledge, but showing you how to tie it together helps ground it, at least that's the thought.
Not a fan of praising, but man. You need to upload more, your approach to the code is so cool. You make it seem that even not knowing something is not a problem. As a junior, i can totally say that you are my biggest inspiration ❤
20 years, most of it in games or at Google. I barely know anything.
@@simondev758 One person definitely can't know anything, but your approach to the problem and working around things that you already know is what makes you special. That's the thing. Many junior devs or programmers just follow the rules instead of making their own approach. No need to climb the tree for an apple, when you can look around and find a branch with an apple that you can easily reach
“Not a fan of praising” lol what ??? Who cares, just praise someone if they are deserving of praise. And Simon is worthy of praise so I’m glad you did
Never heard someone say "not a fan of praising"
You probably misunderstand. This guy, while not knowing exactly how to do something, *knows how to find out*. He has a wealth of core understandings that make evaluating and choosing solutions easier. That is his true skill... and it can only come from years of experience.
More quality content, excellent work Simon! I can't say enough how great it is to see work like this presented so clearly and referenced so well.
This is easily on par or surpassing the likes of Sebastian Lague's work, and it is definitely much more approachable.
Keep it up!
Thx! Sebastian's work sets a high bar
An amazing MMO with a glorious chatbox, Simon! :)
As always, thanks for sharing the great work!
Especially for leaving the "it didn't go well at first" moments: I can very much relate to those.
Hah yeah, every project I make is riddled with those kind of moments.
This deserves way more attention for how high quality it is. Super interesting, thanks for the video!
Glad you liked it!
Excellent! So glad you post content like this!
no worries, glad you enjoyed it!
Wow, amazing. Being a software developer and seeing what you do is just astonishing.
Big game dev firm: "Creating an MMO is the hardest thing a game dev can do"
SimonDev: "Hold my beer"
Wait, I need that beer for while I code. Give it back.
@@simondev758 hahahaha
I mean this is barebones as can be… in a big firm you would also have a full fledged CMS, security features, proper menus, UIX, etc etc all expensive cause time consuming…
@@Etienne_H Yes, security implementation and user account management alone can self-destruct an entire game project. Even when made by 'big name' companies. Apparently Blizzard's project Titan was total crap when it came to this. Not to mention how project Titan always looked kind of like trash in terms of art direction and game design anyway. But it might be unfair to judge a completely unfinished game.
@@PHeMoX Obfuscation in the code in Rift caused it to run like absolute dogshit. Graphics were still amazing for the time and hold up well, but Trion's security implementations ruined the performance of the game and caused so many people to quit. Very important to get it right.
Great as always! Thank you, Simon! :)
My pleasure!
This is very impressive given the timeframe and all the challenges you faced. Great job!
Thank you for the work you put out! I like your video style!
legendary content again, and the fact that you code it in JS is humiliating. I started coding since covid, so I hope I can come back to this video after a couple of years and understand it deeper. I wish you did an introduction or a pre-career-overview video, maybe it would be too boulevard content comparing to your other godlevel videos, but I would watch it..
Yeah I've been thinking about doing one, still figuring out how I want to do that
Respect bro. I also started coding during quarantine. I was bored, so i googled how to make games and everything started from there.
Very captivating to watch these "build in one-week" type videos, where every feature is a huge step forward.
incredible, you are an inspiration and also you are an excelent narrator
Super cool. I'm psyched you are doing this. As a developer that has played minecraft and runescape I've always thought it would be cool to build some kind of MMORPG in javascript (though I'm not yet a JS dev).
Amazingly impressed. I wanted to make a mmorpg of my own but this genuinely just showed me that I don’t have the dedication
Imagine chronicles of eleria needed 8 million to make a game like this.
They wish they had something like this
Tey needed 8 million to pay their own wages to f*** around and make some half assed shit... lol
It wasn't even a game, but a 3d video showcase.
*Hides 200$ pledge I made when I was 13* It’s in the past.
@@zeektm1762 I bought Cube World Alpha so don't feel so bad
I just started a web development course recently and my next module is javascript and your video makes me SO STOKED to learn! Great job. This was so cool
Nice! I'm not actually a JS guy myself, kinda just screwing around here, but you can get a lot done in the language.
awesome to see how you combined things from different tutorials to a somewhat big project and made it all work.
Great exercise! Appreciate the effort!
Enjoyed the login screen as well!
I had another version where I tried to remake the scene using lego and some action figures
So entertaining to watch you work through this, sick job!
Thanks! Glad you enjoyed it
This is so sick! These are some things I didn't even consider were possible with javascript. Great video :D
This is an awesome experience and brief introduction to networking for games!
You make it look so easy, it is inspiring
thx!
Your projects are cool, always.
thx!
thank you for spending time creating the game and sharing it with others. appreciated.
I believe the character blinking issue is related to camera position and its viewport distance related. Provided that you are one heck of a developer. Subbed and liked.
Awesome vid as always!
I was wondering, if you could make a video on how to structure code of a "more complex" game. Ideally for JS/not using an engine, but even if you could talk a bit more broadly about any experience using different structures would be super useful. I feel like you have so many specific topics & use cases here, but in my experience we all sooner or later fall into the "how can I make my code more modular & be able to reuse it better" situation, and some thoughts on this would be great!
I.e. say using canvas/three.js, and there's a game that has tanks, projectiles, active skills and research upgrades that can affect various attributes of all those, is the best way to typically stick with classes/methods that describe data and functionality of each of those, or rather writing something more general i.e. an "attribute class" that you can then add/remove/adjust to each of the objects.
Or another example, say I wanted to handle attach/handle animations to objects, add particle effects to them etc. - I.e. tank fires a shell, that creates a muzzle flash animation, and then hits another tank - should i.e. damage that shell deals be stored in it, or in the tank and the shell having a reference to it?
Or going further, some best practices for creating UI more modularly, or in-game events/listeners etc.
Sorry for a huge question again, but I just wanted to illustrate with a rough example - I know it is a broad topic and can vary from game to game, but a video on such a topic would be awesome!
Huge questions are great, and this is a really good one. I've been kicking around ideas for videos in that space, things that draw on more than just technical problems. I've added all your questions to my "ideas" doc. Give me some time to figure out how to present these kind of ideas, and in what format. I do want to tackle things that help everyone become more "rounded", so to speak.
@@simondev758 Sounds awesome, thank you! Whenever you can manage will be great (well ideally in 2021) - I know you're getting a ton of request, but tbh it's your fault you make great videos :P
Man, the game isn't even out yet and there's already speed hackers.
What a dope vid man. BIG RESPECT!
This was really great. Good job!
This man really said "I don't really know how to make an rpgmmo, but here we go" and makes an rpgmmo
Awesome video! Really impressive stuff, I enjoyed it. I really want to learn ThreeJS but coming from a frontend environment and some backend experience I have no idea where to start.
You can just head to threejs's website and start with their examples, that's what I did. I probably should be recommending you my own videos, so I also have beginner tutorials covering the basics, and these bigger ones just tie stuff together that I've mostly covered already.
@@simondev758 Thanks, I will look into yours aswell!
Amazing stuff, really! Only thing that I'm kinda sad not being covered is the process of deploying the server. Other than that really an impressive compilation of all kinds of technological fields, each with it's own rabbit hole to go down! I subscribed!
I'd like to revisit and take another run at this, and I'll make sure to add that.
Brilliant video. I wish this was hours long.. Highly relaxing and informative. Nice to see some WoW, too.
more promissing than dreamworld
hey, you did more in a week, than "dreamworld" in several month with a 70k kickstarter campaign :D. Great Job
Nice work, great video. Thank you for walking through this. :)
This is a very interesting project. I can't wait to see what you come up with.
Wtf man, i don't even know this was JS possible.
Great job, i'll dig up your files and learn this for sure.
I was considering the same :p
Single handily giving young creators all the resources they'd need to create an mmo, tysm.
It would be really cool to see someone take my work and build something
@@simondev758 I am having problems with generating all the node_modules from the package-lock.json. do you know how this works?
Just discovered your channel, and a great video!
A couple of challenges you can come up with if you ever want to do future videos on the MMORPG project:
- Optimising the data sent between server and client. Think quantization of location vectors, only sending data that has changed
- Determining relevancy: only send information about entities to a client if they actually need to know about them.
These will be crucial, or you'll quickly find that the networking solution won't scale to the hundreds of players you need for an actual MMO :-)
JS rocks, and you SimonDev, rock too - it's truly impressive (one week!), yayy!
I knew I wasn't the only one who uses 'Bob' for my user-placeholder when programming XD
lol I have no idea why it's the goto name
I use Bob Cobb personally.
I use bob for everything too
Don’t forget Alice
John Doe
This is a perfect example for the "Draw the fucking owl" meme.
"Just googled socket.js and wrote the fucking server." I swear, that's what he said
ive been learning three.js and you are making very fun
This is incredible! Very inspiring!
The game making is fun, you made it even more interesting with story telling way of making. I realized now MMORPG takes a while to build.
awesome, glad you enjoyed it
This video is highly underrated. needs more likes
Heh thx!
This is an excellent work. You have showed us the absolute power of JavaScript!!!!. Keep it up
Wow this is really good! I am not a games developer but have worked in the app and web development space for over 10 years. I experimented with HTML cavnas when it first came out and managed to make an isometric tile based game but this is just incredible. Especially considering you say you are mainly a graphics guy.
ah yes, this is the new triple A world of warcraft killer game i have been hearing so much about
"This guy blinks in and out of existance occasionally"- Aren't we all? :D
That's deep
This is awesome! Great job
I love them monotone, but funny as hell comments in-between. Like, when describing "there are these two monsters that look like this and that... i took both"
:'D
really enjoyed this video :)
This is awesome. That Entity Interpolation is the secret sauce.
As barebones as this is it is still leaps better than some of the MMOs covered in Josh Strife Hayes "Worst MMOs" series.
That was epic. Thank you for sharing your knowledge.
np!
As someone aspiring to learn programming and want to take the dive into becoming a game dev, this video was so fun to watch!
This is the kind of video that you watch as an up and coming programmer and you start to thinki that programming is nothing for you since u can't even do 1% of what this guy is capable of. But as a junior programmer myself I can guarantee to anyone that even with 0,1% of skill of this guy, you'll make a good income as a dev.
We were all junior developers at some point :)
Exactly what I was thinking
dude, i understand almost everything this guy did, and did myself those code... the logic is not problem to me, but deal with companies are, soo my income as a programmer and even job as a programmer is a fucking pain in the ass to me, even with a over average incomming from my skills (to work, because i use most of my free time playing and creating small game projects), time working with programming, are 10% higher than average programming income, but, i not had enought courage to drop from my job that i not like and try be a game dev in any level, i live into a country that work with games or even be unployed is really though yet
Thats pretty hilarious that anyone would think its nothing for them because they dont do something instead of thinking holy shit there are some fucking layers to this I can go to if I put the work in, which actually makes sense, instead of some defeatist attitude where you think that this guy was born with programming abilities and knowledge or w/e
I am programming for around 12 years now. In the past 5 years I made around 4500USD total. No idea what you guys are doing to get good income, nobody wants me cause I have no degree in actual programming, mathematics or what ever paper they want otherwise :D
I can see some solid work done here. The only thing I'd like to ask about is what were arguments for making it in JS? I mean you're a pro and I wonder what made you considering to invest so much time in learning JS ecosystem.
I am subscribed for more :)
I'm just doing this in my spare time, invested about 0 time in learning JS itself. What I find fun is learning concepts and new approaches, and JS makes it easy to quickly try out an implementation. I could just do this all in C++, but it would take longer.
@@simondev758 so I can think about it as a time-to-implement-a-feature factor, right? I'm curious if there a place for JS to become a major tool in making modern 3d games running in the browser. I think it would mostly depend on how JS to WebAssembly relations will evolve and what would be a cap price for the 5G internet on the market, but these are just my thoughts.
Thank you for replying.
@@mona.supremacy Yeah I'd agree, I mean not every game absolutely has to have the max performance that something like C++ offers. Development time, features, those all factor in. If JS is the right match, why not? I'm kinda curious if it can scale to that, which it seems like it can.
In log in screen, you can add text box button and background-image in one
Yeah I need to up my html game, it's super weak.
This is fantastic. I don't think I've ever clicked the Subscribe button faster. Amazing work here.
I was like "Wow!" when I saw the spell casting effect. lol
hah, I figured I needed at least one not-terrible effect.
Oh man this is going to be good, I haven’t even watched it yet. First project with networking?
I've messed around a bit with networking before, but I'm far from an expert. Next time I'll just use a higher level library, but this was fun.
@@simondev758 sorry, I was a bit busy with life so I didn’t watch this video yet when I commented. It does have networking ! (I meant first project on this channel with networking) and haha you ran into some of the problems I had. The animations going through for one player but not the other.
Dayum, finally i made it run on VS 2019 lol, got some knowledge of javascript but zero from NodeJS so i kinda peeled my knees there but made it run. Got some issue with the terrain menu but ill check it on later. Great work!
Incredible tutorials, thank you
sorcerer is overpowered ! :p (thanks, great project !)
Next update, she's getting nerfed.
This guy's js in on a whole different league
I have just started watching this, but: You madman! You true and crazy madman.
All the best
Nice. Starting understand how a multiplayer works, what are challenges and solutions.
As always awesome tutorial.
thx
Thought this was madseasonshow for a second. You really sound like him! Amazing video, very inspiring.
If I ever make a Wild West game I'm casting you as the old prospector who gives life advice to the protagonist.
Man. This thing you just made. I see you, and then I see myself struggling with typescript, and I'm completely ashamed. I need to git gud ASAP. Thanks a lot for your content. It really motivated me!
nice video man. appreciate all the knowledge in only 16 mins
Great stuff! I don't seem to find the right repo on GitHub, did you uploaded it already?
Needs cleanup first, next couple days.
Light years beyond Dreamworld
Great work man!
That green hand effect is something else. Hell yeah, I love it!
You forgot the overpriced cash shop!
So this popped on my discover page. I’m no programmer, but man. After watching this i’m considering of learning it.
Thanks! I consider it a pretty huge win if I can get someone other than a programmer to set through this, heh.
@@simondev758 yeah! Definitely. And fun fact I did watch ALL the video without any understanding of programming and didn’t even fast forward it. Whoa!? 🤣
pretty amazing, so much potential. if i made an mmorpg it would be all about mobility and movement and you could do literally anything while moving and have like 3 dash moves and a super fast mount ect
Simon, you are a pearl in this ocean. People actually doing work are so rare. It is easy to record yourself with a cup of coffee and some game titles behind your back while saying what you think about this or that.
If youtube was full of people like you, ubiversities around the wolrd would already be disappearing.