https://github.com/francis7575/vidtube
https://github.com/francis7575/vidtube
material-ui mongodb nodejs react tailwindcss typescript
Last synced: 4 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/francis7575/vidtube
- Owner: Francis7575
- Created: 2024-05-23T16:11:25.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2024-10-09T04:45:22.000Z (8 months ago)
- Last Synced: 2025-01-12T08:42:02.374Z (5 months ago)
- Topics: material-ui, mongodb, nodejs, react, tailwindcss, typescript
- Language: TypeScript
- Homepage: https://vidtube-pi.vercel.app
- Size: 1.46 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Vidtube
Overview
A Video Player project utilizing the YouTube API from RapidAPI, featuring user authentication with basic login and signup functionality, it contains the following features:
During this project, I implemented a dynamic data-fetching function to handle API requests from various endpoints. This function was designed to handle different functionalities, such as retrieving video data and handling search queries.
To avoid passing props excessively throughout components, I created a context using Boolean values. This approach allowed flexible customization of functionalities across components without the need to pass numerous props.
On the backend, I used Express and the MVC pattern to structure the application efficiently. I implemented user authentication with basic login and signup functionalities. For managing user sessions, I used cookie-based sessions, which help to keep users logged in for a specified duration after authentication.
For the frontend, I created a custom hook that connects with the backend, ensuring efficient and reliable data retrieval. Additionally, I implemented dynamic routing to enable navigation to specific channels or videos using their respective IDs. I also developed a search bar component to allow users to search for content based on the input value and ensure the application is fully responsive and accessible across all different devices.
Technologies and Integrations
React, Typescript, TailwindCSS, Material UI and Node.js.
API Link
Server is running in BACKEND_PORT=3000
Explore the project
For a deeper dive into the project and its features, visit the
project page.