Donation Wagon connects donors with those in need through an intuitive mobile platform. The app allows users to donate clothing and toys, schedule pickups, and track their donation history. The app features AI-powered item recognition to streamline the donation process and a gamified experience with leaderboards to encourage community participation.
- π€AI-Powered Item Recognition: Leverages advanced AI for rapid and accurate identification of item details, making the donation process smoother and faster by automatically detecting clothing types, colors, sizes, and genders from uploaded images
- Multi-Item Donations: Support for adding multiple clothing or toy items in a single donation
- Rich Media Support: Upload and manage multiple images per donation item
- Smooth UX: Animated scrolling and intuitive form navigation
- Flexible Pickup Scheduling: Choose date and time for donation pickup
- Location Options: Use GPS or manual address entry
- Delivery Instructions: Add special notes for drivers
- Status Tracking: Monitor the status of scheduled pickups
- Donation History: View past and pending donations
- Achievement System: Earn badges and track contribution metrics
- Community Impact: Visualize personal impact on community needs
- Active Pickups Management: Dedicated interface for drivers to manage assigned pickups
- Route Optimization: Efficient routing for multiple pickups
- Status Updates: Real-time status updates for donors and administrators
- Leaderboards: Competitive element to encourage regular donations
- Impact Metrics: Visual representation of community impact
- Exploration: Discover donation opportunities and community needs
The easiest way to start the app is to use the included batch file:
start-app.batThis will start both the backend server and the Expo development server in separate windows.
-
Navigate to the backend directory:
cd backend -
Install dependencies:
npm install
-
Start the backend server with hot reloading:
npm run dev
-
From the project root, install dependencies:
npm install
-
Start the Expo development server:
npx expo start --clear
- Backend: Uses nodemon to automatically restart when files change
- Frontend: Uses Expo's fast refresh to update the app without restarting
- The app is configured to suppress development error overlays
- Custom error handling is implemented through the ErrorBoundary component
- API requests are handled through a custom useApi hook for consistent error management
- Any user can access the landing page without authentication
- When a non-signed-in user tries to navigate to other sections (Donate, Schedule, Profile) or interact with buttons on the landing page, they are redirected to sign in first
- The authentication state is persisted using AsyncStorage
- The AuthContext provides authentication-related functionality throughout the app
- Frontend: React Native with Expo
- UI Components: Custom-styled with a warm color palette (e.g., earth tones and soft hues) to create an inviting atmosphere that aligns with themes of donation and giving
- Navigation: Expo Router for type-safe navigation
- State Management: React Context API and custom hooks
- AI Integration: Google GenAI API for image recognition
- Media Handling: Expo Image Picker for camera and gallery access
- Backend: Express.js
- Database: MongoDB
- Authentication: JWT tokens with bcrypt password hashing
- Location Services: Expo Location for GPS functionality
- DonationDetails: Main component for creating and editing donations with AI detection
- DonationCart: Manages the collection of items being donated
- AI Identify: Button that triggers AI analysis of uploaded images
- ScheduleScreen: Interface for scheduling pickup times and locations
- LocationPicker: Component for selecting between GPS and manual address entry
- DateTimePicker: Custom calendar and time selection interface
- ActivePickups: Shows drivers their assigned pickups for the day
- DriverDashboard: Central hub for driver activities and metrics
- Screen reader support for critical UI elements
- Scalable text sizes for better readability
- High contrast color options
- Keyboard navigation support
If you encounter connection issues:
- Make sure both the backend and frontend servers are running
- Verify that the API URL in
hooks/useApi.jsmatches your local network IP - Check that CORS is properly configured in the backend
- Restart both servers using the
start-app.batscript
Please read our contributing guidelines before submitting pull requests to the project.
This project is licensed under the MIT License - see the LICENSE file for details.