@codesweetly/react-youtube-playlist

React YouTube Playlist

⚠ WARNING: Use with caution!
This package is not stable. It still contains bugs! The stable version will start at 1.0.0 Working on releasing the stable version soon...

A React component for displaying YouTube video playlists on a web app. Create a beautiful gallery of YouTube videos.

Live Demo and Tutorial

Available at: https://codesweetly.com/react-youtube-playlist

Installation

Using npm:

npm install @codesweetly/react-youtube-playlist

Using yarn:

yarn add @codesweetly/react-youtube-playlist

Usage

import YouTubePlaylist from "@codesweetly/react-youtube-playlist";

function App() {
  return (
    <YouTubePlaylist
      apiKey="YOUR_YOUTUBE_API_KEY"
      playlistId="YOUR_YOUTUBE_PLAYLIST_ID"
      uniqueName="THIS_PLAYLIST_INSTANCE_NAME"
    />
  );
}

Required Props

Props	Description
apiKey	The apiKey props is a string value that specifies your project's YouTube API key. (Learn how to get an API key)
playlistId	The playlistId props is a string value that specifies the ID of the YouTube playlist you wish to display. Note: A playlist's ID is the list of characters after the "list=" in the URL—for instance, https://www.youtube.com/playlist?list=playlistID.
uniqueName	Give the <YouTubePlaylist> instance a unique name. Note: No two <YouTubePlaylist> on a single page must have the same name. Use the HTML id attribute's naming convention for the uniqueName prop.