Coding a Wordle Clone with JavaScript + Three.js

Опубликовано: 06 Январь 2025
на канале: Suboptimal Engineer

1,181

In this game dev experiment, we will go over the process of coding a 3D Wordle game in JavaScript. We start off by cloning the Three.js + React template from the GitHub repository. Then we create our Wordle board with rounded box geometry and set up the TTF font loader. Afterward, we handle user inputs with window event listeners and validate the game state. Then we add animations to the result and finish up with a demo of Wordle.

📖 Code - https://github.com/SuboptimalEng/thre...

🎥 YouTube -    / suboptimaleng
💻 GitHub - https://github.com/SuboptimalEng
🐦 Twitter -   / suboptimaleng
🧵 Threads - https://www.threads.net/@suboptimaleng
📸 Instagram -   / suboptimaleng

== [ Resources ] ==
Official Wordle - https://www.powerlanguage.co.uk/wordle
JetBrains Font - https://github.com/JetBrains/JetBrain...

== [ Timestamps ] ==
00:00 What is Wordle?
00:58 Three.js Project Template
01:44 Create Wordle Board
02:43 TTF Font Loader Setup
03:40 Handle Keyboard Input
05:00 Validate Game State
06:47 Add Animations
08:08 3D Wordle Demo

== [ Tags ] ==
#suboptimal #metaverse #threejs