Build a 3D Book Slider Landing Page with Three.js & React

Опубликовано: 27 Июль 2024
на канале: Wawa Sensei

16,144

770

Learn how to build an amazing 3D Book Slider landing page with Three.js and React Three Fiber

🚀 Learn React Three Fiber with my complete course ✨
https://lessons.wawasensei.dev/course...

Live demo 🏖️
https://r3f-animated-book-slider-fina...

Starter pack 🔗
https://github.com/wass08/r3f-animate...

Final code 🔗
https://github.com/wass08/r3f-animate...

#threejs #webdevelopment #reactthreefiber

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

Squoosh Texture compression
https://squoosh.app/

Box Geometry
https://threejs.org/docs/#api/en/geom...

Skinned Mesh
https://threejs.org/docs/?q=skinn#api...

GraphToy
https://graphtoy.com/

▬▬▬▬▬▬ Support the channel 🙏 ▬▬▬▬▬▬

Become a member to get access to awesome perks:
   / @wawasensei

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

💻 The Discord Community
  / discord

📸 Instagram :
  / wawa.sensei

🎎 Facebook :
  / wawasenseiyt

🐦Twitter :
  / wawasensei

🐦TikTok :
  / wawasensei08

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

00:00 - Intro
01:00 - Starter pack
02:03 - Book
05:30 - BoxGeometry
08:11 - SkinnedMesh
17:44 - Textures
20:55 - Initial state
22:22 - Page transitions
32:44 - Fold animation
36:50 - Delay between pages
38:57 - PointerEvents
41:35 - Final touch
43:02 - Thank you!

Смотрите видео Build a 3D Book Slider Landing Page with Three.js & React онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Wawa Sensei 27 Июль 2024, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 16,144 раз и оно понравилось 770 людям.

1,338