In this tutorial you will learn how to Build and Deploy Full Responsive Grocery Selling Website with React and Tailwind CSS.
👁️ Live Preview:
online-fruits-selling.netlify.app/
📂 Source code (Support 💖) : www.buymeacoffee.com/thecodingjourney/e/228223
👨🏻💻 Develop the project : github.com/dilshad-ahmed/grocery-store-website-sta…
👆 Download (files + images)
Click on the GitHub link
Click the green button (code)
Click Download ZIP
💬 Join our community
WhatsApp :- chat.whatsapp.com/Hu643OfjQax7zgqQdlok2C
Telegram :- t.me/the_coding_journey
🎬 Playlist ( Full website Build from scratch + Free Assets + Free Code )
• Complete Responsive Websites ReactJS and T...…
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Features:
👉🏻 Responsive Complete Landing page.
👉🏻 Animation on scroll.
👉🏻 Fully responsive Hero page( All device supported )
What you will learn:
🔥 How to build Responsive Navbar using ReactJS.
🔥 How to build Modern Responsive Hero page using ReactJS and Tailwind CSS.
🔥 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
01:23 Responsive Demo
03:02 Software Download
03:46 Project Setup & Configuring tailwind CSS
06:23 Extensions used
07:41 Installing Tailwind CSS
09:33 Responsive Hero Section Taiwind CSS
26:58 Navbar section with Reactjs & Tailwind CSS
34:54 Sidebar menu section with Reactjs & Tailwind CSS
40:04 Responsive Services Section with Tailwind CSS
50:33 Where to buy section
01:00:16 Download App from App Store section
01:07:53 Responsive Footer section with Tailwind CSS
01:18:20 Animation section
01:33:52 Animation section
01:26:26 Final design testing and fixing
01:28:49 Deploying the app
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
💼 Packages :
tailwind css - tailwindcss.com/
react - react.dev/
vite js - vitejs.dev/guide/
react icons - react-icons.github.io/
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
#reactwebsite #groceryshopping #responsivewebsite #ecommercewebsite #tailwindcss #reactjs #tailwind #websitedesign #html #css #html5 #css3 #htmlcss #webdesign #webdevelopment #frontend #frontenddevelopment #uidesign #thecodingjourney #tcj #coding #reactjstutorial #codingtutorial #uiux
コメント