はじめに

  • この記事では、健常者エミュレータ事例集を構成する技術について記述します。
  • 健常者エミュレータ事例集を構成する技術について俯瞰的に見たのち、個々のコンポーネントについて触れ、技術選定をした歴史的経緯などについてもちょびっと書きます
  • Wordpressの異常な使い方として参考になれば幸いです

システム全容

健常者エミュレータ事例集を構成する技術

健常者エミュレータ事例集の本体のほかにも3つのコンポーネントがあり、それぞれ本体とREST API経由で接続されています。順を追ってみていきます。

健エミュ投稿フォーム

健常者エミュレータ事例集Wiki投稿フォーム v2.5

作られた背景

  • 事前知識

    • 2022年3月から2023年2月まで、健常者エミュレータ事例集はSeesaa Wiki上で展開されていた Seesaa Wiki

    • Seesaa Wikiにはテンプレート投稿機能があり、事前に作成されたテンプレートを使って記事を作成することが可能だったが、PCからしかテンプレート投稿機能が使えない欠点があった

    • 当時、健常者エミュレータ事例集WikiのPV数は9割をスマートフォンが占めていた

  • 健常者エミュレータ事例集の理念を実現するためには、スマートフォンから記事を投稿できない状況を解消し、新規投稿を促進する必要があった

構成

  • Next.js + Vercel
  • 長所:無料枠の範囲内でできる
  • 短所:オーバーエンジニアリングな点
    • 正直Next.jsを使うほどではなかったかもしれないので、今はReact + Cloudflare Pagesで作り直そうとしている
  • 構成の欠点ではないが、作った当初はフロントエンドが全く分からず適当に作ったため、技術的負債がたまっている。現在では新規に機能を追加するのが難しい状態になっている

健常者エミュレータ事例集本体

  • Seesaa Wikiの機能が不足していたため、2023年の2月にWordpressを中心にする構成に移行した

構成

  • Amazon LightSail + Wordpress + Route 53

  • 長所:料金が定額であり、過剰な料金がかかることがない

  • 短所:過剰なアクセスが集中すると落ちる

    • 実際Xでバズって落ちたことがある
    • CDNを挟めば何とかなるかもしれない

利用しているプラグイン

  • wpDiscuz : コメント機能
  • WP Mail SMTP : ユーザー登録時のメール配信
  • Taxopress : タグ管理
  • Sassy Social Share : SNSシェアボタンの作成
  • Like Button Rating ♥ LikeBtn : 「いいね」「よくないね」ボタンの作成
  • Ivory Search : 検索機能
  • Advanced Random Posts Widge : ランダム記事リストの作成

健エミュ分析基盤

  • 健エミュ内に蓄積されたデータを分析するために作成された

構成

参考:

dbt Cloud, BigQuery, Looker Studioで始めるお手軽データ基盤【個人サービス向け】

健エミュX通知Bot

構成

おわりに

  • 追加で知りたいことがある方はこっそり教えてください