進捗どうですか？

新年を迎えてからしばらく経ち、皆様当初の目標からの進捗はいかがでしょうか？

僕は全くダメです。

やりたいこと、やらないといけないなと思ってることは沢山あるんですが、「何をしようかなぁ」と考えているうちに、気づけば寝ていたり、気づけばデレステをやってる毎日です。マキノかわいい。

世の中にはタスク管理の手法は色々ありますが、それらはすべて「タスクをこなす意思がある人向け」であり、僕みたいな意思の弱い人間が、あれとこれをやりたいとリストアップしたところで、そのリストを前にした時点でうんざりしてしまうのは必然です。

リストを前にすると尻込みしてしまう。であれば、目に見えるタスクを一つだけにしてしまえばいい。　導入が長くなりましたが、そんなモチベーションから「タスクを一つ選び出すツール」を作ったお話です。

どんなアプリケーションを作ったか

こちらになります。

https://gachamaker.herokuapp.com

ソースコードはこちら。

github.com

どうせだったら、タスクを選ぶだけじゃなくて、デレステにインスパイアされた感じですがガチャ形式にしちゃおうという目論見です。

って訳で、別にタスク管理ツールとして使わなくてもOKです。

こんな感じで、SSRとして息抜きを入れることができたら、楽しく生産的な日々を過ごせるんじゃ無いかなぁと思ったりした訳です。

技術的な話

サーバー

サーバーは相変わらずherokuを利用しています。久しぶりに管理画面にログインしてみましたが、まだ日本リージョンはまだ無いみたいですね。ちょっとしょんぼりです。

サーバーサイドアーキテクチャ

そして、サーバー側は、僕にしては珍しくJavaを使っています。Spring Bootを試してみたくて。

IntelliJを使ってセットアップしたんですが、ものすごく便利です。

プロジェクト作成時に、必要なライブラリをこんな感じでぽちぽちしていくだけで終了です。Maven Archtypeなんていらなかったんや・・・コレは感動しました。

また、DBアクセスについては、JPA(hibernate)を使ってみました。SQL書かなくて良いのはいいんですが

• OneToMayとManyToOne双方指定しないといけない
• equalsとhashの実装が地味にめんどい(自動でやって欲しい)
• 複数PKに対応しているのは良い（Djangoはできなかったはず）。けど、PKクラスを用意したりと面倒な部分もある
• Entityからテーブル作ってくれるのは良い

と、便利な点と不便な点がある感じで。複雑なSQLとなるようなものを書いてないので正確には評価できませんが、そこが問題無いのであれば仕事でも使っていきたいなぁと僕は思いました。

フロントエンドアーキテクチャ

Reactを使ってみたくて試してみました。

僕が使ったことがあるのがBackbone+Marionetteだけなので比較対象が少ないですが、Backboneよりはコード量少なく、かつ見通しも良いなと思いました。

しかし、当初画面要素の一部だけをReactで作ろうとしたところ、Reactのアーキテクチャ的にそれが許されないことを痛感しました。

Virtual DOMという言葉は有名ですが、言い換えるとReactから触るにはReal DOMではなくVirtual DOM経由でアクセスしないといけない為、一部だけ通常のHTMLでってのがなかなか難しいんですね。

既存にあるアプリケーションを徐々に置き換えて・・・といった使い方はできなさそうだなぁと感じました。

なお、Reactはオフィシャルに日本語のチュートリアルがあるので、まだ触ったことが無い方は一度コレをやってみるのをおすすめします。

僕もここから入って、チュートリアル終わらせて、あとはググりながらこれを作った感じです。

facebook.github.io

あとは、Bootstrapを3ではなく4にしてみたのですが、このレベルであれば使い勝手はあまり3と変わりませんでした。

Componentsのドキュメントが、今まで１ページだったのが種類ごとに分かれて、見た目から「どれつかおうかなー」と悩めなくなったのが辛かったです。

v4-alpha.getbootstrap.com

まとめ

明日朝早いのでがーっと書きましたが、

• Javaはやっぱりちゃちゃっと書くには大変。慣れもあるけどPython(Django)の方が僕はストレスたまらない
• Reactはチュートリル後にいきなりアプリケーション作り始めることが可能なくらいには分かりやすい
• Bootstrap4はまだα版だけど、特に問題には当たらなかった。が、ドキュメントが以前と比べて分かりづらく、やりたいことを見つけるのに一苦労
• SSRが1.5%というのは、やっぱり絶望的

といったあたりでしょうか。

Spring BootもReactも、このアプリケーションを作るにあたって初めて触れた技術です。

みなさんも、何か自分が触ったことの無い新しい技術で、何かを作ってみると楽しめるかもしれません。

補足

ガチャの例はこんな感じです

https://gachamaker.herokuapp.com/deck/a66b0b11-967d-4b54-87e4-c3e08868a590

見ての通り、レイアウトがちょっと崩れてます。これは明日直したいな・・・と思ってる次第です