技術概要

つなぐマップのアーキテクチャについての説明です。

原本データは外部サービス内に保管

つなぐマップ本体では、原本データは持たず、 必要なデータは全て外部サービスに保管しています。 つなぐマップの中では、地図配信を効率的に行うために加工したデータをキャッシュDBに持っているだけです。
つなぐマップ上で、データ登録操作が行われる際には、まず、外部サービスに保存して、 それを取り込む形にすることで、原本データの管理を外部サービスに委託しています。

この方式にすることにより、以下の利点があります。

利点1) データ紛失リスクを抑える

つなぐマップは、個人でOSSの形態で開発をしています。 個人でシステムを運用する際に、ユーザのデータの紛失リスクを極力負わないようにすることは大切です。

利点2) DBスキーマ変更時にデータ移行不要

通常のシステム開発では、データ移行の手間などから、大掛かりなスキーマ変更はなかなか行えません。しかし、この方式ならば、DBスキーマ変更した場合には、キャッシュDBを再作成の上、再度、外部サービスからデータを取り込みなおせばいいだけなので、データ移行の手間を気にせずにDBスキーマの見直しを行うことができます。

現在は、Notionのみと連携していますが、将来的に、連携サービスを増やしていくことで、 各サービスでユーザが管理している情報をつなぐマップ上からアクセスできるようにすることを想定しています。

拡張性を考慮したモジュール構成

つなぐマップは、以下のモジュールで構成されています。

モジュール	概要	実装言語・ライブラリ
core	フロントエンド側のコア機能	React, TypeScript
backend-main	バックエンド側のコア機能	Express, TypeScript
frontend	フロントエンドの画面	React, TypeScript
backend-odba	原本データアクセス	Express, TypeScript
db	地図用キャッシュDB	MySQL

コア機能はcoreとbackend-mainで実装

村マップや日本地図を表示したりするメインの機能は、coreとbackend-mainで実装しています。
backend-mainが、セッション管理や地図を表示するのに必要なAPIの提供を行い、フロントエンド側のcoreからbackend-mainのAPIを呼び出します。

オリジナルの画面をつくったり、既存システムに埋め込むことが可能

core単体は地図以外のUIコンポーネントを持ちません。
frontendがcoreを内包して、coreやbackend-mainの提供するAPIを呼び出すことで地図操作します。
これにより、オリジナルのつなぐマップ画面をつくったり、既存システム内につなぐマップを埋め込んだり、といったことが可能になります。
（つなぐマップとして公開しているのは、あくまでfrontendの一例という位置づけです）

連携する外部サービスを切り替えることが可能

外部サービス(Notion)と連携するモジュールが独立しているため、 Notionではなく別の外部サービスと連携させるように変更することが容易です。 たとえば、既存システム内につなぐマップを埋め込みたい場合などは、既存システムのDBと連携するモジュールを用意して差し替えることで実現できます。

つなぐマップはMPLライセンス^※でのOSS開発ですが、モジュール単位でライセンス設定しているため、 別途作成した外部サービス連携モジュールについては、公開しなくても構いません（原本データの構造などを知られたくないケースについて考慮）。

^※MPLライセンス:=複製・再頒布・改変・商用利用可能。ただし、改変部分のソース公開は必要。

Dockerコンテナで動作

つなぐマップはDockerコンテナ上で動作します。
Dockerコンテナが動作する環境で、docker-compose.ymlを配置してコンテナ起動するだけで、すぐに動作環境を構築することが可能です。
Dockerイメージは以下の単位で用意されています。

• frontend
• backend-main
• db
• backend-odba

frontendやbackend-odbaのイメージを差し替えることで、異なる画面に切り替えることや、別の外部サービスと連携させることが可能です。