TechTrendz E-Commerce

A modern, responsive e-commerce website built with React, Tailwind CSS, and various animation libraries. This project showcases electronic products with smooth animations and a clean UI.

Live Demo

Check out the live website: https://techtrendz-e-commerce.netlify.app/

Features

• 🚀 Responsive Design: Works perfectly on all device sizes
• 🌓 Dark/Light Mode: Toggle between dark and light themes
• ✨ Animations: Using AOS (Animate On Scroll) for engaging scroll animations
• 🎠 Image Carousel: Hero section slider using react-slick
• 📱 Interactive UI: With hover effects and smooth transitions
• 📝 Blog Section: Showcasing recent tech articles
• 🛒 Product Showcase: Beautiful product display sections

Technologies Used

• React.js
• Tailwind CSS
• AOS (Animate On Scroll)
• react-slick (for carousel/slider)
• React Icons
• Vite (for fast development)

Project Structure

The main components are:

• Hero.jsx: Featured product slider
• Category.jsx & Category2.jsx: Product category displays
• Banner.jsx: Promotional banners
• Blogs.jsx: Recent articles section
• Footer.jsx: Site footer with links and contact info
• Navbar.jsx: Navigation header (not shown in files but presumably exists)
• Popup.jsx: Modal popup (not shown in files but referenced)

Installation

To run this project locally:

1. Clone the repository:

   git clone https://github.com/your-username/techtrendz-ecommerce.git
   npm install
   npm run dev

Customization

You can easily customize:

Colors: Edit the Tailwind config or use inline styles

Content: Modify the data objects in each component

Animations: Adjust AOS settings in App.jsx

Credits

Made with ❤️ by Naman Garg

Design inspired by modern e-commerce trends

Images from various free resources