174 lines
4.7 KiB
Markdown
174 lines
4.7 KiB
Markdown
# FitAI
|
|
|
|
Integrated AI solution for fitness houses and their clients with Clerk authentication.
|
|
|
|
## Project Structure
|
|
|
|
```
|
|
fitai/
|
|
├── apps/
|
|
│ ├── admin/ # Next.js admin dashboard
|
|
│ └── mobile/ # React Native mobile app (Expo)
|
|
├── packages/
|
|
│ └── shared/ # Shared types and utilities
|
|
└── AGENTS.md # Development guidelines
|
|
```
|
|
|
|
## Getting Started
|
|
|
|
### Prerequisites
|
|
- Node.js >= 18.0.0
|
|
- npm >= 9.0.0
|
|
- Clerk account (sign up at https://clerk.com)
|
|
|
|
### Installation
|
|
```bash
|
|
# Install root dependencies
|
|
npm install
|
|
|
|
# Install admin dependencies
|
|
cd apps/admin && npm install
|
|
|
|
# Install mobile dependencies
|
|
cd apps/mobile && npm install --legacy-peer-deps
|
|
```
|
|
|
|
### Authentication Setup
|
|
|
|
FitAI uses Clerk for authentication. Follow these steps:
|
|
|
|
1. **Create a Clerk account** at https://dashboard.clerk.com
|
|
2. **Create a new application** in the Clerk dashboard
|
|
3. **Copy your API keys** (Publishable Key and Secret Key)
|
|
4. **Configure environment variables**:
|
|
|
|
**Admin App** (`apps/admin/.env.local`):
|
|
```env
|
|
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_your_key_here
|
|
CLERK_SECRET_KEY=sk_test_your_key_here
|
|
```
|
|
|
|
**Mobile App** (`apps/mobile/.env`):
|
|
```env
|
|
EXPO_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_your_key_here
|
|
```
|
|
|
|
📖 **See [CLERK_SETUP.md](./CLERK_SETUP.md) for detailed setup instructions**
|
|
|
|
### Development
|
|
|
|
**Important**: Set up environment variables before running the apps!
|
|
|
|
```bash
|
|
# Admin dashboard (http://localhost:3000)
|
|
cd apps/admin && npm run dev
|
|
|
|
# Mobile app (http://localhost:8081) - Requires Expo SDK 54
|
|
cd apps/mobile && npm start
|
|
```
|
|
|
|
**First-time setup checklist**:
|
|
- [ ] Create Clerk account and application
|
|
- [ ] Add API keys to `.env.local` (admin) and `.env` (mobile)
|
|
- [ ] Verify both apps start without errors
|
|
- [ ] Test sign-up and sign-in flows
|
|
|
|
### Mobile App Setup
|
|
- **Expo SDK**: 50 (stable, compatible with Expo Go)
|
|
- **Assets**: Placeholder icons and splash screen included
|
|
- **Navigation**: Expo Router with tab-based layout
|
|
- **Authentication**: Secure storage with expo-secure-store
|
|
- **Babel**: babel-preset-expo for proper transpilation
|
|
|
|
### Known Compatibility Notes
|
|
- Use Expo Go with SDK 50 for mobile testing
|
|
- For SDK 54, upgrade all dependencies to latest versions
|
|
- Current setup prioritizes stability over latest features
|
|
|
|
### Build & Test
|
|
```bash
|
|
# Build all apps
|
|
npm run build
|
|
|
|
# Run tests
|
|
npm test
|
|
|
|
# Lint code
|
|
npm run lint
|
|
|
|
# Type checking
|
|
npm run typecheck
|
|
```
|
|
|
|
## Features
|
|
|
|
### Authentication (Clerk)
|
|
- 🔐 Secure email/password authentication
|
|
- ✉️ Email verification
|
|
- 🔄 Session management
|
|
- 🎨 Customizable UI components
|
|
- 📱 Multi-platform support (Web + Mobile)
|
|
- 🛡️ Built-in security features
|
|
|
|
### Admin Dashboard
|
|
- 👥 User management (CRUD operations)
|
|
- 📊 Analytics dashboard with charts
|
|
- 🎯 Role-based access control
|
|
- 📈 Data visualization with AG Grid
|
|
- 💳 Payment tracking (coming soon)
|
|
- 📅 Attendance monitoring (coming soon)
|
|
|
|
### Mobile App
|
|
- 🔐 Secure sign-in/sign-up
|
|
- 👤 User profile management
|
|
- 📱 Native mobile experience
|
|
- 🔔 Push notifications ready
|
|
- ✅ Attendance check-in (coming soon)
|
|
- 💰 Payment history (coming soon)
|
|
|
|
## Tech Stack
|
|
|
|
### Authentication
|
|
- **Clerk**: Complete authentication and user management platform
|
|
|
|
### Frontend
|
|
- **Admin**: Next.js 14 (App Router), React 19, TypeScript, Tailwind CSS
|
|
- **Mobile**: React Native, Expo SDK 54, Expo Router, TypeScript
|
|
|
|
### Backend & Database
|
|
- **Database**: SQLite with Drizzle ORM
|
|
- **API**: Next.js API Routes (REST)
|
|
|
|
### Development Tools
|
|
- **State Management**: React Query, React Hook Form
|
|
- **Validation**: Zod schemas
|
|
- **Data Grid**: AG Grid for advanced user management
|
|
- **Charts**: AG Charts for analytics and visualization
|
|
- **Testing**: Jest, Testing Library (configured)
|
|
|
|
## Project Structure
|
|
|
|
```
|
|
fitai/
|
|
├── apps/
|
|
│ ├── admin/ # Next.js admin dashboard
|
|
│ │ ├── src/
|
|
│ │ │ ├── app/ # App Router pages & API routes
|
|
│ │ │ ├── components/
|
|
│ │ │ └── lib/ # Database & utilities
|
|
│ │ └── .env.local # Admin environment variables
|
|
│ │
|
|
│ └── mobile/ # Expo React Native app
|
|
│ ├── src/
|
|
│ │ ├── app/ # Expo Router screens
|
|
│ │ │ ├── (auth)/ # Authentication screens
|
|
│ │ │ └── (tabs)/ # Main app tabs
|
|
│ │ └── components/
|
|
│ └── .env # Mobile environment variables
|
|
│
|
|
├── packages/
|
|
│ ├── database/ # Drizzle ORM schemas & DB client
|
|
│ └── shared/ # Shared types & utilities
|
|
│
|
|
└── CLERK_SETUP.md # Detailed authentication setup guide
|
|
``` |