Build a 3D Portfolio with React Three Fiber - Responsive
17.4 هزار بار بازدید -
پارسال
-
Let's focus on responsive with
Let's focus on responsive with React Three Fiber and three.js
In this fifth bonus chapter, we will:
- Make our 3D portfolio responsive
- Add a loading screen
- Fine-tune animations
- Connect the contact form
Final result demo
https://r3f-portfolio-responsive.verc...
Get the starter pack here 🔗
https://github.com/wass08/r3f-portfol...
Our main inspiration for the final portfolio
https://david-hckh.com/
#threejs #r3f #portfolio
▬▬▬▬▬▬ Useful L I N K S 🔗 ▬▬▬▬▬▬
My complete course to learn React Three Fiber
https://lessons.wawasensei.dev/
Final source code
https://github.com/wass08/r3f-portfol...
FormSpree
https://formspree.io/
Framer motion
https://www.framer.com/motion/introdu...
Framer motion 3D
https://www.framer.com/motion/three-i...
GSAP
https://greensock.com/gsap/
Tailwind
https://tailwindcss.com/docs/
React Three Fiber documentation
https://docs.pmnd.rs/react-three-fibe...
Mixamo
https://www.mixamo.com/
R3F Drei
https://github.com/pmndrs/drei
▬▬▬▬▬▬ T I M E S T A M P S ⏰ ▬▬▬▬▬▬
00:00 - Intro
00:37 - UI Responsive
07:09 - Cursor
08:04 - Wireframe mode skills
08:49 - Smoothen animations
09:58 - 3D Responsive
21:02 - Loading screen
27:11 - Contact form
30:52 - Final result
31:16 - Conclusion
▬▬▬▬▬▬ Support the channel 🙏 ▬▬▬▬▬▬
Become a member to get access to awesome perks:
@wawasensei
▬▬▬▬▬▬ Connect with me 👋 ▬▬▬▬▬▬
💻 The Discord Community
Discord: discord
📸 Instagram :
Instagram: wawa.sensei
🎎 Facebook :
Facebook: wawasenseiyt
🐦Twitter :
Twitter: wawasensei
🐦TikTok :
TikTok: wawasensei08
💻 My website :
https://www.wawasensei.dev
In this fifth bonus chapter, we will:
- Make our 3D portfolio responsive
- Add a loading screen
- Fine-tune animations
- Connect the contact form
Final result demo
https://r3f-portfolio-responsive.verc...
Get the starter pack here 🔗
https://github.com/wass08/r3f-portfol...
Our main inspiration for the final portfolio
https://david-hckh.com/
#threejs #r3f #portfolio
▬▬▬▬▬▬ Useful L I N K S 🔗 ▬▬▬▬▬▬
My complete course to learn React Three Fiber
https://lessons.wawasensei.dev/
Final source code
https://github.com/wass08/r3f-portfol...
FormSpree
https://formspree.io/
Framer motion
https://www.framer.com/motion/introdu...
Framer motion 3D
https://www.framer.com/motion/three-i...
GSAP
https://greensock.com/gsap/
Tailwind
https://tailwindcss.com/docs/
React Three Fiber documentation
https://docs.pmnd.rs/react-three-fibe...
Mixamo
https://www.mixamo.com/
R3F Drei
https://github.com/pmndrs/drei
▬▬▬▬▬▬ T I M E S T A M P S ⏰ ▬▬▬▬▬▬
00:00 - Intro
00:37 - UI Responsive
07:09 - Cursor
08:04 - Wireframe mode skills
08:49 - Smoothen animations
09:58 - 3D Responsive
21:02 - Loading screen
27:11 - Contact form
30:52 - Final result
31:16 - Conclusion
▬▬▬▬▬▬ Support the channel 🙏 ▬▬▬▬▬▬
Become a member to get access to awesome perks:
@wawasensei
▬▬▬▬▬▬ Connect with me 👋 ▬▬▬▬▬▬
💻 The Discord Community
Discord: discord
📸 Instagram :
Instagram: wawa.sensei
🎎 Facebook :
Facebook: wawasenseiyt
🐦Twitter :
Twitter: wawasensei
🐦TikTok :
TikTok: wawasensei08
💻 My website :
https://www.wawasensei.dev
پارسال
در تاریخ 1402/04/02 منتشر شده
است.
17,408
بـار بازدید شده