cdbk.tokyoのJavaScript周り

WordPressの記事管理と問い合わせ送信処理以外のほとんどをJavaScriptでしているので、その簡単なまとめ。

WordPressをREST APIとBackboneを使ってSPAで導入した時のメモ

JavaScriptの構成(ビルド・コンパイル前)

  • lib (ライブラリなど)
    • Underscore
    • jQuery
    • Backbone (MVxなフレームワーク)
    • Marionette (Backboneを便利にできるフレームワーク)
    • Chart (時折つかうグラフ描画)
    • moment (時間フォーマット計算系)
    • photoswipe (一昔前のlightbox風なモーダル)
  • common (共通Ajaxや簡単なAPI経由の一覧表示など)
  • top (トップページ用ページ処理)
  • contactform (お問い合わせ機能)
  • contactform (お問い合わせページ処理)
  • portfolio (ポートフォリオ用モーダル)
  • instagram (インスタグラムデータ取得連携)
  • post (ブログコンテンツページ処理)
  • wpmain (ブログ機能)
    • wpApplication (ブログ機能アプリケーション)
    • wpController (ブログ機能制御コントローラー)
    • wpLayout (ブログレイアウト)
    • wpPager (ブログページャー機能)
    • wpFooter (ブログカテゴリー・タグ一覧表示機能)
    • wpList (ブログ一覧表示処理)
    • wpPost (ブログ記事表示処理)
    • wpSearch (ブログ検索処理)

雑にまとめると上記のような構成で機能とページ毎で分けるようにしています。
機能面の主体はMarionetteで構成、ライブラリ以外は機能毎にコンパイルしています。

ReactやVueなどは使わず、半人月で仕上げられ、BFFもSSRもなく、Apacheのrewriteで間に合うぐらいのサイズ感です。

日本語はUnicodeエスケープ、開発時のJavaScriptはES2015をベースに行っています。

かっこよく今風のにしようとなんども考えるものの、開発コストやフレームワーク側の方針転換などでぶれたり、そもそもJavaScriptのフレームワークのライフサイクルが2年持つか持たないかぐらいの期間でしかないので、導入はもっとコストを注げる時かなという見方をしています。

その他RSSを対応させたり、API取得時のエラーで表示できないケース対応などを暇を見て対応しています。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です