/Video-Notes

U Notes is a video note taking full-stack application created with React.js, MongoDB, and Auth0. The user can search videos, take notes as they are watching the video, and save all of that together for future reference.

Primary LanguageJavaScript

U Notes

U Notes is a video note taking full-stack application created with React.js, MongoDB, and Auth0. The user can search videos, take notes as they are watching the video, and save all of that together for future reference. Using the Youtube Data API, users have access to all videos on the platform. When creating notes, the user is able to log the time of the video so they can easily find the exact elapsed time that the note was created. The user must log in or create an account to begin using U Notes; Once the user is logged in, they are able to save data to their personal account and retrieve it at any given time.

Table of Contents

General Info

U Notes meets the following criteria:

GIVEN I am using a video note taking app
WHEN I click the "Let's Get Started" button
THEN I am redirected to the login/create user page
WHEN I login/create an account
THEN I am redirected to the video search page
WHEN I search a video
THEN I am presented with a list of 15 related videos
WHEN I click on the video I want to watch/take notes on
THEN I am redirected to the "video notes" page
WHEN I create a note with the time stamp
THEN the note saves to the timeline
WHEN I click on the "My Video Notes" tab
THEN all my saved notes are shown on that page with the corresponding video
WHEN I click on the trash can on the card
THEN the card is deleted from my page and database
WHEN I click on the addition screen on the card
THEN I am redirected back to the "video notes" page of the chosen video w/ my saved notes
WHEN I click "Log Out" on the navbar
THEN my user is logged out and I am redirected back to the landing page

Link to Deployed Page

https://desolate-shore-89926.herokuapp.com/

Landing Page

image

Login or Signup Page (Auth0)

image

Video Search Page

image

Video Notes Page

image

My Saved Video Notes Page

image

Technologies

This project is created with:

Frameworks used:

APIs used:

Authors