Installation Guide - dinesh-git17/my-progress-planner GitHub Wiki
This guide will help you set up My Progress Planner for local development.
๐ Prerequisites
Before you begin, ensure you have the following installed:
Required Software
- Node.js โฅ 18.17.0 (LTS recommended)
- npm โฅ 9.0.0 or yarn โฅ 1.22.0
- Git for version control
External Services
- Supabase account and project
- OpenAI API account with GPT-4 access
Verification
# Check Node.js version
node --version
# Check npm version
npm --version
# Check Git version
git --version
๐ Quick Installation
1. Clone the Repository
git clone https://github.com/dinesh-git17/my-progress-planner.git
cd my-progress-planner
2. Install Dependencies
# Using npm (recommended)
npm install
# Or using yarn
yarn install
3. Environment Setup
Copy the example environment file:
cp .env.example .env.local
4. Configure Environment Variables
Edit .env.local
with your actual values:
# Supabase Configuration
NEXT_PUBLIC_SUPABASE_URL=https://your-project.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your_anon_key_here
SUPABASE_SERVICE_ROLE_KEY=your_service_role_key_here
# OpenAI Integration
OPENAI_API_KEY=sk-your_openai_api_key_here
# Security (Generate strong passwords)
CRON_SECRET=your_secure_random_string
ADMIN_PASSWORD=your_secure_admin_password
# Optional: Push Notifications
VAPID_PUBLIC_KEY=your_vapid_public_key
VAPID_PRIVATE_KEY=your_vapid_private_key
PUSH_CONTACT_EMAIL=mailto:[email protected]
5. Database Setup
Run the database setup (see Database Schema for details):
npm run db:setup
6. Start Development Server
npm run dev
Visit http://localhost:3000
to see your app running! ๐
๐ง Detailed Setup
Supabase Configuration
- Create a new Supabase project at supabase.com
- Get your credentials:
- Go to Settings โ API
- Copy
URL
andanon
key - Copy
service_role
key (keep this secret!)
- Set up authentication:
- Go to Authentication โ Settings
- Configure providers (Google OAuth recommended)
- Import database schema (see Database Schema)
OpenAI API Setup
- Create an OpenAI account at platform.openai.com
- Generate an API key:
- Go to API Keys section
- Create new secret key
- Copy the key (starts with
sk-
)
- Ensure GPT-4 access (may require payment method)
Development Tools (Optional)
Install additional development tools:
# TypeScript language server
npm install -g typescript
# ESLint for code quality
npm run lint
# Prettier for code formatting
npm run format
๐งช Verify Installation
Run Tests
# Unit tests
npm test
# Type checking
npm run type-check
# Build verification
npm run build
Check Key Features
- โ
App loads at
localhost:3000
- โ Authentication works (try Google login)
- โ Database connection established
- โ AI responses generate properly
- โ PWA features work (try going offline)
๐ ๏ธ Available Scripts
Script | Description |
---|---|
npm run dev |
Start development server with hot reload |
npm run build |
Create production build |
npm run start |
Start production server |
npm run lint |
Run ESLint for code quality |
npm run type-check |
Run TypeScript compiler check |
npm run test |
Run test suite |
npm run clean |
Clear Next.js cache |
๐ Project Structure
my-progress-planner/
โโโ src/
โ โโโ app/ # Next.js App Router pages
โ โ โโโ (auth)/ # Authentication routes
โ โ โโโ api/ # API endpoints
โ โ โโโ breakfast/ # Meal logging pages
โ โ โโโ lunch/
โ โ โโโ dinner/
โ โ โโโ summaries/ # Daily summaries
โ โโโ components/ # Reusable React components
โ โโโ lib/ # Utility functions
โ โโโ types/ # TypeScript definitions
โโโ public/ # Static assets
โ โโโ icons/ # PWA icons
โ โโโ splash/ # iOS splash screens
โ โโโ manifest.json # PWA manifest
โโโ .env.example # Environment template
โโโ next.config.mjs # Next.js configuration
โโโ tailwind.config.ts # Tailwind CSS config
โโโ tsconfig.json # TypeScript config
๐จ Troubleshooting
Common Issues
Node.js version issues:
# Install Node Version Manager
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.0/install.sh | bash
# Install and use Node 18
nvm install 18
nvm use 18
Port already in use:
# Kill process on port 3000
lsof -ti:3000 | xargs kill -9
# Or use different port
npm run dev -- -p 3001
Environment variables not loading:
- Ensure
.env.local
exists in root directory - Restart development server after changes
- Check for typos in variable names
Database connection issues:
- Verify Supabase URL and keys
- Check project status in Supabase dashboard
- Ensure database schema is properly set up
OpenAI API issues:
- Verify API key format (starts with
sk-
) - Check billing and usage limits
- Ensure GPT-4 access is enabled
โ Next Steps
Once installation is complete:
- Read the Configuration guide for advanced setup
- Follow the Quick Start Tutorial to understand core features
- Review the Development Workflow for contributing guidelines
- Explore the API Documentation for customization
๐ Need Help?
- ๐ Installation issues? Open an issue
- ๐ฌ Questions? Start a discussion
- ๐ง Direct support:
[email protected]