Setup & Installation - Kriaa89/VivaFit GitHub Wiki

//// filepath: c:\Users\abdal\OneDrive\Bureau\VivaFit\Setup-&-Installation.md

Setup & Installation

Welcome to the Setup & Installation guide for VivaFit. Follow these steps to set up the project on your local machine and get started with development.

🚀 Prerequisites

Before you begin, ensure you have:

  • Node.js (v16+)
  • npm (or yarn)
  • MongoDB (local installation or MongoDB Atlas account)
  • A Firebase account configured for Authentication and Storage

⚙️ Installation Workflow

Below is a workflow diagram outlining the installation process:

flowchart TD
    A[Clone the Repository] --> B[Install Dependencies]
    B --> C[Configure Environment Variables]
    C --> D[Set Up MongoDB Connection]
    D --> E[Set Up Firebase Configuration]
    E --> F[Run the Development Servers]
    F --> G[Access the Application]

🛠️ Detailed Steps

1. Clone the Repository

Clone the VivaFit repository to your local machine:

git clone <repository-url>
cd VivaFit

2. Install Dependencies

Install dependencies for both the client and server:

# For the frontend
cd client
npm install

# For the backend
cd ../server
npm install

3. Configure Environment Variables

Create a .env file in both the client and server directories.

Client (.env)

VITE_FIREBASE_API_KEY=your_firebase_api_key
VITE_FIREBASE_AUTH_DOMAIN=your_firebase_auth_domain
VITE_FIREBASE_PROJECT_ID=your_firebase_project_id
VITE_FIREBASE_STORAGE_BUCKET=your_firebase_storage_bucket
VITE_FIREBASE_MESSAGING_SENDER_ID=your_firebase_messaging_sender_id
VITE_FIREBASE_APP_ID=your_firebase_app_id
VITE_API_BASE_URL=http://localhost:8000/api

Server (.env)

PORT=8000
MONGODB_URI=your_mongodb_connection_string
JWT_SECRET=your_jwt_secret
FIREBASE_PROJECT_ID=your_firebase_project_id
EXERCISE_DB_API_KEY=your_exercisedb_api_key

4. Set Up MongoDB Connection

Ensure that MongoDB is running locally, or update your connection string in the server's .env file if using MongoDB Atlas.

5. Set Up Firebase Configuration

Place your firebase-service-account.json file in the server root directory and verify that the Firebase credentials match your project configuration.

6. Run the Development Servers

Start the frontend and backend servers:

Frontend

cd client
npm run dev

Backend

cd ../server
npm run dev

7. Access the Application

Open your browser:

📦 Additional Notes

  • Icons & Emojis: Icons (e.g., 🚀, ⚙️, 🛠️) are used throughout this guide for visual cues.
  • Workflow Diagram: The Mermaid diagram provides a high-level view of the installation process.
  • Troubleshooting: If you run into issues, double-check your environment variable configurations and verify that your MongoDB and Firebase credentials are correct.