PS Meeting App

Overview

PS Meeting App is a Next.js-based web application for managing and conducting virtual meetings. It features user authentication, a dashboard for managing upcoming and past meetings, personal meeting rooms, and recording functionalities.

Features

• Secure User Authentication: Utilize Clerk for user registration and login, ensuring secure access to the app.
• Centralized Meeting Dashboard: View and manage all your meetings from a single dashboard. It includes sections for:
  • Upcoming Meetings: Schedule and view upcoming meetings.
  • Previous Meetings: Access details of past meetings.
  • Personal Room: Host private meetings in a dedicated personal room.
  • Recordings: View and manage meeting recordings.
• Modern UI Components: Enhanced user experience with ShadCN UI components for alert dialogs, dialogs, dropdown menus, and toasts.
• Responsive Layout: Features a sidebar and top navbar for easy navigation across the app.
• Stream Integration: Seamless video conferencing capabilities using Stream SDKs.

Technology Stack

PS Meeting App is built using a modern stack of web technologies:

• Next.js: Framework for React applications, enabling server-side rendering and static site generation.
• React: JavaScript library for building user interfaces.
• TypeScript: Strongly typed programming language that builds on JavaScript.
• TailwindCSS: Utility-first CSS framework for styling.
• ShadCN UI: Collection of UI components for React applications, used for dialogs, alerts, dropdowns, and toasts.
• Stream SDK: Provides video conferencing and real-time communication capabilities.

Screenshots

Here are some screenshots of the PS Meeting App in action:

Getting Started

Prerequisites

• Node.js (>= 18)
• npm (>= 8)

Installation

1. Clone the repository:

   git clone https://github.com/mustafa-j-wardeh17/ps-meeting-app.git
   cd ps-meeting-app

2. Install dependencies:

   npm install

3. Configure environment variables:

   Create a .env.local file in the root directory and add necessary environment variables. Refer to the .env.example file for required variables.

Running the App

• Development Mode:

  npm run dev

  Access the app at http://localhost:3000.

• Production Mode:

  npm run build
  npm start

Usage

• Authentication:
  • Visit /auth/sign-up to create a new account.
  • Visit /auth/sign-in to log in.
• Dashboard:
  • Home: /
  • Upcoming Meetings: /dashboard/upcoming
  • Previous Meetings: /dashboard/previous
  • Recordings: /dashboard/recordings
  • Personal Room: /dashboard/personal-room

Scripts

• npm run dev: Start the development server.
• npm run build: Build the application for production.
• npm start: Start the production server.
• npm run lint: Run ESLint to lint the codebase.

Upcoming Features

We are continually working to improve the PS Meeting App. Here are some features that are in the pipeline:

• Enhanced Meeting Scheduling: Advanced scheduling options with calendar integration.
• Improved Analytics: Detailed analytics for meeting performance and user engagement.
• Customizable Meeting Rooms: Personalize your meeting room settings and layouts.

Getting Involved

If you want to contribute to the PS Meeting App or report issues, please visit our GitHub Issues page. We welcome contributions and feedback to make this app better for everyone!

Happy Meeting!