Summary
Keywords
Full Transcript
In this tutorial we'll build Modern Animated Hero page using Reactjs Tailwind CSS and Framer motion, we'll also deployed it. - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 👁️ Live Preview: https://honda-tcj.netlify.app/ 📂 Source code (Support me ☕) : https://buymeacoffee.com/thecodingjourney/e/273453 💬 Join our community to get Source code for free 🎁 WhatsApp :- https://chat.whatsapp.com/Hu643OfjQax7zgqQdlok2C Telegram :- https://t.me/the_coding_journey - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Related Tutorials ▫️https://www.youtube.com/watch?v=FhjbNmKb8TQ ▫️https://www.youtube.com/watch?v=H4bS5Zp6nUk&t=90s 🎬 Playlist ( Full website Build from scratch + Free Assets + Free Code ) ▫️https://www.youtube.com/playlist?list=PLt2fZkYs6q_l2WebLGr6biyk551rLUtLV - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 👨🏻💻 Gadgets I used 👇🏻 Laptop: https://amzn.to/3VRiIMh | https://amzn.to/4ctuMul Monitor: https://amzn.to/45WzIVP | https://amzn.to/3Wbjbdx Keyboard: https://amzn.to/3XOhggg Mouse: https://amzn.to/45WKSdo Pentab: https://amzn.to/4eM1rwN Mic: https://amzn.to/3zxM9eM Chair: https://amzn.to/45Rzsrj Bluetooth earphone: https://amzn.to/3LkK749 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - ⏱ Timestamps 00:00 Demo 01:55 Software Download Project Setup 02:54 Tailwind configuration 07:53 Responsive Animated Hero section Tailwind CSS 24:54 Responsive Navbar section 38:00 Animated Hero Page Image section 55:44 Preview and Testing 56:35 Build and Deployment - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Facebook - https://m.facebook.com/thecodingjourney Instagram - https://www.instagram.com/the.coding.journey/ Twitter - https://www.twitter.com/thecodingjourny - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 💼 Packages : next js - https://nextjs.org/ tailwind css - https://tailwindcss.com/ react - https://react.dev vite js - https://vitejs.dev/guide/ react icons - https://react-icons.github.io/ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - #reactjs #framermotion #tailwindcss #tailwind #framer #responsivewebsite #websitedesign #carwebsite #html #css #javascript #webdesign #webdevelopment #frontend #frontenddevelopment #uidesign #thecodingjourney #tcj #htmlcss #uiux #uidesign #reactwebsite #tailwindwebsite #frameranimation #animation #animated website
Continue this lesson in the app
Install CourseHive on Android or iOS to keep learning while you move.
