Skip to content

AskExpert Frontend is the UI for the AskExpert platform, enabling real-time chat and video consultations. Built with React and Vite, it covers authentication, chat, and user management. Configure environment variables as detailed in the README.

Notifications You must be signed in to change notification settings

muhsinachipra/AskExpert_Frontend

Repository files navigation

AskExpert Frontend

Welcome to the AskExpert frontend repository! This project powers the user interface of the AskExpert platform, providing an engaging and intuitive experience for connecting users with experts through real-time chat and video calls.

Table of Contents

Getting Started

To get started with the AskExpert frontend:

  1. Clone the repository:

    git clone https://github.com/muhsinachipra/AskExpert_Frontend.git
  2. Navigate into the project directory:

    cd askexpert-frontend
  3. Install the dependencies:

    npm install
  4. Run the development server:

    npm run dev
  5. Open your browser and navigate to http://localhost:5173 to view the application.

Project Structure

The project is organized as follows:

  • public/ - Static assets such as images and SVGs.
  • src/ - Source code for the application.
    • app/ - Configuration and setup files, including Firebase configuration.
    • assets/ - Static assets used in components.
    • components/ - Reusable React components.
    • constants/ - Constants used throughout the application.
    • context/ - React context providers.
    • hooks/ - Custom React hooks.
    • lib/ - Utility functions.
    • middleware/ - Custom middleware functions.
    • pages/ - React components representing different pages in the application.
    • routes/ - Routing configurations.
    • slices/ - Redux slices and API slices.
    • types/ - TypeScript types and interfaces.
    • validation/ - Validation schemas and types.

Environment Variables

Create a .env file in the root directory and set the following environment variables:

  • VITE_BASE_URL: The base URL of your backend API.
  • VITE_GOOGLEAUTH_CLIENTID: Your Google OAuth client ID.
  • VITE_GOOGLEAUTH_SECRET: Your Google OAuth client secret.
  • REACT_APP_FIREBASE_API_KEY: Your Firebase API key.
  • REACT_APP_FIREBASE_AUTH_DOMAIN: Your Firebase Auth domain.
  • REACT_APP_FIREBASE_PROJECT_ID: Your Firebase project ID.
  • REACT_APP_FIREBASE_STORAGE_BUCKET: Your Firebase storage bucket.
  • REACT_APP_FIREBASE_MESSAGING_SENDER_ID: Your Firebase messaging sender ID.
  • REACT_APP_FIREBASE_APP_ID: Your Firebase app ID.
  • VITE_STRIPE_PUBLIC_KEY: Your Stripe public key.
  • VITE_ZEGOCLOUD_SECRET: Your ZEGOCLOUD secret key.
  • VITE_ZEGOCLOUD_APPID: Your ZEGOCLOUD app ID.

Development

  • To start the development server:

    npm run dev
  • To build the application for production:

    npm run build

Deployment

The application is configured to be deployed with Vercel. For deployment instructions, check the vercel.json file or refer to Vercel's documentation.

License

This project is licensed under the MIT License. See the LICENSE file for details.

About

AskExpert Frontend is the UI for the AskExpert platform, enabling real-time chat and video consultations. Built with React and Vite, it covers authentication, chat, and user management. Configure environment variables as detailed in the README.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages