シェアマップ「アルカモ」のアーキテクチャ
※本稿はテックブログからの転載です。
こんにちはJDSCエンジニアの横山です。
アルカモとは、有事の際に必要なものの在庫状況を皆で共有するサービスです。
地図の描画にはGoogleマップを利用しています。
コロナウィルスの拡がりに対して、JDSCとして何か社会貢献活動をできないかという思いが発端になっています。
アーキテクチャ
アルカモのアーキテクチャは一般的な3層のウェブアプリケーションとしてシンプルに構築しています。
バックエンドのフレームワークはPython+FlaskでGAEにデプロイし、DBはMySQL、ORMはSQLAlchemyを使用しています。
店舗の位置情報等のデータはGoogle Places APIで取得し、さらにユーザーの入力した在庫情報と一緒にMySQLに保存しています。
苦労した点として、Google Maps APIの情報が公式ドキュメントでも詳しくなく、試行錯誤した人のノウハウを探さないといけなかったことです。
特に、Markerのインスタンスをつくる時のパラメーターはAPIの中でも数、内容ともに情報が少なくTry&Errorで少しずつ進める必要がありました。
下記コードで少し説明します。抜粋のため関数等は省略しています。
position: 緯度経度をセットすれば良いが、Google Places APIで返ってくるフォーマットで揃える必要がある。
zIndex: nullをセットすると数値をセットしたMarkerより上に表示される。
fillColor: 細かくセットできるが、等価率は別途fillOpacityでセットする必要がある。
strokeWeight: 塗りつぶしとは別に等価率をセットする必要がある。
InfoWindowもなかなか手ごわいです。
基本的に✕ボタンで消す仕様なのですが、他のInfoWindowが開いたら前のは自動で閉じたいというUXを実現するために、JavaScriptのグローバルスコープに最後のInfoWindowの参照をセットし、新しく開かれる度にcloseしています。
またInfoWindowの中のcontentはHTML形式で記述可能でリンク等のタグも設定可能です。JavaScriptも設定できるかは未検証です。
以上、マップまわりはなかなか大変ですが、それでも最初のテストバージョンまで2日、公開まで1週間というスピードで進められたのは、GCPのCI/CDまわり特にGAEのデプロイフローがかなりこなれてきたおかげと思います。
実際、簡単なウェブアプリケーションでしたら、数日でリリースまでいけるのはクラウドプラットフォームの進化と言えます。
また、実装とは別の話で、免責や利用規約等を法務の方が調整してくれた影響も大きいです。
法律や条例等の調査・調整は慣れていない開発者も多いので、この部分を役割分担してテンポ良く進められるのはJDSCの強みになっています。
Google Analytics
3/30の金曜にリリース後のGAを追ってみます。
PRやバイラルの効果もありリリース後数日は流入が多くなっています。
実際の店舗登録も首都圏に限らず、北海道や九州、海外まで幅広くされていました。
その後は、特に広報もしなかったので緩やかに減少傾向になっています。
少ないリソースと短い期間でリリースしたサービスの評価としては悪くない印象です。
採用やってます！We’re Hiring!
JDSC社内には各ロールが揃っていますので、他のSIerや自社開発している企業とはレベルが違ったスピード開発が可能になっています。
そういう開発に興味があるエンジニアを絶賛募集中です！
この記事が気に入ったらサポートをしてみませんか？