Build and Deploy Pro Smartwatch Ecommerce Website Hero page using ReactJS and Tailwind CSS. In this tutorial you will learn how to make modern complete Hero Page and also you will learn how to deploy it on the internet.
👁️ Live Preview:
https://watch-store-tcj.netlify.app/
🧡 Get the source code absolutely Free || Don't forget to LIKE & SUBSCRIBE😍
Source code (support me 💖) : https://buymeacoffee.com/thecodingjou...
💬 Join our community
WhatsApp :- https://chat.whatsapp.com/Hu643OfjQax...
Telegram :- https://t.me/the_coding_journey
🎁 Free Source Code :- https://github.com/dilshad-ahmed/watc...
🎬 Playlist ( Full website Build from scratch + Free Assets + Free Code )
• Complete Responsive Websites ReactJS and T...
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
👨🏻💻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 Hero page
👉🏻 Responsive Navbar with dropdown menu.
👉🏻 Dark and Light mode features.
👉🏻 Beautiful Animated website (Animate on scroll).
👉🏻 Fully responsive Hero page( All device supported )
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
What you will learn:
🔥 How to build Responsive Navbar using ReactJS.
🔥 How to build Animated Hero page with onClick Changing Images.
🔥 How to build Modern Responsive Hero page using ReactJS and Tailwind CSS.
🔥 You'll learn to implement dark mode features in react app.
🔥 You'll learn to animation on websites.
🔥 You'll build fully responsive website in reactJS using Tailwind CSS
🔥 Best practices and debugging skills.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
⏱ Timestamps
00:00 Demo
02:37 Software Download
03:09 Project Setup
04:34 Configuring Tailwind CSS
09:18 Responsive Navbar Section Tailwind CSS
23:25 Navbar Links with Dropdown
36:52 Dark Mode Feature ReactJS
47:52 Hero Layout section
01:16:14 AOS animation
01:23:22 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 -
/ thecodingjourney
Instagram -
/ the.coding.journey
Twitter -
/ thecodingjourny
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
#reactwebsite #ecommerce #ecommercewebsite #responsivewebsite #onlineshoping #tailwindcss #reactjs #tailwind #websitedesign #css #webdesign #webdevelopment #frontend #frontenddevelopment #uidesign #thecodingjourney #tcj #coding #codingtutorial #website
コメント