Youtube Player Demo

API Key

AIzaSyA_Ai0pJIyGMMfS8CIkiaRMkqxvJSVZTxM

Youtube NPM package installer

npm install --save youtube-api-search

Functional component

Is a component that is a function. Some info goes in and some jsx comes out.

Class component

Is a component that has some internal record keeping (state).

State

When the state of a component changes this component is immediattely rerendered, as well as the children
of this component.

Downwards Dataflow

means that only the most parent component should fetch data from a data source.

Importing Youtube API

import YTSearch from 'youtube-api-search';

// how to use
YTSearch({
    key: API_KEY,
    term: 'Mellotron'
}, function(data) {
    console.log(data);
});

Props (properties)

if you convert a functional component to a class component then props becomes this.props.

this.props is available to all functions in a class component.

Last update: Tue, 13 Sep 2022 14:32:15