Skip to content

Latest commit

 

History

History
executable file
·
32 lines (28 loc) · 1.77 KB

README.md

File metadata and controls

executable file
·
32 lines (28 loc) · 1.77 KB

React Videos App

Creating this Videos App to have better ideas and more practice with React basics and fundamental elements

Kowalski, are you there?

App Summary

  • In this Videos App I practiced writing basic and fundamental React elements

  • Videos App is very similar to the Photos App that was made before this

  • A user can enter a search term and a display will render videos that match the search term ie: tulips returns videos of tulips

  • What was learned:

    • Component Design and project structure
    • Create a search form for the user
    • Create, alter and handle events and submissions
    • Solve context issues
    • Connecting an external API(Youtube) and ability to request/retrieve/display data
    • Utilized Axios with Async Await to request data
    • Controlled and Uncontrolled elements
    • Communicating from Child to Parent and invoking callbacks in Children
    • So far, different styling with separate custom CSS and using Semantic UI's grid system
    • SearchBar: Send search term to an App/Parent component which then will actually make the API request
    • VideoList: Render entire list of videos(VideoItem)
    • VideoItem: One specific video that will be contained in the VideoList
    • VideoDetail: Responsible for showing an actual video player that will play the fetched video with a few details of title and description
    • Built App to have 2 State props(videos and selectedVideo)
    • Use this.setState for both State props on updating videos(VideoList & VideoDetail) with a new search
    • None of the videos are fake, videos can be searched for and played on application

  • What this App doesn't do:

    • There is no user auth/id/login
    • The Videos App does not display a private list from a specific user
    • Actions such as: comments/likes/dislikes/shares/etc are not present