Uploaded May 2023 | Updated September 2026, 1 week ago

---

Let's create a game with threejs and React Three Fiber to learn Japanese characters Hiragana and Katakana.
In this first part, we will build the foundation of our game:
- Setup Rapier Physics Engine
- Loading 3D Models
- Rendering 3D Text (Japanese font)
- Creating a game engine with Zustand state management library

Get the starter pack here 🔗
github.com/wass08/r3f-vite-starter


#threejs #r3f #react

▬▬▬▬▬▬ Useful L I N K S 🔗 ▬▬▬▬▬▬

My complete course to learn React Three Fiber
https://lessons.wawasensei.dev/

Final source code
github.com/wass08/r3f-kanagame-part-1

Models
https://poly.pizza/
https://market.pmnd.rs/

Zustand
github.com/pmndrs/zustand

Learn Hiragana
tofugu.com/japanese/learn-hiragana

Learn Katakana
tofugu.com/japanese/learn-katakana

React Three Fiber documentation
https://docs.pmnd.rs/react-three-fiber/getting-started/introduction

R3F Drei
github.com/pmndrs/drei

Three.js Journey.
threejs-journey.com
I also have a discount code just for you to get -20%
https://threejs-journey.xyz/join/wawasensei1

▬▬▬▬▬▬ T I M E S T A M P S ⏰ ▬▬▬▬▬▬

00:00 - Japanese characters
00:42 - Setup
01:05 - Basic scene
02:37 - 3D Text
04:09 - Zustand game engine
07:17 - Simple character controller
09:44 - First part progression

▬▬▬▬▬▬ Support the channel 🙏 ▬▬▬▬▬▬
Become a member to get access to awesome perks:
youtube.com/channel/UCBH-5ctALmmOrm4kczL3urQ/join

▬▬▬▬▬▬ Connect with me 👋 ▬▬▬▬▬▬

💻 The Discord Community
discord.gg/2wBhwchcWu

📸 Instagram :
instagram.com/wawa.sensei

🎎 Facebook :
facebook.com/wawasenseiyt

🐦Twitter :
twitter.com/wawasensei

🐦TikTok :
tiktok.com/@wawasensei08

💻 My website :
https://www.wawasensei.dev