A modern web application helping users make environmentally conscious shopping decisions by providing eco-friendly alternatives to everyday products.
- Product Search: Find eco-friendly alternatives with real-time filtering
- Category Filtering: Browse products by categories like Personal Care, Kitchen, and Household
- Environmental Impact: View the environmental impact of products and their sustainable alternatives
- Daily Eco Tips: Get practical tips for sustainable living across different categories
- Responsive Design: Fully responsive interface that works on all devices
- Animated UI: Smooth transitions and interactions for a polished user experience
- React 18
- TypeScript
- Tailwind CSS
- Lucide Icons
- Vite
- Node.js (v18 or higher)
- npm or yarn
- Clone the repository:
git clone https://github.com/prabhsharan1/ecoshopper.git- Install dependencies:
npm install- Start the development server:
npm run dev- Open http://localhost:5173 in your browser
ecoshopper/
├── src/
│ ├── components/
│ │ ├── Hero.tsx
│ │ ├── SearchBar.tsx
│ │ ├── FeaturedProducts.tsx
│ │ └── EcoTips.tsx
│ ├── data/
│ │ └── products.ts
│ ├── App.tsx
│ └── main.tsx
├── public/
└── package.json
This project was a winner in the Dev Challenge Hackathon. The app's innovative approach to promoting sustainable shopping was recognized and celebrated by the hackathon judges.
This project was created for the Dev Challenge Hackathon, showcasing a modern solution to empower consumers in making eco-friendly shopping decisions. The app offers real-time filtering of sustainable products, personalized eco-tips, and tracks environmental impact to foster a conscious consumer culture.
EcoShopper is designed to help people make environmentally conscious shopping choices by providing a range of eco-friendly alternatives to everyday products, offering key insights into their environmental impact, and motivating positive behavioral change towards sustainability.
It was built using React, TypeScript, Tailwind CSS, and features interactive UI elements to enhance user experience.
Watch the video demonstration here: EcoShopper
- Fork the repository
- Create your feature branch (
git checkout -b feature/AmazingFeature) - Commit your changes (
git commit -m 'Add some AmazingFeature') - Push to the branch (
git push origin feature/AmazingFeature) - Open a Pull Request
This project is licensed under the MIT License - see the LICENSE file for details.
- Unsplash for the beautiful images
- Lucide Icons for the icon set
- Tailwind CSS for the styling framework