Welcome to NoobTube, a YouTube clone with a twist. Powered by the Mern stack, this app provides users with an interactive user experience centered around enjoying quick-scope videos.
This project was designed and built in under 1 week.
- Javascript
- MongoDB
- React
- Express
- Node.js
- User Authentication using BCrypt
- Video Index
- Video Show Page
- User Profile Page
- The video index pulls up a list of linked videos along with the video's thumbnail, title, and author.
- From this index, the user can navigate to the individual video show page.
- The thumbnail image is derived from a string manipulation of the YouTube videos url. Below is code snippet that demonstrates how the NoobTube thumbnail is derived.
- Main Feature: Embedded Video
- In addition to the embedded video, the video show page has both a like and comment section. The likes to dislikes ratio is reflected in a bar below the video. The comment section is below the like section.
- On the right side of the page, there's a shorter index of videos that the user can use to navigate to other videos.
- The user profile is essentially a re-creation of the video index, except only the user's videos appear on the page.
- Each user has a profile page that can be viewed by other users.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent