sifue's blog

プログラマな二児の父の日常 ポートフォリオは www.soichiro.org

React.jsでLoL生放送のリアルタイムランキングを作ってみました

f:id:sifue:20150814191454p:plain

お盆で会社も気分転換に休んでちょっとしたWebサービスを作ってみました。

LoL生放送リアルタイムランキング

世界で一番遊ばれているe-sportsな無料のネトゲ、League Of Legends(LoL)を遊んでいる日本語の生放送だけを抽出して、スコア付けしてランキング化しています。

使った技術はいつもどおりのPlay2/Scala、PlayJsonです。WSは使わずHttpclientをそのまま使っています。WSは罠が多すぎるので...。

 

やっていることはTwitchのAPIとニコニコの検索APIを叩いてAkka Actorで1分毎に実行しつつそれをCacheに積んでいるだけです。

クライアントサイドは、今回はじめてReact.jsを使ってみました。React.js、以前勉強会に参加した時にはまだまだ使えるようになるの先かなぁと思っていましたが、JSXで書いてコンパイルするというスタイルがおもったより良い感じです。ただエディタは、IntelliJを無理して使うよりはAtomを使ったほうがいろいろ便利でした。

使ってみた感じコンポーネントの再利用がし易い感じがします。TypeScriptとReact.jsを組み合わせて使うと結構保守性も高そう。ただ別に実行速度が高いとかいうわけでもないので、無理して使わなきゃいけないというわけではなさそうですね。

罠としては

  • classをclassNameに書き換える必要があること
  • {}の中はJ結構JSのコードがかけちゃうので気をつけないと複雑になること

でしょうか。あとComponentというクラスが描画戦略を持っているのですごく頑張って実装すれば最終的に高効率の描画ができそうです。

なおこのサイト、今は前回と今の結果から差分だけをだしていますが、いずれリアルタイムランキングだけではなくLoLのゲーム実況配信者の人気統計みたいなのを取って週間ランキングや月間ランキングを出せればなと思っています。

にしてもこのランキング、今日一日眺めてたけどLoLの女性配信者の多さね...そして、女性ゲーマーでダイアとかゴールドの人がゴロゴロいるってのが本当にすごいなと思います。

JavaFXとRxJavaの勉強のためにSocket通信対応したMac用棒読みちゃんクローンを作ってみた

sifue/bouyomisan · GitHub

あけましておめでとうございます。

丁度冬休みということもあって、Mac用の棒読みちゃんクローンを作ってみました。

インストールバイナリもソースコード自体もgithubで配布中。あと、ソースコードはMITライセンスです。 

f:id:sifue:20150104003203p:plain

f:id:sifue:20150104003205p:plain

見た目はこんな感じ。

使ったライブラリとしては、

  • JavaFX (Java8からデフォルトになったJavaの新UI)
  • RxJava (ReactiveExtensionsのJava版)
  • gradleのmacAppBundle (Mac用の.appファイルを作ってくるバンドル)
  • kuromoji (日本語形態素解析ライブラリ)
  • Netty 4系 (高速なTCP通信が可能なサーバー)

実装した機能としては

  • ニコニコの読み上げ文化などに対応した、単語や正規表現による辞書置換
  • 漢字のかなへの読み上げの変換
  • Socket通信を利用した読み上げ
  • 棒読みちゃんとおなじAquesTalkを利用するためのUIを提供

です。過去読み上げしてくれるMac用のアプリはいくつかあったのですが、棒読みちゃん互換のSocket通信読み上げに対応したものがなかったので自分で作ったというのが軽易です。

 

ここからは開発の感想です。ここ1年以上ずっとScala書いてるので久しぶりのJavaプログラミングはいろいろ懐かしいものがありました。ただラムダやStreamを使おうとしてみるもののイマイチぱっとしなかったりという感じで、そこはScalaの方が圧倒的に便利です。

まずJavaFXについてです。過去Swing、SWTと触ってきましたが何が特に非同期処理の部分のところが専用のTaskやpropertyのbindを使わなきゃいけなくなっていて結構面倒くさい感じになっています。その他の部分はUIのAPIはかなり素直な作りになっており、初心者にはわかりやすい仕組みになっているのではないかと思います。

個人的に何がすごかったかというと、JavaFX Scene Builderです。こいつが使いやすすぎる。これのためにJavaFXを使ってもいいといっても過言ではない感じでした。fxmlをIDEで協調しながら編集した際にも問題なく利用することができました。

f:id:sifue:20150104004024p:plain

あと、RxJava。元々いろいろ情報は知っていたのですが柔軟なイベントハンドリングをするためのライブラリ。オブザーバーパターンでさえ、様々な実装を用意してくれています。非常に便利なことができるライブラリですが、正直イベントが鬼のように飛びまくるようなUIでは便利ですが、ちょっとしたアプリぐらいであれば、間違った使い方をしてしまうのが少しこわいなと思う所あります。

個人的には、Subjectが様々なバリエーションがあって感銘をうけました。


java - How can PublishSubject and BehaviorSubject be unsubscribed from? - Stack Overflow

 

GradleのmacAppBundleは、Oracleが.appファイルの作り方を紹介してくれているやつをそのままプラグイン化してくれたもの。kuromojiやNettyは過去何度か形態素解析TCP/UDPサーバーを作ってみるということをやっていたので、特に問題なく利用することができました。どちらもバージョンが上がってどんどん洗練されている気がします。

 

このMac用の棒読みちゃん、棒読みさんを今後も少しずついじりながら機能拡張していきたい所です。

 

追伸

この冬休みずっとFF14とダークソウル2をやっています。真成2層練習パーティが中々集まらないそんなTitan鯖。

ScalaMatsuri祝いにIRCとSlackの相互リレーをするScala製ツールをMITライセンスで公開しました

今日はScalaMatsuriのー日目、皆様お疲れ様でした。

初めてオダスキー先生を見たり、本当に刺激的な内容が多くてとても勉強になりました。

そんな中自分は、Scalaを書きたい欲求が、ガガガーっと沸き上がってきたので、自分が欲しかったIRCとSlackの相互リレーをしてくれるScala製のツールを作りました。きっとIRCとSlackの両運用で一時的に困ってる方が居るかと思いますので、ぜひご活用いただければと思います。

ソースコードはこちら、

sifue/ircslackrelay · GitHub

MITライセンスなので、好きに改変してお使いください。使っている技術としては、

  • sirc
  • akka-acotor
  • dispatch

となります。

 

なお現在の仕様では、IRCの設定、SlackのIRCアダプタの設定、SlackのAPIのトークンの設定をして、相互リレーをするチャンネルを設定することで

IRC→Slackは

23:55 ircslackrelay: u​sername: message
23:55 ircslackrelay: _ u​sername: notice is sanded by undersocre _

こんな形式になります。Slack上ではアンダースコアで挟んでIRCのnoticeを表現。またニックネームは、最初の文字の後にサイズゼロスペースを入れることでnotificationに引っかからないようになっています。

Slack→IRC

23:55 ircslackrelay: u​sername: message

全てnoticeになり同様にニックネームにサイズゼロスペースを入れてあります。

ぜひご活用下さい。素敵なChatOpsを!

 

追伸

なお、使い方やインストール方法をもっと詳しくQiitaの方に書きました。


SlackとIRCを相互リレーする話 - Qiita

 

WEB+DB PRESS Vol.82 にオブジェクト指向アプローチによる変更に強いテーブル設計という記事を書かせてもらいました

今回でデータベース実践活用の連載2回目ですが、この度は、オブジェクト指向アプローチによる変更に強いテーブル設計、というタイトルで記事を書かせて頂きました。

写真は先ほど届いた査読誌です。

f:id:sifue:20140820224121j:plain

内容は、テーブル設計をやりはじめたばかりの新人エンジニア向けの初歩的なオブジェクト間の関連の定義の仕方から、マーチン・ファウラーのテーブル継承の手法、そして最近流行りの大規模WEBにおける具象テーブル継承のデメリットを打ち消すID設計戦略までを説明しています。

そしてこの度は、漢(オトコ)のコンピューター道で有名な奥野さん、達人に学ぶSQL徹底指南書で有名なミックさんにも査読いただき、とてもよい内容にまとまっていると思います。

おそらくWEBでDBを触っているエンジニアならば読んで損はない記事になっていると思いますので、8月23日発売ですのでぜひお買い求め下さい~。

 

WEB+DB PRESS Vol.82

WEB+DB PRESS Vol.82

  • 作者: 山口徹,Jxck,佐々木大輔,横路隆,加来純一,山本伶,大平武志,米川健一,坂本登史文,若原祥正,和久田龍,平栗遵宜,伊藤直也,佐藤太一,高橋俊幸,海野弘成,五嶋壮晃,佐藤歩,吉村総一郎,橋本翔,舘野祐一,中島聡,渡邊恵太,はまちや2,竹原,河合宜文,WEB+DB PRESS編集部
  • 出版社/メーカー: 技術評論社
  • 発売日: 2014/08/23
  • メディア: 大型本
  • この商品を含むブログを見る
 

追伸

今回は一番最初に出ているこのWebAPIデザインの鉄則がすごくよい記事だなと思いました。というかいつも悩んでるだよなぁ。

既存のIRCボットをSlack対応させた時にハマった点

最近Slackが大ブームということもあって、IRCやその他のチャットシステムからSlackに移行している方も多いと思います。そんな中、IRCのgatewayがあるということで、IRCのボット資産をSlackに移行するために自身がハマった点が何点かあったのでまとめておきます。

今回IRCからSlack対応させたのは、自身がScalaでメンテナンスしているranking_ircbotというチャンネルにおける発言回数と名言を保存しておいてくれるボットです。

 

問題になった点は以下4点。

 

  1. noticeがない
  2. IRCの通信をSSL化しないといけない
  3. IRCのgatewayを使う場合、専用のアカウントがないといけない
  4. IRCのgatewaybotが発言しまくると、そのチャンネルにおいてIRCを通じて発言できなくなる

 

になります。

 

1.noticeがない。これに関しては諦めざるを得ません。なので、noticeがなくてもよい運用にしましょう。幸い@usernameで呼びかけるとSlackから相手に通知が行くので通常の投稿と、人に通知を送りたい場合は@usernameを入れて対応するということで、通常のメッセージにはあまり反応しないような運用が良いのではないかと思います。あと変わりに_でメッセージを囲ってイタリックにしてやる方法や@usernameにゼロサイズスペースや_を挟んでnotice反応しないようにするのも手です。

 

2. IRCの通信をSSL化しないといけない。これはSSL対応しているIRCクライアントを利用する必要があります。自身が使っているsIRCというJavaIRCクライアントライブラリは対応があったため、特に問題なく移行することができました。Java系だと、証明書を登録するか無視するかのどちらかの対応をしなくてはいけないというのがちょっと面倒臭いところです。自分は無視しています。

 

3.IRCのgatewayを使う場合、専用のアカウントがないといけない。これが一番厄介で、IRCで発言するようにすると、SSLのサーバー認証がユーザーIDとパスワードで行うため、登録ユーザーIDがボットの動きをしてしまうことになります。

なお自身のアカウントでbotを動かすと、人格をbotに乗っ取られるような感じになりますw

なお、ボット専用のメールアドレス等を用意されるのであればそれで対応されるのも良いかと思います。

 

それでも回避しきれないのが次の問題で、4.IRCのgatewaybotが発言しまくると、そのチャンネルにおいてIRCを通じて発言できなくなるという問題です(ちなみにこれ解除するためにはパスワードを再生成しないとダメです)。おそらく、Slackが、REST APIの制限の抜け道をIRCでやられないようにこのような制限をかけているのだと思います。

 

この3番、4番の問題を解決するために、最終的に、取得だけはIRCのチャンネルからストリームで取得し、発言はSlack REST APIから行うようにしました。ただし、こちらは1秒間に1回しか発言しないように制御する必要があります。

そこで自分はScalaで実装していたので、Javaの並行プログラミングユーティリティのSemaphoreを利用して、Slackのクライアントを以下HTTPクライアントのdispatchを使って下のように実装しました。このおかげで1秒間に1回以上連投をせずにちゃんとブロックしてくれるようになります。

Slack API Client for Message Posting with API limi ...

 

以上が、SlackにIRCボットを対応させるために行った時にハマったこととその対応になります。参考になれば幸いです。

社内LTでOpen Broadcaster Software(OBS)のプラグインを作ってみたことを発表しました

発表の半分以上がLoLの説明なのは仕様です。どっぷりハマっております。

作成したプラグインソースコード

sifue/CLRStudy · GitHub

です。

こと生放送の配信ツールという意味では、完全にOBSがデファクトスタンダードになりつつあるなぁとおもう今日このごろ。

恐ろしく軽くて、日本語のローカリゼーションも完璧でな所がすごい。

ただ、プラグインでできるのは映像ソースや音声ソースの追加がメインな所がちょっと残念な所。まあOSSだから特に問題にはならないけれども。

「データベース実践活用」の連載をはじめました

本日発売のWEB+DB PRESS Vol.81からデータベース実践活用という記事の連載をはじめました。次回と次々回まで自分が担当する予定です。

 

WEB+DB PRESS Vol.81

WEB+DB PRESS Vol.81

 

 

第一回目は、オブジェクト指向プログラミングを利用したDAO設計パターンの紹介です。DAOってあれですね、データアクセスオブジェクトです。RDBとかKVSとかファイルとかごにょごにょするオブジェクト群のことですね。


最近は、ORMとかいろいろ便利なライブラリが整備されてはきてるんですが、実際にはDAOの実装にはいろいろなパターンがあって、作るシステムの要件によって最適な実装というのは異なってきます。特に最近は、扱うデータストアがRDBだけじゃないってこともあってより、複雑なDAOの設計が求められています。

 

今回の記事の内容は、エンジニアが担当ソフトウェアアーキテクトになってWEBシステムを作る際、データストアの構成、ドライバの選定、ORMの選定までは済んだけれども、ソフトウェアの設計をどのようにしようかと悩んだ時に役に立てばいいな、という内容になっています。

 

今回紹介しているパターンは以下の表の通り。

パターン名概要用途保守/拡張性能実装コスト
トランザクションスクリプト データベースに対する一連の手続きをタスクとしてオブジェクト化する手法。共通ロジックに関してはサブタスクにすることもある 長期保守しない、パフォーマンスが求められるシステムの実装 とても低い とても低い
テーブルゲートウェイ データベースのテーブルに対しての処理のゲートウェイとなるオブジェクトを用意する手法 短期間の保守を行い、複数のテーブルをまたぐような複雑なビジネスロジックが存在しないシステムの実装 低い 低いがテーブル間の関連が多いビジネスロジックの場合は高い
アクティブレコード データベースのテーブルが持つ特定の行をラップする手法。オブジェクトはデータと振る舞いの両方の特性を持つ データベースの構造とビジネスロジック乖離(かいり)が少ないシステムの実装。または、要求変化が少ないプロトタイプの実装 中程度だが単純なビジネスロジックの場合は高い 中程度
データマッパ 永続化対象、データベース、マッパ自体がそれぞれ独立したオブジェクトとなっている構造を持つ 中長期の保守が求められ、複数のデータベースおよびテーブルより1つのオブジェクトを構成するようなある程度複雑なビジネスロジックを扱うことのあるシステムの実装 高い 高い
ドメイン駆動設計におけるリポジトリ データマッパの抽象度をさらに高め、扱う永続化対象オブジェクトとビジネスロジックで扱うオブジェクトを分離する方法。また実際の永続化方法についてはビジネスロジックからの隠蔽(いんぺい)を行う 長期保守が求められ、ビジネスロジックのデータベースへの依存を断ち切りビジネスロジックが凝集されたモジュールを構成しなくては保守が難しくなるような、とても複雑なビジネスロジックを扱うシステムの実装 とても高い とても高い

 

特に、アクティブレコードパターンと、データマッパーパターン、ドメイン駆動設計(DDD)のリポジトリあたりは実際にどれを採用するか、WEBシステムのアーキテクチャなら一度は頭を悩ませたことがあるのではないかと思います。

実際にはどの方法にも良し悪しがあるので、これが一番!ということはできませんが、クラス図と共に細かく説明していますのでご一読頂ければ適切な判断ができるようになるのではと思います。

 

またDDDのリポジトリのは特に実際どのようにすべきかということで悩まれている方もいらっしゃるかもしれません。なので今回は具体的な実装を十分に用意してみました。番組と番組タグという情報を例に取ったScalaの実装例を sifue/oopdb · GitHub および サポートページ:WEB+DB PRESS Vol.81:|gihyo.jp … 技術評論社 にて公開しております。sbtでビルドして動かすこともできるので気になる方はこちらの方をみてどのような構成になっているのか見てみてください。

 

追伸
実はサンプルコードを最初はJavaで書いてくれと言われたのですが、PoEAAやエリック・エヴァンスのDDD本にもJavaのサンプルコードは沢山あるし、Scalaの方が短くかけて構造が簡潔に伝わりやすいと思い、Scalaを選択しました。型があるのに短くかけるScala、いいですね。