🔥Complete Responsive Coffee Shop Website Using ReactJS, Tailwind CSS & Framer Motion

Sobre esta lección

Complete Responsive Coffee shop Website using ReactJS and Tailwind CSS. Animated with Framer motion, In this tutorial you will learn how to make modern Animated Coffee Shop website, and also we'll deploy it. 👁️ Live Preview: https://coders-coffee.netlify.app/ 📂 Source code (support me 💖) : https://buymeacoffee.com/thecodingjourney/e/272784 👨🏻‍💻 Starter code (Files + Assets) : https://github.com/dilshad-ahmed/coders_coffee 🎁 Join our community to get source code for free. 👇🏻 WhatsApp :- https://chat.whatsapp.com/Hu643OfjQax7zgqQdlok2C Telegram :- https://t.me/the_coding_journey Similar Cafe Source Code :- https://github.com/dilshad-ahmed/coffee-cafe - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 🎬 Playlist ( Full website Build from scratch + Free Assets + Free Code ) https://www.youtube.com/playlist?list=PLt2fZkYs6q_l2WebLGr6biyk551rLUtLV 🎬Related Tutorial https://www.youtube.com/watch?v=VU2rjKwhY_s - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 👨🏻‍💻 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 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Features: 👉🏻 Responsive Complete Landing page. 👉🏻 Animated Sidebar. 👉🏻 Modern Animated website using Framer motion. 👉🏻 Fully Responsive Hero page( All device supported ) 👉🏻 Modern responsive product card 👉🏻 Responsive Footer - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - What you will learn: 🔥 How to build Responsive Navbar using ReactJS. 🔥 How to build Modern Responsive Hero page using ReactJS , Tailwind CSS and Framer motion. 🔥 You'll learn how to animate website with framer motion. 🔥 You'll build fully responsive website in reactJS using Tailwind CSS 🔥 Best practices and debugging skills. - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - ⏱ Timestamps 00:00 Demo 01:46 Responsive Demo 03:36 Software Download 04:01 Project Setup & Configuring Tailwind CSS 08:36 Responsive Hero Section Tailwind CSS & Framer motion 28:31 Animated Sidebar Section 47:44 Coffee Cards Section 01:00:20 Buy Coffee Form Section 01:10:10 Animated Apps Download Section 01:19:06 Responsive Footer Section 01:31:08 Testing and Preview 01:36:55 Deployment - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 💼 Packages : tailwind css - https://tailwindcss.com/ react - https://react.dev vite js - https://vitejs.dev/guide/ react icons - https://react-icons.github.io/ image- https://pngtree.com/freebackground - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Follow us on - Facebook - https://m.facebook.com/thecodingjourney Instagram - https://www.instagram.com/the.coding.journey Twitter - https://mobile.twitter.com/thecodingjourny - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - #reactjs #tailwind #framermotion #coffeeshop #tailwind #ecommerce #ecommercewebsite #responsivewebsite #coffee #tailwindcss #websitedesign #css #webdesign #webdevelopment #frontend #frontenddevelopment #uidesign #thecodingjourney #tcj #coding #codingtutorial