「Chiibus-map」の版間の差分

2020年5月24日 (日) 23:30時点における版

東京都港区のコミュニティバス「ちぃバスの運行状況をリアルタイムで表示するアプリケーション。 http://fukudat.net/chiibus-map で稼働している。

What's New

Docker Container化した。

　免責

当然のことながら無保証です．

もし問題を発見したらUser:Fukudatにご連絡ください．

どうやって動いているか(備忘録)

内部構造は、

フロントエンド (Web サーバー) →[リバースプロキシ]→ バックエンド (API サーバー) →[http]→[ばすくるサービス]

となっていて、docker-compose で制御された container 上で動いている。

Webサーバー

angular でWeb UIを記述。地図コンポーネントにはAGM を使用。ちいばすの運行状況取得のために、後ろのAPIサーバをhttp越しに呼び出す。 Web server にはnginxを選択。nginx公式docker imageをベースに、node と angular/cli をインストール。

APIサーバー

gunicorn, flask　で RESTful API風に仕立てる。 http://www.buskuru.com/chiibus/pc/index.php からリアルタイムの運行データを取得している。

@@ 1行目: / 1行目: @@
 [https://www.metro.tokyo.lg.jp/ 東京都][https://www.city.minato.tokyo.jp/ 港区]の[[wiki-ja:コミュニティバス|コミュニティバス]]「[[wiki-ja:ちぃばす|ちぃバス]]の運行状況をリアルタイムで表示するアプリケーション。
-http://fukudat.net/chiibus-map で稼働している。
+http://fukudat.net/chiibus-map で稼働している。[[Category:fukudat.net]][[Category:How-To]]
+== What's New ==
+Docker Container化した。
+==　免責 ==
+当然のことながら無保証です．
+もし問題を発見したら[[User:Fukudat]]にご連絡ください．
+== どうやって動いているか(備忘録) ==
+内部構造は、
+<pre>
+フロントエンド (Web サーバー) →[リバースプロキシ]→ バックエンド (API サーバー) →[http]→[ばすくるサービス]
+</pre>
+となっていて、[[google:docker-compose|docker-compose]] で制御された container 上で動いている。
+=== Webサーバー ===
+[[google:angular+-angularjs|angular]] でWeb UIを記述。地図コンポーネントには[[google:angular-google-map|AGM]] を使用。
+ちいばすの運行状況取得のために、後ろのAPIサーバをhttp越しに呼び出す。
+Web server には[[google:nginx|nginx]]を選択。nginx公式docker imageをベースに、[[google:node|node]] と [[google:angular+-angularjs|angular/cli]] をインストール。
+=== APIサーバー ===
+[[google:gunicorn|gunicorn]], [[google:python+flask|flask]]　で RESTful API風に仕立てる。
+http://www.buskuru.com/chiibus/pc/index.php からリアルタイムの運行データを取得している。
+[[Category:How-To]][[Category:fukudat.net]]