Videos » Build and Deploy an Amazing 3D Web Developer Portfolio in React JS | Beginner Three.js Tutorial

Build and Deploy an Amazing 3D Web Developer Portfolio in React JS | Beginner Three.js Tutorial

Posted by admin
The most impressive websites in the world use 3D graphics and animations to bring their content to life. Learn how to build your own ThreeJS 3D Developer Portfolio today! \ud83d\udcbb JS Mastery Pro - https://jsmastery.pro/youtube \u2705 A special YOUTUBE discount code is automatically applied! \u2b50Hostinger - https://hostinger.com/mastery10 Use the code JAVASCRIPTMASTERY to save up to 91% on all yearly hosting plans. \ud83d\udcd9 Get the Ultimate Frontend & Backend Development Roadmaps, a Complete JavaScript Cheatsheet, Portfolio Tips, and more: https://www.jsmastery.pro/resources \ud83d\udcda Materials/References: GitHub Code (give it a star \u2b50): https://github.com/adrianhajdin/project_3D_developer_portfolio GitHub Gist Code Snippets: https://gist.github.com/adrianhajdin/b1d33c262941a7e21aad833a1cfc84b1 Assets, Components, Public folders: https://drive.google.com/drive/folders/1KVU8iaH0E_JFtShNiR3BgCSA3pawXY4Z?usp=share_link Bruno Simon Portfolio - https://bruno-simon.com/ Junni - https://next.junni.co.jp/ In this course, you'll learn the following: - ThreeJS - a powerful 3D graphics library for rendering and animating the 3D model - React Three Fiber - a popular library for creating 3D graphics with ThreeJS in React - TailwindCSS - a popular utility-first CSS styling framework - Framer Motion - the most popular library used to bring your React website to life with animations You'll also learn how to: - Load, create and customize stunning 3D models and geometries with various lights, as well as understand the 3D world with a camera and positioning of an object in space. - Make your code reusable and scalable using Higher Order Components (HOCs) and other industry-standard best practices - Implement sending emails through a form on the website - Ensure responsiveness across all devices and improve your site's performance using Suspense and Preload. \ud83d\udcbb Join JSM on Discord - https://discord.gg/n6EdbFJ \ud83d\udc26 Follow JSM on Twitter - https://twitter.com/jsmasterypro \ud83d\uddbc\ufe0f Follow JSM on Instagram - https://instagram.com/javascriptmastery \ud83d\udcbc Business Inquiries: contact@jsmastery.pro \ud83d\udc47 Time Stamps: 00:17:55 Layout 00:21:07 Navigation bar 00:40:57 Hero Section 01:07:41 About Section 01:17:09 Higher Order Component 01:23:28 Experience Section 01:44:33 Projects Section 02:01:01 Testimonials 02:13:15 Contact 02:32:09 3D Stars 02:49:09 Deployment
Posted March 16, 2023
click to rate

Embed  |  373 views