GitHubで「javascript web application youtube」で検索して出てきた59件のソフトを試してみる。

卒業制作でYoutubeの検索を投げるシステムを作るので、GitHubで「javascript web application youtube」で検索して出てきた59件のソフトを見て、一部ソフトはserveして実際に使ってみます。

https://note.com/shinsukesutou/n/n6cb869009168




#Sentiment_analysis_of_youtubers_webapp

https://github.com/dineshssdn-867/Sentiment_analysis_of_youtubers_webapp

Sentiment analysis is the use of natural language processing, text analysis, computational linguistics, and biometrics to systematically identify, extract, quantify, and study affective states and subjective information. So, in this application, we are asking a YouTuber to enter the channel id and a particular timeline. By using the channel id and timeline we are performing sentiment analysis on his videos by fetching the subtitles of their videos in a particular timeline given by the YouTuber.Basically performing intent and emotion classification on his video subtitles.

センチメント分析とは、自然言語処理、テキスト分析、計算言語学、バイオメトリクスなどを用いて、感情の状態や主観的な情報を体系的に特定、抽出、定量化、研究することです。このアプリケーションでは、YouTuberにチャンネルIDと特定のタイムラインを入力するよう求めています。チャンネルIDとタイムラインを利用して、YouTuberが指定した特定のタイムラインにある動画の字幕を取得することで、彼の動画のセンチメント分析を行っている。基本的には、彼の動画の字幕に対して意図と感情の分類を行う。

##感触
動画が準備されており、わかりやすいです。
ユーザー登録、メール送付によるベリファイまであります。
Youtubeのチャンネルと期日を入力すると、その期間の感情値が棒グラフで表示されます。

手元でserveしましたがindexページが出ず、ちょっと後回しです。（他にもこうなるのできっとやり方がわかってない）

#fdd-youtube-searcher

https://github.com/fernandedios/fdd-youtube-searcher

Fast search for your favorite youtube videos, in an easy to use UI
使いやすいUIで、お気に入りのyoutube動画を高速検索

Working prototype of a youtube searcher web application, built with ReactJs, Youtube API
ReactJsとYoutube APIで構築された、youtubeサーチャーウェブアプリケーションのワーキングプロトタイプ


##感触
gitからのインストールは失敗。

```

$ git clone git@github.com:fernandedios/fdd-youtube-searcher.git
Cloning into 'fdd-youtube-searcher'...
The authenticity of host 'github.com (13.114.40.48)' can't be established.
RSA key fingerprint is SHA256:nThbg6kXUpJWGl7E1IGOCspRomTxdCARLviKw6E5SY8.
This key is not known by any other names
Are you sure you want to continue connecting (yes/no/[fingerprint])? y
Please type 'yes', 'no' or the fingerprint: yes
Warning: Permanently added 'github.com' (RSA) to the list of known hosts.
git@github.com: Permission denied (publickey).
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.

```

ZIPをダウンロードして「npm install」して「npm start」するとエラー。

```
PS C:\Users\須藤晋介\Downloads\fdd-youtube-searcher-master> npm start
npm ERR! Invalid name: "FDD Concept: Youtube Searcher"

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\須藤晋介\AppData\Roaming\npm-cache\_logs\2021-06-12T00_10_48_427Z-debug.log

```
logを見てもちょっとわからなかったので中止。


#React-Django_YoutubeCommentAnalysis

Web Application that classifies youtube comments as positive and negative with react frontend and DRF as backend.

Classification is done by the NaiveBayes Classifier in the Natural Language ToolKit (NLTK).
Currently classification is erroneous as the classifier uses the bag of words model and therefore doesn't account complexity in natural language.
With time as I learn more about Machine Learning and Natural Language Processing, I hope to improve this classifier and make it's accuracy as close as possible to a human.

Classifier is saved as Classifier.sav using pickle to prevent repetitive training of model.
Model is currently trained on twitter_samples and movie_reviews corpus found in NLTK

This web app also uses the Youtube Data API to get comments of a particular video.
Therefore, to use the App, one requires creating a client_secret.json (OAUTH) file using the Google API console for the Youtube Data API.
Place the file in the backend folder.

The app's backend is written in Python using the Django Rest Framework.
The backend is responsible for making API calls to the Data API as well as classifying the incoming comments as positive or negative using the classifier.
The backend then returns a JSON body for consumption by the frontend. (REST API)

The app's frontend uses React.
The frontend takes the URL from youtube as input for the backend and displays the consumed JSON.
Green stands for positive comment.
Red stand for Negative comment.
If number of positive and negative comments are equal, the background color of the page becomes yellow.

フロントエンドにreact、バックエンドにDRFを用いて、youtubeのコメントを肯定的なものと否定的なものに分類するWebアプリケーションです。

分類は、Natural Language ToolKit（NLTK）のNaiveBayes Classifierによって行われます。
現在のところ、分類器はbag of wordsモデルを使用しているため、自然言語の複雑さを考慮しておらず、分類に誤りがあります。
今後、機械学習や自然言語処理について学びながら、この分類器を改良し、人間に近い精度を実現したいと考えています。

分類器は、モデルの繰り返し学習を防ぐために、pickleを使ってClassifier.savとして保存しています。
モデルは現在、NLTKで見つかったtwitter_samplesとmovie_reviewsのコーパスで学習されています。

また、このウェブアプリは、Youtube Data APIを使用して、特定のビデオのコメントを取得します。
そのため、このアプリを使用するには、Youtube Data API用のGoogle APIコンソールを使用してclient_secret.json（OAUTH）ファイルを作成する必要があります。
このファイルをbackendフォルダに配置します。

アプリのバックエンドは、Django Rest Frameworkを使ってPythonで書かれています。
バックエンドは、Data APIへのAPIコールを行うとともに、分類器を使用して入力されたコメントをポジティブまたはネガティブに分類します。
バックエンドは、フロントエンドが利用できるようにJSONボディを返します。(REST API)

アプリのフロントエンドはReactを使用しています。
フロントエンドは、バックエンドの入力としてyoutubeからのURLを受け取り、消費されたJSONを表示します。
緑はポジティブなコメントを表します。
赤は否定的なコメントを表しています。
肯定的なコメントと否定的なコメントの数が同じであれば、ページの背景色は黄色になります。

##感触

起動できず。
ここで「あ、Reactって書いてるわ」と気づいて見様見真似でインストール。

https://qiita.com/TsutomuNakamura/items/72d8cf9f07a5a30be048


```
$ npm install --save-dev webpack webpack-cli webpack-dev-server
$ npm install -g webpack webpack-cli
$ npm install --save-dev @babel/core @babel/preset-env @babel/preset-react babel-loader
$ npm install --save-dev react react-dom
```

```
$ ./node_modules/.bin/webpack-dev-server --content-base src --mode development
```

しかし詰まる。後回し。


#ReactYouTubeSearch

https://github.com/JenPhD/ReactYouTubeSearch

A youtube search web application built in React, using the youtube api.
Reactで構築されたyoutube検索ウェブアプリケーションで、youtube apiを使用しています。

Project Completed from Stephen Grider Course Modern React with Redux on Udemy


#TranscryptApp
https://github.com/jacob-ian/TranscryptApp

A web application for simple YouTube video transcript downloads.
YouTubeの動画を簡単にダウンロードするためのWebアプリケーションです。


Contribution to this project is allowed. If there are any features that you think should be included, create an issue or a pull request with the completed feature.

This project uses Semantic Release, therefore use of the Angular commit message convention is required. Read the commit conventions here. If the commit convention isn't used, the pull request will be closed without merge.

このプロジェクトへの貢献は認められています。もし含まれるべきだと思われる機能があれば、完成した機能を伴ったissueやpull requestを作成してください。

このプロジェクトではセマンティックリリースを使用しているため、Angularのコミットメッセージ規約を使用する必要があります。コミット規約はこちらをご覧ください。コミット規約が使用されていない場合、プルリクエストはマージされずに閉じられます。


##感触
インデックスページ開けないやつ。これは私が根本を理解してないやつな気配。



#Youtube-downloadr-JS
https://github.com/Anubhav-developr/Youtube-downloadr-JS

this is our node js based web application where we are using youtube-dl library of node npm to import some functions of youtube stream generation and to provide us the video(and many more things) in javascript code format.

NOTE : THIS MICRO PROJECT IS UNDER CONSTRUCTION HOOD, YOU CAN CONTRIBUTE LADIES AND GENTLEMEN.

これは私たちのnode jsベースのウェブアプリケーションで、node npmのyoutube-dlライブラリを使用して、youtubeストリーム生成のいくつかの機能をインポートし、javascriptコード形式でビデオ（およびその他多くのもの）を提供しています。

注：このマイクロプロジェクトは、フードを構築中で、あなたは紳士淑女に貢献することができます。

##感触
見本サイトが公開されていたのでそこに「YoutubeのURL」「動画のIDだけ」を入れてみたが動作せず。諦める。


#Translatefyer
https://github.com/ojaha065/translatefyer

A quick and dirty web application for 'translatefying' (running throught machine translation multiple times) any text. Heavily inspired by the Google Translate Sings videos by the YouTube channel Translator Fails.

Check it out live here. (I'm using Heroku's free plan so the site might take a while to load.)

任意のテキストを「翻訳する」（機械翻訳を何度も実行する）ためのクイック＆ダーティなウェブアプリケーションです。YouTubeチャンネル「Translator Fails」の「Google Translate Sings」のビデオに強く影響を受けています。

ここでライブでチェックしてみてください。(Herokuの無料プランを使っているので、サイトの読み込みに時間がかかるかもしれません。)

##感触
おっとYoutubeは関係ないアプリだった。
でも機械翻訳を何度もやるのは面白そうなのでメモ。


#Yoube Search
https://github.com/bhaveshAn/yoube

A web application to access YouTube v3 Data API and to sort the data at client side with respect to Title and Published Date.

YouTube v3 Data APIにアクセスし、クライアント側でタイトルや公開日を基準にデータをソートするためのWebアプリケーションです。

##感触
シンプルで改造するには良いかも。
serveで起動した。検索入れてもずっとloading...　→あ、API Keyか！

API Keyを取得して置き換えた。手順は以下URLを参考にさせていただきました。

http://piyohiko.webcrow.jp/kids_tube/help/index.html


さて、リトライします。

https://www.youtube.com/c/protoout

→チャンネルは検索結果が出てきました。ただ、「Published Date」で1回目に出てきたときのソートは「None」（人気順？）で、もう1度「Submit」を押したらちゃんと「Published Date」になる動きをしてる気がする。

https://www.youtube.com/playlist?list=PLeVbfCYWrCE1qUKZHQf26i3FUZGGAruXq

→再生リストは「URL」「リスト番号だけ」のどちらもできず。

https://www.youtube.com/playlist?list=PLZphHKbZqO0nw_ZAtgJUWiCVj1MoqZrBV

→もういっちょ別の再生リストを投入。出るには出たけど1動画しか出ない。。。



![0612-1021.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1289676/295dd93e-1737-971a-b3b8-6943c52dddda.png)

→単語検索は出来ました。
　投稿日時順も出来ました。（**でもこれ降順に欲しいな…あとでコードみて書き換えてみよう**）

　一度「Published Date」で検索しちゃうど2度目に「None」を選んでもソートが変わらないのはバグかな。

#UFOAbductionRiskAnalyzer

https://github.com/pineshmenat/UFOAbductionRiskAnalyzer

UFO Abduction Risk Analyzer is a Web application for finding one's risk of abduction based on real time user location. Website plots all the UFOs from National UFO Reporting Center (NUFORC) on Google maps. Each UFO object provides necessary details like shape, location and weather details. It provides abduction details from YouTube, Blogger, Fli…

UFOアブダクション・リスク・アナライザーは、リアルタイムのユーザーの位置情報に基づいて、自分のアブダクションのリスクを見つけるためのウェブアプリケーションです。このウェブサイトは、National UFO Reporting Center (NUFORC)からのすべてのUFOをGoogleマップ上にプロットしています。それぞれのUFOオブジェクトは、形状、位置、天候の詳細など、必要な情報を提供します。YouTube、Blogger、Fli...からアブダクションの詳細を提供します。

##感触
**UFOアブダクションリスクアナライザー**という語感が強すぎて最高。X-Files世代直撃。