Client in ViteJS+React (JS+SWC)

Getting Started

Description

This is the client of a website which allows to upload an audio file and send it to a Discord Bot through a custom API and play it in a Discord Channel.

Prerequisites

To run this project locally, you will need to have NPM and NodeJS installed.
This project is developed on NodeJS v16.14.2.

• Download NodeJS

Setup

1. Clone the repository inside your project folder.

   git clone https://github.com/hypetf/MMUDiscBot-client.git

2. Install all required npm packages by running:

   npm install

3. Get the client running with:

   npm run dev

Client should be live on:

http://localhost:5173/

Features and requirements

Client

• Setup all routes and protected routes
• Create all pages' UI
• Communicate with server to login user
• Allow to logout
• Allow to revoke access token
• Implement notifications
• Create interface for uploading files
• Display list of uploaded files
• Use state manager (zustand)
• Make UI responsive

Server

• Use Discord API as login method, revoke access token, etc...
• Handle sessions and cors
• Implement logout and clear session
• Handle Upload POST route to handle uploads from client
• Verify if user is in voice channel and guild before saving and playing file
• Clear space after song is queued

Bot

• Play music in a voice channel
• Implement queue and functionalities like: pause, skip, resume, stop
• Implement record functionality and implement Speech-To-Text
• Use transcribed text to use functionalities already implemented