Recreate the Apple iPhone 15 Pro website, combining GSAP animations and Three.js 3D effects. From custom animations to animated 3D models, this tutorial covers it all.
⭐ Hostinger - https://hostinger.com/mastery10
Use the code JAVASCRIPTMASTERY to save up to 91% on all yearly hosting plans.
🌟 Sentry - https://bit.ly/4abT6PG
📙 Three.js & GSAP Guide - https://resource.jsmastery.pro/threej...
📘 ESLint & Prettier Guide - https://resource.jsmastery.pro/eslint...
🌟 Become a top 1% Next.js 14 developer: https://www.jsmastery.pro/ultimate-ne...
🚀 Skyrocket your career in 4 months: https://jsmastery.pro/full-stack-web-...
📚 Materials/References:
GSAP Workshop Starter: https://github.com/JavaScript-Mastery...
GSAP Workshop Final: https://github.com/JavaScript-Mastery...
GitHub Repository (give it a star ⭐): https://github.com/adrianhajdin/iphone
README (assets & code): https://github.com/adrianhajdin/iphon...
GLTFs into JSX: https://github.com/pmndrs/gltfjsx
💻 Join our Discord Community - / discord
🐦 Follow us on Twitter: / jsmasterypro
🖼️ Follow us on Instagram: / javascriptmastery
💼 Business Inquiries: [email protected]
Time Stamps 👇
00:00:00 — Intro
00:01:47 — GSAP and 3D Crash Course
00:11:23 — GSAP Workshop
00:39:33 — Setup hosting & domain
00:42:00 — Project Setup
00:54:50 — Navbar
01:01:37 — Hero section
01:16:39 — Highlights section
01:23:19 — Video Carousel
02:02:53 — 3D Model section
02:50:00 — Sentry Performance
03:06:30 — Features section
03:27:51 — How it works section
03:41:16 — Footer
03:47:12 — Deployment
Watch video Build and Deploy an Apple Website with React | Beginner Three.js & GSAP Tutorial online without registration, duration hours minute second in high quality. This video was added by user JavaScript Mastery 15 March 2024, don't forget to share it with your friends and acquaintances, it has been viewed on our site 430,41 once and liked it 10 thousand people.