EcoTrack: Smart Home Energy Monitor 🌿

🌟 Overview

EcoTrack is a feature-rich smart home energy monitoring tool designed to help users gain control over their energy consumption. Through real-time visualizations, device-specific insights, and automated energy-saving suggestions, EcoTrack makes energy management simple and effective

⚡Key Features

• 📊 Real-Time Monitoring: View real-time energy usage across devices and locations.

• 🧩 Customizable Dashboard: Tailor your dashboard with interactive widgets.

• 🔌 Device-Specific Insights: Track energy consumption per device for deeper insights.

• 📈 Historical Analysis: Analyze past data trends to optimize future usage.

• 💡 Smart Recommendations: Get personalized energy-saving tips based on your habits.

• 🤖 Smart Device Integration: Connect with smart devices for automated energy management.

• 🌘 Dark Mode: Enjoy a sleek dark mode for low-light environments.

🛠️ Technologies Used

• ⚛️ Next.js 14: For server-side rendering and fast performance.

• 🚀 React: To build a dynamic and interactive UI.

• 🟦 TypeScript: Ensures type safety and better code maintainability.

• 🎨 Tailwind CSS: Provides modern styling with flexibility and speed.

• 🎥 Framer Motion: For smooth and fluid animations.

• 📊 Chart.js: Visualize energy data with customizable charts.

• 🌓 next-themes: Easy theme switching for light and dark mode.

🚀 Getting Started

1. Clone the repository 📥

git clone https://github.com/Slygriyrsk/ecotrack.git

2. Install dependencies 📦

cd ecotrack
npm install

3. Run the development server 🖥️

npm run dev

4. Open in your browser 🌐 Go to http://localhost:3000 to view the app.

📂 Folder Structure

ecotrack/
├── app/
│   ├── dashboard/        # Energy usage dashboard components
│   ├── devices/          # Device management and tracking
│   ├── insights/         # Insights and analysis of energy data
│   ├── settings/         # User preferences and settings
│   ├── layout.tsx        # Main layout component
│   └── page.tsx          # Home page component
├── components/           # Reusable UI components
│   ├── DashboardCard.tsx
│   ├── DeviceList.tsx
│   ├── EnergyChart.tsx
│   ├── Header.tsx
│   ├── Sidebar.tsx
│   └── ...
├── lib/                  # Utility functions and data fetching
│   ├── energyData.ts
│   └── deviceData.ts
├── public/               # Static files (e.g., images)
│   └── images/
├── styles/               # Global and component-specific styles
│   └── globals.css
├── README.md
├── package.json
└── tsconfig.json

🙌 Contributing

We welcome contributions! 🎉 Please read our Contributing Guide to learn how to help improve EcoTrack.

📄 License

This project is licensed under the MIT License. For more details, see the LICENSE.