🙋‍♂️ Hi there
4️⃣ In the fourth video of this course we're continuing the convertion of the Application class to a functional react component. We will configure the Canvas component from react three fiber so that the colors will be correct and the same as in Bruno's own project. We will make some small changes to keep Hot Module Reloading working correctly as well. Enjoy! 👋
👀 If you haven't seen the other videos yet, make sure to check it out! • #01 Introduction - Let...
✨ Are you also so amazed by the 3D websites built by Bruno Simon and other creative developers? In this series of videos we will convert Bruno's Portfolio project from three.js to react three fiber. You will learn how he built this entire project and how you can built one yourself using modern technologies like TypeScript, React, Tailwind CSS, Prettier, ESLint and of course React Three Fiber. We will also handle debugging and 3D physics in React Three Fiber.
3️⃣ This channel is meant to help you start developing 3D websites. Make sure to subscribe if this interests you!
---
🔗 LINKS MENTIONED IN THE VIDEO
3️⃣ End result of this video: github.com/sjoerdvanBommel/th...
3️⃣ Bruno Simon's portfolio code: github.com/brunosimon/folio-2019
3️⃣ Bruno Simon's portfolio: bruno-simon.com/
3️⃣ Three.js Journey: threejs-journey.com/
3️⃣ Color Management: threejs.org/docs/#manual/en/i...
3️⃣ React Three Fiber's note on Color Management: docs.pmnd.rs/react-three-fibe...
---
📫 CONTACT ME
3️⃣ GitHub: github.com/sjoerdvanBommel
3️⃣ Instagram: / threeveloper
3️⃣ Twitter: / threeveloper
3️⃣ LinkedIn: / sjoerd-van-bommel-8a23...
---
⏲ TIMESTAMPS
0:00 Introduction
1:04 The entry point of this project
4:41 Explain file & folder structure
5:48 Converting a class to a react component
10:38 Fix TypeScript compile errors
15:51 Start using React Three Fiber
20:11 Add styling using Tailwind CSS
22:20 Outro
---
Music by Coma-Media: shorturl.at/tyCEF