This is a Next.js project for Heal, a web application designed to help you track and understand your health data. It integrates with various wearables and uses AI to provide insights into your well-being.
- Wearable Integration: Sync your data from Apple Watch, Garmin, Oura, and Whoop.
- AI-Powered Chat: Ask questions about your health data and get personalized insights.
- Data Visualization: Interactive charts and graphs to visualize your health trends.
- User Authentication: Secure user accounts with Clerk.
- Light & Dark Mode: Switch between light and dark themes.
First, install the dependencies using Bun:
bun installThen, run the development server:
bun run devOpen http://localhost:3000 with your browser to see the result.
- Next.js - React framework for production.
- TypeScript - Typed JavaScript for robust applications.
- Tailwind CSS - A utility-first CSS framework.
- Shadcn/UI - Re-usable components built using Radix UI and Tailwind CSS.
- Clerk - User authentication and management.
- Google AI SDK - For integrating AI features.
- Zustand - Small, fast and scalable bearbones state-management for React.
- React Flow - For creating node-based UIs.
/
├── app/ # Next.js App Router pages and layouts
│ ├── (app)/ # Main application routes (e.g., chat, settings)
│ ├── (landing)/ # Landing page routes
│ ├── api/ # API routes
│ └── onboarding/ # Onboarding flow
├── components/ # Shared React components
│ ├── ai-elements/ # Components for the AI chat interface
│ ├── landing/ # Components for the landing page
│ ├── layout/ # Layout components (sidebar, header, etc.)
│ └── ui/ # Generic UI components (buttons, cards, etc.)
├── config/ # Project configuration files
├── hooks/ # Custom React hooks
├── lib/ # Utility functions and libraries
├── public/ # Static assets (images, fonts, etc.)
└── ...
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out our Next.js deployment documentation for more details.