Documentation

Installation Guide

CampusConnect - College Dating App with Real-Time Matching & Chat (Flutter + Django)

Step-by-step Setup Verified Instructions Chat Support
Back to Project
Complete Guide

Complete Installation & Setup Guide

Follow this comprehensive guide to set up the College Dating App on your system. This guide covers installation for Windows, macOS, and Linux operating systems.

📋 Prerequisites & System Requirements

Before starting the installation, ensure your system meets the following requirements:

Required Software

  • Python: Version 3.8 or higher
  • Flutter SDK: Latest stable version (3.0+)
  • Git: For cloning the repository (optional)
  • Code Editor: VS Code or Android Studio recommended
  • Android Studio: For Android development and emulator
  • Xcode: For iOS development (macOS only)

System Requirements

  • RAM: Minimum 8GB (16GB recommended)
  • Disk Space: At least 10GB free space
  • Operating System: Windows 10/11, macOS 10.14+, or Linux (Ubuntu 18.04+)

Step 1: Install Python

For Windows

  1. Download Python from https://www.python.org/downloads/
  2. Run the installer (python-3.x.x.exe)
  3. Important: Check the box "Add Python to PATH" during installation
  4. Click "Install Now" and wait for completion
  5. Verify installation by opening Command Prompt and typing: 
    python --version
  6. Also verify pip installation: 
    pip --version

For macOS

  1. Open Terminal application
  2. Install Homebrew if not already installed: 
    /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
  3. Install Python using Homebrew: 
    brew install python@3.11
  4. Verify installation: 
    python3 --version
pip3 --version

For Linux (Ubuntu/Debian)

  1. Open Terminal
  2. Update package list: 
    sudo apt update
  3. Install Python: 
    sudo apt install python3 python3-pip python3-venv
  4. Verify installation: 
    python3 --version
pip3 --version

Step 2: Install Flutter SDK

For Windows

  1. Download Flutter SDK from https://docs.flutter.dev/get-started/install/windows
  2. Extract the zip file to a location like C:\src\flutter
  3. Add Flutter to PATH:
    • Search for "Environment Variables" in Windows search
    • Click "Environment Variables" button
    • Under "User variables", find "Path" and click "Edit"
    • Click "New" and add: C:\src\flutter\bin
    • Click "OK" to save
  4. Open new Command Prompt and verify: 
    flutter --version
  5. Run Flutter Doctor to check setup: 
    flutter doctor
  6. Install any missing dependencies shown by Flutter Doctor

For macOS

  1. Download Flutter SDK from https://docs.flutter.dev/get-started/install/macos
  2. Extract the downloaded file to your home directory: 
    cd ~
unzip ~/Downloads/flutter_macos_3.x.x-stable.zip
  3. Add Flutter to PATH by editing your shell profile: 
    nano ~/.zshrc
    Add this line: 
    export PATH="$PATH:$HOME/flutter/bin"
  4. Save and apply changes: 
    source ~/.zshrc
  5. Verify installation: 
    flutter --version
flutter doctor
  6. For iOS development, install Xcode from App Store
  7. Accept Xcode license: 
    sudo xcodebuild -license accept

For Linux

  1. Download Flutter SDK from https://docs.flutter.dev/get-started/install/linux
  2. Extract to home directory: 
    cd ~
tar xf ~/Downloads/flutter_linux_3.x.x-stable.tar.xz
  3. Add Flutter to PATH: 
    nano ~/.bashrc
    Add this line: 
    export PATH="$PATH:$HOME/flutter/bin"
  4. Apply changes: 
    source ~/.bashrc
  5. Install required dependencies: 
    sudo apt-get install clang cmake ninja-build pkg-config libgtk-3-dev
  6. Verify installation: 
    flutter --version
flutter doctor

Step 3: Install Android Studio

For All Operating Systems

  1. Download Android Studio from https://developer.android.com/studio
  2. Run the installer and follow the setup wizard
  3. During installation, ensure these components are selected:
    • Android SDK
    • Android SDK Platform
    • Android Virtual Device (AVD)
  4. After installation, open Android Studio
  5. Go to Settings → Appearance & Behavior → System Settings → Android SDK
  6. Install the latest Android SDK Platform (API 33 or higher)
  7. Install Flutter and Dart plugins:
    • Go to Settings → Plugins
    • Search for "Flutter" and click "Install"
    • This will also install the Dart plugin
    • Restart Android Studio

Create Android Virtual Device (Emulator)

  1. Open Android Studio
  2. Click on "More Actions" → "Virtual Device Manager"
  3. Click "Create Device"
  4. Select a device definition (e.g., Pixel 6) and click "Next"
  5. Select a system image (API 33 recommended) and click "Download" if needed
  6. Click "Next" and then "Finish"
  7. Your emulator is now ready to use

Step 4: Download and Extract Project Files

  1. Download the project ZIP file from CodeAj Marketplace
  2. Extract the ZIP file to a location of your choice (e.g., C:\Projects\dating-app on Windows or ~/Projects/dating-app on macOS/Linux)
  3. The extracted folder should contain two main directories:
    • backend - Django backend application
    • frontend - Flutter mobile application

Step 5: Backend Setup (Django)

Navigate to Backend Directory

Windows Command Prompt:

cd C:\Projects\dating-app\backend

macOS/Linux Terminal:

cd ~/Projects/dating-app/backend

Create Virtual Environment

For Windows:

python -m venv venv
venv\Scripts\activate

You should see (venv) prefix in your command prompt after activation.

For macOS/Linux:

python3 -m venv venv
source venv/bin/activate

You should see (venv) prefix in your terminal after activation.

Install Python Dependencies

For Windows:

pip install -r requirements.txt

For macOS/Linux:

pip3 install -r requirements.txt

This will install the following packages:

  • Django: Web framework
  • djangorestframework: REST API toolkit
  • djangorestframework-simplejwt: JWT authentication
  • django-cors-headers: CORS handling for mobile apps
  • Pillow: Image processing library

Configure Database

Run database migrations to create all necessary tables:

python manage.py migrate

This creates tables for:

  • User authentication
  • User profiles
  • Photos
  • Matches
  • Messages
  • Swipe actions

Create Superuser Account

Create an admin account to access Django admin panel:

python manage.py createsuperuser

You will be prompted to enter:

  • Username: Choose an admin username
  • Email: Enter your email address
  • Password: Create a strong password (must be at least 8 characters)
  • Password confirmation: Re-enter the same password

Start Development Server

Run the Django development server:

python manage.py runserver 0.0.0.0:8000

The backend server will start on http://127.0.0.1:8000

You can access the admin panel at http://127.0.0.1:8000/admin

Important: Keep this terminal window open. The server must be running for the mobile app to work.

Verify Backend Installation

  1. Open a web browser
  2. Navigate to http://127.0.0.1:8000/admin
  3. Login with the superuser credentials you created
  4. You should see the Django administration interface

Step 6: Frontend Setup (Flutter)

Important: Open a NEW terminal/command prompt window. Do not close the backend server terminal.

Navigate to Frontend Directory

Windows Command Prompt:

cd C:\Projects\dating-app\frontend

macOS/Linux Terminal:

cd ~/Projects/dating-app/frontend

Install Flutter Dependencies

flutter pub get

This will install all required packages:

  • provider: State management solution
  • http: For making API requests
  • flutter_secure_storage: Secure token storage
  • cached_network_image: Image caching
  • flutter_card_swiper: Swipe card functionality
  • intl: Date formatting

Configure API Endpoint

You need to configure the API base URL based on where you're running the app:

  1. Open the file lib/services/api_service.dart in your code editor
  2. Find the line containing static const String baseUrl
  3. Update based on your setup:
Option A: Running on Android Emulator
static const String baseUrl = 'http://10.0.2.2:8000/api';

Note: 10.0.2.2 is the special IP address that Android emulator uses to access localhost on your computer.

Option B: Running on Physical Android Device

First, find your computer's IP address:

Windows:

  1. Open Command Prompt
  2. Type: 
    ipconfig
  3. Look for "IPv4 Address" under your active network adapter
  4. Example: 192.168.1.100

macOS:

  1. Open Terminal
  2. Type: 
    ifconfig | grep "inet "
  3. Look for the IP address (not 127.0.0.1)
  4. Example: 192.168.1.100

Linux:

  1. Open Terminal
  2. Type: 
    ip addr show
  3. Look for inet under your active network interface
  4. Example: 192.168.1.100

Then update the baseUrl:

static const String baseUrl = 'http://YOUR_IP_ADDRESS:8000/api';

Example: http://192.168.1.100:8000/api

Option C: Running on iOS Simulator (macOS only)
static const String baseUrl = 'http://127.0.0.1:8000/api';

Important Configuration for Physical Devices

If testing on a physical device, ensure:

  • Your phone and computer are on the same WiFi network
  • Firewall allows connections on port 8000
  • Django server is running with 0.0.0.0:8000 (not just 127.0.0.1)

Enable Developer Mode on Physical Device

For Android:

  1. Go to Settings → About Phone
  2. Tap Build Number 7 times
  3. Go back to Settings → Developer Options
  4. Enable USB Debugging
  5. Connect phone to computer via USB
  6. Accept the USB debugging prompt on phone

For iOS (macOS only):

  1. Connect iPhone to Mac via USB
  2. Trust the computer on iPhone when prompted
  3. Open Xcode
  4. Go to Xcode → Preferences → Accounts
  5. Add your Apple ID

Step 7: Run the Application

Start an Emulator or Connect Device

Option A: Using Android Emulator

  1. Open Android Studio
  2. Click on "Device Manager" icon
  3. Click the Play button next to your virtual device
  4. Wait for the emulator to fully boot up

Option B: Using Physical Device

  1. Connect your phone via USB cable
  2. Ensure USB debugging is enabled
  3. Accept any connection prompts on your phone

Check Connected Devices

Verify Flutter can see your device:

flutter devices

You should see your emulator or physical device listed.

Run the Flutter App

Start the application:

flutter run

If multiple devices are connected, Flutter will ask you to choose one. The app will compile and launch on the selected device.

First-time compilation may take 2-5 minutes. Subsequent runs will be faster.

Hot Reload During Development

While the app is running, you can make code changes and see them instantly:

  • Press r in the terminal for hot reload
  • Press R for hot restart
  • Press q to quit

Step 8: Testing the Application

Method 1: Create Test Users via App

  1. Open the app on your device/emulator
  2. Click on "Sign Up" or "Register"
  3. Fill in the registration form:
    • Username: testuser1
    • Email: testuser1@college.edu
    • Password: Test@123
    • Confirm Password: Test@123
  4. Complete your profile:
    • Name: Test User One
    • Age: 21
    • Gender: Male/Female
    • College: XYZ College
    • Bio: Test bio
  5. Upload a profile photo
  6. Set your discovery preferences (age range, gender)
  7. Logout and repeat steps 2-6 to create a second user (testuser2)
  8. Important: Both users must be from the same college and match each other's preferences

Method 2: Create Test Users via Django Admin

  1. Open browser and navigate to http://127.0.0.1:8000/admin
  2. Login with your superuser credentials
  3. Click on "Users" under Authentication and Authorization
  4. Click "Add User" button
  5. Create user with username and password
  6. Click "Save and continue editing"
  7. Scroll down and add email, first name, last name
  8. Click "Save"
  9. Go to "Profiles" section
  10. Click "Add Profile"
  11. Select the user you just created
  12. Fill in profile details (age, gender, college, bio)
  13. Set preferences (min/max age, gender interest)
  14. Click "Save"
  15. Repeat for second user

Test the Matching Feature

  1. Login as User 1
  2. Go to Discovery/Explore section
  3. You should see User 2's profile card
  4. Swipe Right to Like User 2
  5. Logout from User 1
  6. Login as User 2
  7. Go to Discovery/Explore section
  8. You should see User 1's profile card
  9. Swipe Right to Like User 1
  10. You should see "It's a Match!" popup

Test the Messaging Feature

  1. After matching, go to Matches section
  2. Click on the matched user
  3. Type a message in the text field
  4. Click Send button
  5. Message should appear in the chat
  6. Switch to the other user account
  7. Open the same match
  8. You should see the message received
  9. Send a reply to test two-way communication

Common Issues and Solutions

Issue 1: "Connection Refused" Error in Flutter App

Problem: App cannot connect to backend server

Solutions:

  • Verify Django server is running (check terminal)
  • Check if baseUrl in api_service.dart is correct
  • For physical device, ensure phone and computer are on same WiFi
  • Check firewall settings allow port 8000
  • Try accessing http://YOUR_IP:8000/api in phone browser to verify connectivity

Issue 2: Images Not Loading in App

Problem: Profile photos not displaying

Solutions:

  • Check MEDIA_ROOT and MEDIA_URL in Django settings.py
  • Verify media files folder exists in backend directory
  • Ensure Django is serving media files in development (check urls.py)
  • Clear app cache and restart

Issue 3: "JWT Token Invalid" Error

Problem: Authentication errors after login

Solutions:

  • Verify djangorestframework-simplejwt is installed
  • Check JWT settings in Django settings.py
  • Logout and login again to get fresh tokens
  • Clear app data and try again

Issue 4: Flutter Build Errors

Problem: App fails to build or compile

Solutions:

  • Run: 
    flutter clean
  • Then run: 
    flutter pub get
  • Delete build folder manually if needed
  • Restart IDE and try again
  • Check Flutter version: 
    flutter doctor

Issue 5: CORS Errors

Problem: Cross-origin request blocked

Solutions:

  • Verify django-cors-headers is in INSTALLED_APPS
  • Check CORS_ALLOWED_ORIGINS in settings.py
  • Add your mobile app's origin to allowed origins
  • Restart Django server after changes

Issue 6: Database Errors

Problem: Database migration or query errors

Solutions:

  • Delete db.sqlite3 file
  • Run migrations again: 
    python manage.py migrate
  • Create superuser again if needed
  • If problems persist, delete migrations folder (except __init__.py) and recreate: 
    python manage.py makemigrations
python manage.py migrate

Issue 7: Virtual Environment Not Activating

Problem: Cannot activate Python virtual environment

Solutions:

  • Windows: Run PowerShell as Administrator and execute: 
    Set-ExecutionPolicy RemoteSigned
  • Then try activating again
  • Alternatively, use Command Prompt instead of PowerShell

Issue 8: Android Emulator Won't Start

Problem: Emulator fails to launch

Solutions:

  • Enable virtualization in BIOS (VT-x for Intel, AMD-V for AMD)
  • Ensure you have enough RAM (8GB minimum)
  • Try creating a new virtual device with lower resolution
  • Update Android Studio and SDK tools
  • Check Graphics settings in AVD configuration

Issue 9: Module Not Found Errors (Python)

Problem: ImportError for Django or other packages

Solutions:

  • Ensure virtual environment is activated (check for (venv) prefix)
  • Reinstall requirements: 
    pip install -r requirements.txt
  • Verify you're using the correct Python interpreter
  • Try upgrading pip: 
    pip install --upgrade pip

Issue 10: App Crashes on Startup

Problem: Flutter app crashes immediately

Solutions:

  • Check logs in terminal for error messages
  • Verify all dependencies are installed: 
    flutter pub get
  • Clear app data on device
  • Uninstall and reinstall the app
  • Check for null safety issues in code

Additional Configuration

Configure Allowed Hosts (Django)

For production or network access, update settings.py:

ALLOWED_HOSTS = ['localhost', '127.0.0.1', 'YOUR_IP_ADDRESS']

Configure CORS Settings (Django)

Update CORS_ALLOWED_ORIGINS in settings.py:

CORS_ALLOWED_ORIGINS = [
    "http://localhost:8000",
    "http://127.0.0.1:8000",
    "http://10.0.2.2:8000",
]

Media Files Configuration (Django)

Ensure these settings are in settings.py:

MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

Database Migration (If Models Change)

If you modify Django models, run:

python manage.py makemigrations
python manage.py migrate

Daily Development Workflow

Starting Work Session

  1. Open two terminal windows
  2. Terminal 1 - Backend: 
    cd backend
venv\Scripts\activate  # Windows
source venv/bin/activate  # macOS/Linux
python manage.py runserver 0.0.0.0:8000
  3. Terminal 2 - Frontend: 
    cd frontend
flutter run

Stopping Work Session

  1. In Flutter terminal: Press q to quit
  2. In Django terminal: Press Ctrl+C to stop server
  3. Deactivate virtual environment: 
    deactivate

API Testing with Postman (Optional)

Install Postman

  1. Download from https://www.postman.com/downloads/
  2. Install and create a free account

Test API Endpoints

Register User:

  • Method: POST
  • URL: http://127.0.0.1:8000/api/register/
  • Body (JSON): 
    {
"username": "testuser",
"email": "test@example.com",
"password": "Test@123",
"password2": "Test@123"
}

Login:

  • Method: POST
  • URL: http://127.0.0.1:8000/api/login/
  • Body (JSON): 
    {
"username": "testuser",
"password": "Test@123"
}
  • Copy the "access" token from response

Get Profile (Requires Authentication):

  • Method: GET
  • URL: http://127.0.0.1:8000/api/profile/
  • Headers: Authorization: Bearer YOUR_ACCESS_TOKEN

Production Deployment Notes

When deploying to production, consider:

Django Backend

  • Set DEBUG = False in settings.py
  • Configure proper ALLOWED_HOSTS
  • Use PostgreSQL or MySQL instead of SQLite
  • Set up proper STATIC_ROOT and MEDIA_ROOT
  • Use environment variables for sensitive data
  • Deploy with Gunicorn or uWSGI
  • Set up HTTPS with SSL certificates
  • Configure proper CORS settings

Flutter Frontend

  • Build release APK: 
    flutter build apk --release
  • Build iOS app: 
    flutter build ios --release
  • Update API baseUrl to production server URL
  • Configure app signing for Play Store/App Store
  • Test on multiple devices and screen sizes

Support & Resources

Official Documentation

  • Flutter: https://docs.flutter.dev
  • Django: https://docs.djangoproject.com
  • Django REST Framework: https://www.django-rest-framework.org

Video Tutorials

Search on YouTube for:

  • "Flutter REST API integration tutorial"
  • "Django REST Framework authentication"
  • "Flutter Provider state management"

Getting Help

  • Check the project README.md file for additional information
  • Review error messages carefully in terminal
  • Use Flutter Doctor: 
    flutter doctor -v
  • Search error messages on Stack Overflow
  • Contact CodeAj support for project-specific help

Additional Services from CodeAj

  • Project Setup Assistance: Get help with installation and configuration
  • Source Code Explanation: Detailed walkthrough of the codebase
  • Custom Features: Add or modify features based on your requirements
  • Project Report: Complete documentation and presentation materials
  • Research Paper Writing: Academic paper for journal publication
  • Mentorship: One-on-one guidance throughout your project

Installation Success Checklist

Verify your installation is complete:

  • ✓ Python 3.8+ installed and verified
  • ✓ Flutter SDK installed and flutter doctor passes
  • ✓ Android Studio installed with Flutter plugin
  • ✓ Backend virtual environment created and activated
  • ✓ Backend dependencies installed from requirements.txt
  • ✓ Database migrations completed successfully
  • ✓ Superuser account created
  • ✓ Django server running on port 8000
  • ✓ Frontend dependencies installed with flutter pub get
  • ✓ API baseUrl configured correctly
  • ✓ App runs on emulator or physical device
  • ✓ Test users created and can login
  • ✓ Matching feature works between users
  • ✓ Messaging feature functional

If all items are checked, your installation is complete and successful!

Next Steps After Installation

  1. Familiarize yourself with the codebase structure
  2. Read through the API documentation
  3. Customize UI colors and branding
  4. Add additional features based on requirements
  5. Test thoroughly on different devices
  6. Prepare project documentation and presentation
  7. Create demo video showcasing features
  8. Document any customizations made

Conclusion

Congratulations on successfully setting up the College Dating App! This comprehensive installation guide has walked you through every step from prerequisites to testing. You now have a fully functional dating application that demonstrates modern mobile development practices using Flutter and Django.

This project serves as an excellent foundation for your final year project, showcasing your ability to build full-stack applications with authentication, real-time features, and modern UI/UX design. The skills you've gained through this setup process are highly valuable in the software development industry.

For any additional assistance, custom modifications, or advanced features, feel free to explore the additional services offered by CodeAj Marketplace. Happy coding!

Need Help?

Our team is here to assist you with installation and setup.

Chat with Us
WhatsAppTelegramSignal
Chat with us