2016年の Advent Calendar でCoderDojo Japan のバックエンドを更新した話について書きました。当時からさらに１年が経ち、新たな機能もいくつか追加されたので、本記事では2017年にリリースされた coderdojo.jp の機能を実装とともに紹介します 
開発中の機能も紹介するので、もし興味あれば開発に関わってもらえると嬉しいです ;)
FAQ / 前提知識
- 🤔💭 CoderDojo って何? => スライドをどうぞ!
- 🤔💭 ソースコードはどこ? =>
GitHub 上で公開されています!
- 🤔💭 誰が開発しているの? => @YassLab 社の人達が中心となって開発しています!
機能と実装
以下、実装した機能を時系列順に紹介していきますね
1. Kata (wiki) ✏️📑
CoderDojo Kata (wiki)
https://coderdojo.jp/kata
CoderDojo に関する様々な情報をまとめているウェブサイトです。このページの編集はブラウザ上でできるので、プログラミングの知識が一切なくてもページの編集に加わることができます 
内部では Scrivito という中〜大規模サービス向けの Cloud-Based CMS を使っているのが特長で、オープンソースとして公開されている事例は世界的にもそこまで多くないかなと思います。実装の方法や背景については関西Ruby会議2017で発表した次のスライドを参照してください。
子どものためのプログラミング道場「CoderDojo」を支えるRails CMSの活用事例
https://speakerdeck.com/yasulab/case-study-rails-cms-for-coderdojo
現在アカウントは手動で発行しているため、Kata を編集したい人は @yasulab までご連絡ください 
2. モバイル版の道場一覧が見やすくなった 📱👀
嬉しい悩みではありますが、全国の CoderDojo の数が100を超えたあたりから、モバイル版で表示すると「全国の道場」がとてつもなく縦に長くなってしまう課題がありました 
そこで、モバイル版のデザインを改善しました。いくつか試行錯誤した経緯がありますが、現在はアコーディオン式の表示方法を採用しています。
モバイル版の「全国の道場」の表示方法を改善する #174
https://github.com/coderdojo-japan/coderdojo.jp/issues/174
モバイル版のDojo一覧を地域ごとにアコーディオンにまとめるようにする #188
https://github.com/coderdojo-japan/coderdojo.jp/pull/188
実装は CoderDojo 岡山 岡南の @zephiransas さんがやってくれました 
ありがとうございます! 
3. Document ページ 📰✨
こっそり実装されたのであまり気づかれていないかもしれませんが、coderdojo.jp には Markdown でドキュメントを執筆・公開する仕組みがあります 📝💨
CoderDojo Japan ドキュメント集
https://coderdojo.jp/docs
例: コントリビューター行動規範
https://coderdojo.jp/docs/code_of_conduct
執筆するのは簡単で、Markdownのファイルを db/docs というディレクトリに置くだけで自動的に公開されます。実装もシンプルで、基本的には Kramdown を使って Markdown -> HTML に変換しているだけです。
DocsController - GitHub
https://github.com/coderdojo-japan/coderdojo.jp/blob/master/app/controllers/docs_controller.rb#L8-L13
デザインはCoderDojo 下北沢の @cognitom さんが作ってくれた Keiyaku CSS をベースにしています。デザインがいいと公式ドキュメント感が醸し出せて素敵ですね! 細かな実装は下記リンクから辿ってもらえれば ;)
keiyaku-css で法務文書をWeb上に表示する #89
https://github.com/coderdojo-japan/coderdojo.jp/issues/89
4. 統計システムの開発 📈🤖
DojoCon Japan 2017 で発表された CoderDojo の統計プロジェクトです。2016年5月の時点で構想自体はあったものの、長い長い Yak-Shaving を経て、ようやくリリースできました
各種イベント管理サービスのAPIで統計情報を集計したい #12
https://github.com/coderdojo-japan/coderdojo.jp/issues/12
実装は @MoneyForward の @nalabjp さんがやってくれました! 上記 Issue を見ていただければわかるように、モデル設計も含めて大幅に手を入れる必要があったプロジェクトなので、無事にリリースできて感無量です 
現在は Facebook Event / connpass / Doorkeeper の３つのイベント管理サービスに対応していて、これらのイベント管理サービスが提供しているAPIを使って情報を集計し、 日本の CoderDojo の規模感を数字で表現できるようになりました 。Google Form や独自システムなど、上記以外のイベント管理サービスを使っている場合においても集計できるように今後改善する予定です
Statically add Dojo events for 柏の葉/南柏/柏湘南/小平 #190
https://github.com/coderdojo-japan/coderdojo.jp/issues/190
5. 統計情報ページ 📊👀
まだ開発中ですが、実はこっそり公開しているページです。上記の統計システムで集計した結果をいつでも確認できるようにするプロジェクトです。
統計情報 - CoderDojo Japan
https://coderdojo.jp/stats
といっても、まだ Proof of Concept 的なことしかできていません。ゆくゆくは現在の数字だけではなく、数字の推移やそのグラフ化などもやる予定です。
統計情報を確認できる /stats ページの開発 #206
https://github.com/coderdojo-japan/coderdojo.jp/issues/206
統計システムで数字の情報はある程度取れる土台が出来上がったので、ビジュアライゼーションに興味ある人がいればぜひいかがでしょうか?
ちなみに先日 License の許諾を得られたので、Highcharts を使ってグラフ化する予定でいます 📊
他、改善された箇所
- Scrivito API Keys を持っていなくても開発できるようになりました #156
- Fork されたリポジトリからPRが送られてもCIが適切に動くようになりました #160
- View のフォーマットが erb から Haml に切り替わりました #214
挙げるとキリがないですが、上記以外にも様々な改善が行われています!
https://github.com/coderdojo-japan/coderdojo.jp/issues?q=is%3Aissue+is%3Aclosed
まとめ
来年の Advent Calendar が始まる頃にはもっと様々な機能が追加/改善されていると思います! 開発はオープンに行われているので、もし興味あればぜひ GitHub を覗いて見てください
CoderDojo Japan - GitHub
https://github.com/coderdojo-japan/coderdojo.jp
これからやろうかなぁと思っているタスクは大体 Issue に上がっているので、今後どういう風に改善していくか気になる人は下記の Issue リストも見てもらえると幸いです 
Issues - CoderDojo Japan
https://github.com/coderdojo-japan/coderdojo.jp/issues
まだまだやりたいことはたくさんですね 🤔💭