Videos » Build and Deploy an AI-Powered 3D Website Using React | 2023 Three JS Course Tutorial for Beginners

Build and Deploy an AI-Powered 3D Website Using React | 2023 Three JS Course Tutorial for Beginners

Posted by admin
Many large corporations already use 3D graphics to showcase their products. Learn how to build your own ThreeJS 3D product website and infuse it with the power of artificial intelligence! \ud83d\udcbb JS Mastery Pro - https://jsmastery.pro/youtube \u2705 A special YOUTUBE discount code is automatically applied! \ud83d\udcda FREE Ultimate ThreeJS Cheatsheet: https://resource.jsmastery.pro/threejs-cheatsheet \u2b50Hostinger - https://hostinger.com/mastery10 Use the code JAVASCRIPTMASTERY to save up to 91% on all yearly hosting plans. \ud83d\udcda Materials/References: GitHub Code (give it a star \u2b50): https://github.com/adrianhajdin/project_threejs_ai GitHub Gist Code Snippets: https://gist.github.com/adrianhajdin/597252d9d77fa65e30f596d99b03cc11 Assets, Components, Public folders: https://drive.google.com/drive/folders/166wA5NsMV_5D8NN7ujDDbPXC1X65vf2I?usp=share_link @AndersonMancini's content: Course: https://www.udemy.com/course/react-three-fiber-configurator/ YouTube Announcement: https://youtu.be/vn8saiyxZV8 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 - Add custom color and file support. - Generate and use images through DALLE AI - Download the resulting t-shirt model image - Ensure responsiveness across all devices and improve your site's performance \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:00:00 Intro 00:08:51 Setup 00:20:37 Homepage 00:36:49 Customizer 00:48:01 3D Canvas 00:56:02 ThreeJS Camera 01:07:05 ThreeJS Lighting 01:23:49 Color Picker 01:27:01 File Picker 01:46:23 AI Backend 01:59:12 AI Dalle Picker 02:12:24 Deployment
Posted April 25, 2023
click to rate

Embed  |  748 views