Coding Minecraft in JavaScript
In this project I explored coding Minecraft, making a voxel world, adding procedural terrain, and some basic biomes (using the three.js 3d javascript framework). This is a relatively simple game, since programming Minecraft in JavaScript doesn’t require a lot of code, so our clone’y Minecraft implementation only consists a half dozen files making it easy to follow.
I’ve done a pass to try to make the code readable and easy to follow. Can’t promise that it IS, or that the code is bug free, but its all available online on github. Feel free to grab it, fork it, laugh at it, etc.
What’s covered:
* Starting Considerations
What things I took into consideration before starting coding Minecraft, how I planned out the rendering, what alternatives I considered, and ultimately what route I went with and why.
* Features
Using the voxel renderer, what basic features I decided to add from the game and how they were implemented. Our Minecraft implementation isn’t complete, but it’s functional and gives you an idea of how to add more features.
* Tweaks
Finally, went over some tweaks like how the landscape was developed, some visual additions I thought were lacking.
Github:
Note: You’ll need to add graphics since I didn’t distribute those with the code. I tried out a bunch of random minecraft texture packs, here’s a couple that looked really nice: and
#minecraft #gamedevelopment
MrManiac
24.04.2023Hey man, I just wanted to let you know that since you're programming this with webgl, you're going to want to use VAOs, 1 per chunk. You basically pack all the blocks for a given subset of either 16x256x16, or 32x256x32, or some other chunk size together and build the vao. Each block will be have the same vertex data but will be offset by it's position relative to the origin of the chunk. You're also going to want to not add the quad faces of blocks that aren't touching air, and as a final optimization you're gonna want to disable rendering on any chunks outside of your fov.
lolcatw
22.04.2023Rewatched this video like 4 times, not even joking. Im glad i came across your channel. Im gonna try make my own, for learning purposes. 🙂
twosides
22.04.2023I know Lua, wanna make a MC mod so this will help, subbed
Gabriele Coco
22.04.2023I'd like to know how you programmed the chunk generation
Loligarchy
22.04.2023dude this is really cool
also, could you retexture it using real minecraft textures? it would be really cool to see what it looked like
Jason Mai
22.04.2023Your code doesn't work, the link is broken
Kun
22.04.2023is there a way to convert an existing world into javascript?
Hritik RC
22.04.2023I'm creating a series of tutorials on how to make minecraft in javascript, so far it's going great 🙂
Here is the first video : https://www.youtube.com/watch?v=eMNdWrx4OPg
Jesse xD
22.04.2023Cool! How is everything 3D? Are you using any game engines?
Hritik RC
22.04.2023For the sake of everyone's questions, I just wanted to tell you before you ask Simon that when you download the program, to run it, you have to run it as a server. So the best way to do this is to go to terminal (if in mac), or command prompt (if in windows), and then, change directory to into the folder and type in :
python -m SimpleHTTPServer
This will create a simple server using python, so make sure you also have python installed 🙂
Then go to the web and type in localhost:8000
Hritik RC
22.04.2023Hey Simon. Sorry for asking this again. I must say, you have done a great job! I just downloaded your code and tested it out! I loved how you loaded the chunks at the start! I just wanted to know, how do you load the chunks and have such a high render distance and somehow not make the game lag? I would love if you answered to this 🙂 If you give me the right answer, I will mention this channel in my next video 🙂 Thanks a lot!
Emman Urbano
21.04.2023Good Day bro Can u teach me how to use js in code builder minecraft education
TheGreenlett's Mind
21.04.2023This is pretty cool!
but how did you code it using javascript?
Damaq dadı
21.04.2023👆💯👍💯🙏🙏🙏🙏
fefenex
21.04.2023why javascript and not just plain java , or even Processing v3
WatermelonIce
21.04.2023Hey Can You Give Me The Source Code Of This Please
Diego De Vita
21.04.2023hey man love the vid, I have trying downloading it on my school computer but I cant seem to be able to run it on chrome. I currently have a ChromeOS , it would be amazing if you could help me out with running the game on my computer. My email is deezdude2005@gmail.com , but feel free to reply to the comment and we can connect. Best regards, Diego
Jack Jackson
21.04.2023This is actually fucking insane; excuse my french.
But as an amateur programmer, I recognize how actually bananas it is that you did this.
This is a work of art as far as I am concerned.
I like car oil
21.04.2023i really want to start learning java script but it seems limited to just browser games , at least thats what i think , can this run as a exe file or does it require a browser to run?
OMG My world
21.04.2023Amazing video, please keep up your explanations are amazing!
Bilal
21.04.2023Cool
Valence Football
19.04.2023Can you pls make a tutorial on how to make a 3d game in js? I am competing in a completion rn, and I want to be the only one with a 3D game 😊
Sneh Parikh
19.04.2023ur smart
AerfudaX
19.04.2023the old coding language that is good for games is javascript, C#, C++, or maybe if you know there's other
Solomon
19.04.2023U r lowkey and tf noone subs to you
HasanH6
19.04.2023why when i run it it show black??
HasanH6
19.04.2023black screen i open index.html and its black screen sorry am new to this
metagen77
19.04.2023Do you really reply to every single comment? Where do you get the time? You didn't write AI to do it for you, did you?
KoMaHu3λM
19.04.2023keeping those algorithms happy…
Callum Kedward
19.04.2023Where do I get javascript
Harmit Chhabra
19.04.2023Hey! Can you help me get started reading the code? Like from where to start reading the code? And in what order will it make sense? Sorry I am just starting as a dev.
iamb0
18.04.2023I downloaded the SimonDevCraft thing and somehow it's not loading anything.
PETER PAN
18.04.2023i dont like that the blocks have no shadow texture so im gonna down vote !
luaa
18.04.2023In this part of the video: 6:44 you dont really need an advanced rendering engine, instead you can just hide the blocks that are bellow the player, but with the ones above (or visible) to the player are the ones that can be visible to the player, and if the player updates the world (breaks or places a block) you just need to show the blocks that the player can only see. Simple!
Rohit Chowdhary
18.04.2023Can you please do it as a tutorial
Hritik RC
18.04.2023Hey Simon,
I’ve probably watched your video 10 times now 😅 (it’s so good!)
I’m just a bit curious on how you made the instanced meshes (that being each chunk) have different textures for each instance? So, how did you make a sand texture and a grass texture in the same instanced mesh. I thought that instanced meshes allow you to only put one common texture.
Fredgast
18.04.2023im trying to open the index file but i get a cors error :/
J G
18.04.2023How is instancing of the boxes, any different than drawing all the boxes? I don't understand how that would be different and change the PC load, making it run better? 2:40 (also, your framerate drastically improved in the video at that point.. which implies that at that point you changed it to instancing of the boxes)
Apeiros
18.04.2023YOU
ARE
AWESOME
GKV1
18.04.2023how to make javascript in notepad++
GamingFrazix
18.04.2023Me: Mom I Want Minecraft
Mom: We Have Minecraft At Home Honey
Minecraft At Home:
No I'm Not Sending Hate Or Anything It's Good The Game Looks Good It's Just A Joke ppl Do At Items Which Are Not Those Actual Items Plz Don't Take This Seriously
😃
Prabir Kumar Das
17.04.2023Can you say which key is used for which function?
Please reply
FireGamer5HG
17.04.2023I Have downloaded the files but how to run them? pls tell
André Cristian
17.04.2023could you let the zip project download
RobCraft
17.04.2023actually its good even me can do like that . but the problem is I can't download javascripts in window 10.So i use python to make minecraft rather use javaScripts
Naud van Dalen
17.04.2023I thought Java was slow. Turns out that Javascript is even slower. 30 fps and there's barely anything going on.
GorEldeenOLD2
17.04.2023wohoo
Manni
17.04.2023minecraft is java scripted
MrAl
17.04.2023Tienes que hacer una actualización de ese Minecraft.
Nebulaoblivion
17.04.2023there’s this other guy who coded minecraft in Javascript. I think his name was Notch or something?