Skip to content

Latest commit

 

History

History
164 lines (115 loc) · 3.69 KB

README.md

File metadata and controls

164 lines (115 loc) · 3.69 KB

🎒 Pack-Pal

A web and mobile app for organizing and managing packing lists for trips, adventures, and activities. Create packs, categorize items, track weight and volume, and share with others. No account required for local use without cloud backup & sync.

🚀 Features

  • Smart Pack Organization: Hierarchical structure (Packs → Categories → Items)
  • Weight & Volume Tracking: Support for multiple units (g, kg, oz, lb, ml, l) with conversions
  • Drag & Drop: Intuitive item and category reordering on desktop and mobile
  • Visual Capacity Indicators: See how full your bag is at a glance with circular progress charts
  • Category Visibility: Hide categories from capacity calculations while keeping them in your pack
  • CSV Import/Export: Import from LighterPack or other Pack-Pal users exported CSV files
  • Pack Sharing: Share packs via public URLs
  • Worn Weight Tracking: Mark items as worn to exclude from pack weight
  • Email Authentication: Secure signup with email/password or Google Oauth (or use locally with no account!)
  • Cross-Platform: Mobile (iOS/Android via React Native) and Web

🛠️ Tech Stack

  • Frontend: React Native + Expo
  • Language: TypeScript
  • Backend: Supabase (PostgreSQL)
  • State Management: Zustand

📋 Prerequisites

  • Node.js 18+
  • npm/bun or yarn
  • Expo CLI
  • Supabase account

🏗️ Setup Instructions

1. Clone and Install Dependencies

cd Pack-Pal
npm install

2. Set Up Supabase

  1. Create a new project at supabase.com
  2. Go to Project Settings → API
  3. Copy your project URL and anon key
  4. Create a .env file in the root directory:
cp .env.example .env
  1. Add your Supabase credentials to .env:

🔐 Environment Variables

Required environment variables:

  • EXPO_PUBLIC_SUPABASE_URL: Your Supabase project URL
  • EXPO_PUBLIC_SUPABASE_KEY: Your Supabase anon public key

3. Set Up Database

Run the SQL migrations in your Supabase project:

  1. Go to your Supabase project dashboard → SQL Editor

  2. Run the main schema:

    • Copy contents of supabase/schema.sql
    • Execute in SQL Editor

  3. Run migrations in order:

    • supabase/migrations/20251112_add_pack_weight.sql
    • supabase/migrations/20251112_add_category_is_hidden.sql

4. Run the App

For Web:

npm run web

For iOS:

npm run ios

For Android:

npm run android

🚢 Deployment

Web (Vercel)

  1. Update Base URL:

    • Edit src/utils/helpers.ts
    • Change fallback in getBaseUrl() to your production domain

  2. Build and Deploy:

# Build for web
npm run build:web

# Deploy (if using Vercel CLI)
vercel --prod
  1. Set Environment Variables in Vercel:
    • Go to Project Settings → Environment Variables
    • Add EXPO_PUBLIC_SUPABASE_URL
    • Add EXPO_PUBLIC_SUPABASE_KEY

Mobile (Expo)

# Build for iOS
eas build --platform ios

# Build for Android
eas build --platform android

# Submit to stores
eas submit --platform ios
eas submit --platform android

Dev Commands

# Start development server
npm start

# Run on web
npm run web

# Run on iOS simulator
npm run ios

# Run on Android emulator
npm run android

# Lint code
npm run lint

# Format code
npm run format

# Build for production
npm run build:web

🐛 Troubleshooting

"Supabase configuration missing" error

  • Verify .env file exists and has correct values
  • Restart development server after adding env variables

🤝 Contributing

Contributions are welcome! Please feel free to submit an Issue or Pull Request.

📄 License

MIT License - feel free to use this project for personal or commercial purposes.