JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html> 
<html> 
<head> 
	<title>紅毛港文化園區</title> 
	<meta name="viewport" content="width=device-width, initial-scale=1"> 
	<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
</head> 

<body> 
	<div id="VideoThumbs"><!-- 這裡會產生YouTube Thumbs列出影片 --></div>

	<script type="text/javascript">
	
	// Get Uploads Playlist
	$.get(
	   "https://www.googleapis.com/youtube/v3/channels",{
	   part : 'contentDetails', 
	   forUsername : 'hongmaogang',
	   key: '你自己的憑證金鑰'},
	   function(data) {
		  $.each( data.items, function( i, item ) {
			  pid = item.contentDetails.relatedPlaylists.uploads;
			  getVids(pid);
		  });
	  }
	);

	//Get Videos
	function getVids(pid){
		$.get(
			"https://www.googleapis.com/youtube/v3/playlistItems",{
			part : 'snippet', 
			maxResults : 50,
			playlistId : pid,
			key: '你自己的憑證金鑰'},
			function(data) {
				var results;
				$.each( data.items, function( i, item ) {
					results = '<a href="https://youtu.be/' + item.snippet.resourceId.videoId + '" target="_blank"><img src="' + item.snippet.thumbnails.high.url + '" /><br />'+ item.snippet.title + '</a><br /><br />';
					$('#VideoThumbs').append(results);
				});
			}
		);
	}

	</script>
</body>
</html>