Wellness Tracker

Wellness Habit Tracker 🌟

A modern and aesthetically pleasing habit tracker designed to help users build and maintain healthy habits. This project combines seamless functionality with a unique AI-powered feature to offer personalized insights, setting it apart from other wellness apps.

🚀 Features • Track Your Habits: Log and monitor daily habits with an intuitive interface. • Personalized AI Insights: Leverage AI to analyze habits and suggest ways to improve. • Beautiful Design: Clean, modern UI with smooth animations powered by Framer Motion. • Responsive: Fully responsive design for a great experience on any device.

🛠️ Tech Stack • React: Component-based UI development. • Next.js: Server-side rendering and optimized performance. • TypeScript: Enhanced development with static typing. • Tailwind CSS: Utility-first CSS framework for efficient styling. • Framer Motion: Library for animations and transitions. • Supabase: Backend and authentication (planned feature). • AI API: To power unique AI-driven insights (in progress).

🎨 Design • Global Gradient Background: A calming gradient (#948e99 to #2e1437) for consistency. • Animations: Inspired by Baked Design Studio, with fluid, interactive transitions. • Minimal but Not Plain: A modern design that balances simplicity and functionality.

📦 Installation 1. Clone the repository:

git clone https://github.com/mohamedhhersi/wellness-habit-tracker.git

2.    Navigate to the project directory:

cd wellness-habit-tracker

3.    Install dependencies:

npm install

4.    Start the development server:

npm run dev

5.    Open http://localhost:3000 in your browser.

🤝 Contributing

Contributions, issues, and feature requests are welcome! Feel free to fork the repository and submit a pull request.

🗒️ To-Do • Add habit tracking functionality. • Integrate AI-powered insights using an affordable AI API. • Add user authentication with Clerk or Supabase. • Optimize animations with Framer Motion. • Leverage AI to analyze habits and suggest ways to improve.