We used a library called react-three-fiber which is a renderer for three.js, a WebGL library, and a library called Effection to handle our events from Twitch. In this stream, we work to incorporate transitions via react-spring on top of our react-three-fiber Text3D nodes.
Previous Videos In This Series
Base site setup in • Setup WebGL through react-three-fiber (thr...
Textures on GLTF in • GLTF textures in react-three-fiber
Diving into Twitch Events • WebGL With React-Three-Fiber To Twitch Eve...
Setting Up React Hooks • React Hooks With Effection For Twitch Events
Streaming Twitch Events • Streaming TMI.js Twitch Events With Effection
Events Triggering Model Animations • Twitch Events Trigger 3D Model Animations ...
See the stream live at / jacobbolda
react-spring https://react-spring.io/
react-three-fiber: https://docs.pmnd.rs/react-three-fiber/
drei: https://drei.pmnd.rs/
effection: https://github.com/thefrontside/effec...
parcel: https://parceljs.org/
Moments
00:10:16 Kitty!
Chapters
00:00:00 Boing!
00:01:21 react-spring
00:36:48 Wiring To Events
01:15:12 About Our Component Architecture
01:19:34 Keep Experimenting!
#live