PeeeeRONの日記

更新頻度はあまり高くはありませんがネタがあったら書いていこうと思います。

AngularJSとGoでWebアプリを作った

大学でPHPを使ったWebサイトを作成するという授業の中でAngularJSとPHPを使って、バックエンドのAPIPHPでフロントエンドをAngularJSで構築した。 せっかくなので、PHPの部分をGoに置き換えて最近Goの公式サポートが発表されたばかりのHerokuにデプロイしてみた。

作成したサイトがこちら、

bgm-com.herokuapp.com

勉強やプログラミングなどの何かしらの作業をしている時にたまに音楽を聞きながらやることがあると思います。そんなとき自分で音楽を持っていればそれを聞くことができますが、持っていない場合はYouTubeなどから適当に選んで聞いています。

このWebサービスではYouTube上の音楽をBGMとして聞くことができるようになっています。YouTubeには無限の動画が存在して素人のものも含めて下手をすればApple Musicもびっくりな数の音楽動画がアップロードされています。これを使わない手はない。

しかし、YouTubeは動画の視聴サービスなので動画を表示する必要はありません。そこでこのサービスではYouTubeの動画を非表示にして音楽だけに集中できるようにしました。また、曲を選ぶのに役立つ機能などを備えています。

機能としては

  1. 曲を検索して聞ける。

  2. ランキングを取得してその曲を聞ける。

  3. 放映したアニメのオープニング・エンディング曲を聞ける。

  4. 気に入った曲をお気に入りに登録することができる。

  5. みんなが聞いている曲を聞ける。

ソースコードGithubにあげました。

github.com

github.com

アニソン検索機能に関してはこちらのオープンソースAPIを利用させて頂きました。ありがとうございます。

github.com

Angular、Go使ってみて

AngularJS

Angularの利点が双方向Viewバインディングだと思うので、それは体験できたと思う。 そもそも普通のJavascriptjQueryやReactのWebでの使い方を知らないので比較することはできませんが、着想から1週間強で基幹機能の実装ができたので相当楽にかけたのではないかと思います。

あと、いいと感じたことはAjaxの処理がServiceとして部品化できること。 これも普通のJavascriptでフロントエンド開発をしたことがないので、オリジナルでできるのかできないのかわからないのですが、部品化できることによってコントローラの各所から呼び出すことができるし、別のサイトにも応用できる。 今回ディレクティブは使用しませんでしたが、多分使いこなせるともっと色々なことができるのではないかと思う。

なんかもうAngular2とかいう次世代版のAngularが出ていて、今回使用したAngular1とはかなり仕様が異なっているらしいです。JSの変化が激しすぎてついていける自信がありません。講義でやったJavascriptとはなんだったのか。

angular.io

Go

今回のサイトではGoはバックエンドとして実装しました。 DB操作の一部にBeegoの一部機能を使用しましたが、フレームワークは使いませんでした。 シンプルで余計なものが含まれていないので、コンパイル言語の速さにもかかわらず、PythonRubyなどのスクリプト言語の手軽さという良さも兼ね備えている使っていてすごく楽しい言語でした。

ただ、まだ発展途上という感じでRubyPythonと比べるとORMなど不便なところが少なくもないと感じました。最近echoという糞速いフレームワークがでてましたし、これからもっともっと注目されていくはずです。

github.com

Webアプリを作るなら、ライブラリの豊富さはRailsなどに劣りますがGoとJSで作るのが速さ的な意味では最強だと感じました。