KidzCart is a vibrant and playful online marketplace for kids' toys, helping families discover and support local toy sellers.
Users can browse toys, view detailed information, try out toys, and manage their own profiles — all in a safe and fun environment!
🔗 Live Demo: [https://kidzcart-5a790.web.app]
KidzCart is a single-page React application that provides toy listings, authentication, private routes, and responsive UI design — all integrated with Firebase for security and hosting.
- A lively Slider (Swiper/DaisyUI) showcasing featured toys.
- Popular Toys Section displaying toy cards with thumbnail, price, rating, available quantity, and “View More” button.
- Popular Brands, Recent Blogs, Feedback, and Subscribe sections for a more engaging homepage experience.
- A dedicated About Route linked from the Navbar.
- Displays information about the website, its purpose, mission, and team members.
- Accessible only to logged-in users (Protected Route).
- About Page and Toy Details Page are protected.
- If a user is not logged in, they are automatically redirected to the Login Page.
- If logged in, they can freely access these pages.
- Shows all details of a selected toy.
- Includes a simple “Try Now” form with
NameandEmailfields. - On form submission, a success toast message appears (no data storage required).
- Available only when the user is logged in.
- Displays the logged-in user's
name,email, andphotoURL. - Includes editable fields for
nameandphotoURL.
- Login Page: Email/password login, Google login, and link to register.
- Register Page: Fields — name, email, photoURL, and password.
- Forgot Password: Fully functional reset email feature that redirects to Gmail after reset.
- Fully responsive on mobile, tablet, and desktop.
- Each route (Home, About, Profile, Details, Login, Register, etc.) shows a unique dynamic title.
- Custom-designed “Not Found” page for invalid routes.
| Category | Technology |
|---|---|
| Frontend | React, Vite |
| Styling | Tailwind CSS, DaisyUI |
| Authentication & Hosting | Firebase |
| Routing | React Router v7 |
| Notifications | React Toastify |
| Animation | Swiper, Aos, React-Fast-Marquee |
| Icons | React Icons |
| Additional | React CountUp, React Intersection Observer |
| Category | Packages Used |
|---|---|
| Frontend | react, react-dom, react-router-dom, axios, react-icons, react-toastify, react-countup, react-intersection-observer, react-fast-marquee, swiper, aos |
| Styling | tailwindcss, daisyui |
| Authentication & Hosting | firebase |
| Utilities | dotenv |