Architecture Overview

Overview

User Registration and Authentication

  • Registration: The client collects user information (e.g., username, password) and sends it to the server via an HTTP POST request. The server processes this data, creates a new user record in the database, and returns a success response to the client.

  • Login: The client sends user credentials to the server via an HTTP POST request. The server queries the database to verify the credentials. If authentication is successful, the server generates a JSON Web Token (JWT) and sends it back to the client for session management.

Video Search

  • Search Query: Search Query: The client sends a search query to the server. The server forwards this query to the YouTube API, receives the results, filters the unwanted data, and sends the relevant results back to the client.

Note Management

  • Editing/Saving Notes: The client sends note data (e.g., content, title) to the server via an HTTP POST or PUT request. The server updates the database with the new or modified note data and sends a confirmation response back to the client.

Profile Picture Management

  • Upload/Delete Profile Picture: The client sends a request to the server to upload or delete a profile picture. The server processes this request by interacting with Cloudinary to store or delete the image. Upon completion, Cloudinary sends a response to the server, which then informs the client and updates the UI accordingly.

User Feedback

  • Sending Feedback: The client sends feedback messages to the server via an HTTP POST request. The server forwards this message to EmailJs. EmailJs then sends the message to the designated recipient and responds back to the server with a success status. The server relays this success response to the client, confirming that the feedback was sent successfully.

Detailed Description

User Registration and Authentication

  • Client-Side:

    • The user fills out the registration form.
    • The form data is sent to the server using an HTTP POST request to the registration endpoint.
    • On login, the user submits their credentials, which are sent to the server using an HTTP POST request to the login endpoint.

  • Server-Side:

    • Receives the registration data, validates it, and stores it in the database.
    • On login, the server queries the database to authenticate the user.
    • If authentication is successful, a JWT is generated and sent to the client for session management.

Video Search

  • Client-Side:

    • The user enters a search query for a video.
    • The query is sent to the server using an HTTP GET or POST request.

  • Server-Side:

    • Receives the search query and sends a request to the YouTube API.
    • Filters the response to extract relevant video data.
    • Sends the filtered results back to the client.

Note Management

  • Client-Side:

    • The user edits or creates a note and submits it.
    • The note data is sent to the server using an HTTP POST or PUT request.

  • Server-Side:

    • Receives the note data and updates the database accordingly.
    • Sends a confirmation response back to the client.

Profile Picture Management

  • Client-Side:

    • The user uploads or deletes their profile picture.
    • The request is sent to the server.

  • Server-Side:

    • Processes the request and interacts with Cloudinary to upload or delete the image.
    • Cloudinary responds to the server with the outcome.
    • The server updates the client UI accordingly.

User Feedback

  • Client-Side:

    • The user submits a feedback form.
    • The feedback data is sent to the server using an HTTP POST request.

  • Server-Side:

    • Forwards the feedback message to EmailJs.
    • EmailJs sends the message and responds back to the server with a success status.
    • The server informs the client that the message was sent successfully.