Skip to main content

Prerequisites

Before you begin, ensure you have:
  • Node.js 16.x or higher
  • MongoDB (local or Atlas account)
  • Google Cloud Console account (for OAuth)
  • Git

Setup Steps

1

Clone the Repository

Clone MeetMates and navigate to the project directory:
Terminal
git clone https://github.com/divyanshraj0408/meetmates.git
cd meetmates
2

Install Dependencies

Install dependencies for both frontend and backend:
Terminal
# Install backend dependencies
cd backend
npm install

# Install frontend dependencies
cd ../frontend
npm install
3

Set Up Google OAuth

  1. Go to Google Cloud Console
  2. Create a new project or select an existing one
  3. Enable the Google+ API
  4. Navigate to CredentialsCreate CredentialsOAuth client ID
  5. Configure the OAuth consent screen
  6. Set Authorized JavaScript origins: http://localhost:5173
  7. Set Authorized redirect URIs: http://localhost:5173
  8. Copy your Client ID for the next step
Save your Google Client ID - you’ll need it for environment configuration.
4

Configure Environment Variables

Create .env files in both backend and frontend directories:Backend (backend/.env):
MONGODB_URI=mongodb://localhost:27017/meetmates
JWT_SECRET=your-super-secret-jwt-key-change-this
CORS_ORIGIN=http://localhost:5173
PORT=3001
GOOGLE_CLIENT_ID=your-google-client-id-from-step-3
Frontend (frontend/.env):
VITE_BACKEND_URL=http://localhost:3001
VITE_GOOGLE_CLIENT_ID=your-google-client-id-from-step-3
Never commit your .env files to version control. They contain sensitive credentials.
5

Start MongoDB

If you’re running MongoDB locally:
Terminal
# macOS (with Homebrew)
brew services start mongodb-community

# Linux
sudo systemctl start mongod

# Windows
net start MongoDB
Alternatively, use MongoDB Atlas and update your MONGODB_URI accordingly.
6

Start the Backend Server

In the backend directory:
Terminal
npm start
You should see:
Server running on port 3001
MongoDB connected
7

Start the Frontend

In a new terminal, navigate to the frontend directory:
Terminal
npm run dev
Your application will be available at http://localhost:5173

Verify Your Setup

  1. Frontend: Open http://localhost:5173 - you should see the MeetMates landing page
  2. Backend: Check http://localhost:3001 - the server should be running
  3. Database: Verify MongoDB is connected (check backend console output)

Test the Application

  1. Click the Sign in with Google button
  2. Select your Google account
  3. Grant the requested permissions
  4. You should be redirected to the main chat interface
  1. After signing in, click Start Chat
  2. Enable camera and microphone permissions
  3. You’ll enter the waiting room
  4. Open a second browser window (or incognito tab) and repeat
  5. Both users should be matched and connected

Common Issues

If you see CORS errors in the browser console:
  • Verify CORS_ORIGIN in backend/.env matches your frontend URL
  • Restart the backend server after changing environment variables
If Socket.IO connection fails:
  • Check that VITE_BACKEND_URL in frontend/.env is correct
  • Verify the backend server is running on port 3001
  • Check for firewall blocking WebSocket connections
If MongoDB fails to connect:
  • Verify MongoDB is running: mongosh (should connect successfully)
  • Check MONGODB_URI format in backend/.env
  • For Atlas: verify IP address is whitelisted
If Google sign-in fails:
  • Verify GOOGLE_CLIENT_ID matches in both .env files
  • Check authorized JavaScript origins in Google Cloud Console
  • Ensure OAuth consent screen is published (not in testing mode with restricted users)

Next Steps

Installation Details

Learn more about detailed installation and configuration options

API Reference

Explore the backend API endpoints and Socket.IO events
For testing with multiple users locally, open multiple browser windows or use incognito mode with different Google accounts.

Build docs developers (and LLMs) love