SSR実装の改善: shadow-cljsへの移行とワークアラウンドの削除

[boxp]

SSR実装の改善

このPRでは、VR-Matchプロジェクトのフロントエンド部分、特にサーバーサイドレンダリング（SSR）に関する問題を解決するための実装を行いました。

主な変更点

1. shadow-cljsへの移行

   • shadow-cljs.ednファイルを作成し、既存のproject.cljの設定を移行
   • npmパッケージを直接利用できるように設定

2. CLJSJSパッケージ用シムの実装

   • React, React DOM, Material-UI, Firebaseのシムを作成
   • 既存コードとの互換性を保ちながら、npmパッケージを直接利用

3. クライアントコードの更新

   • Material-UIラッパーコンポーネントを最新の方法で実装
   • クライアントエントリーポイントを標準的な実装に更新

4. SSRサーバーコードの更新

   • ServerStyleSheetsを使用した標準的なSSR実装に変更
   • レンダリングロジックを簡素化

5. プリアンブルファイルの簡素化

   • 不要なコードを削除し、最小限の設定のみを残す

6. Dockerfileの更新

   • 最新のNode.jsイメージを使用
   • ビルドプロセスを簡素化
   • ファイル書き換えのハックを削除

期待される効果

• JavaScriptパッケージの二重管理が解消される
• ハックとワークアラウンドが取り除かれる
• 標準的なSSR実装パターンに移行できる
• ビルドプロセスが簡素化される
• メンテナンス性が向上する
• 将来のアップデートが容易になる

検証方法

1. フロントエンドディレクトリで npm install を実行
2. npm run build:dev でビルド
3. npm start でサーバーを起動
4. ブラウザでアクセスして動作確認

[boxp]

依存関係の問題を修正しました

npm ci 実行時に発生していた問題を解決するために、以下の変更を行いました：

1. package.json の依存関係を更新

   • 互換性のあるバージョンに変更
   • firebase を optionalDependencies に移動
   • npm-run-all2 を npm-run-all に変更

2. インストール方法の変更

   • npm install --no-optional を使用して、問題のある firebase パッケージをスキップ

これにより、ビルドが正常に実行できるようになります。

[boxp]

依存関係の問題を修正しました

npm ci 実行時に発生していた問題を解決するために、以下の変更を行いました：

1. package.json の依存関係を更新

   • 互換性のあるバージョンに変更
   • firebase パッケージを完全に削除（シムを使用して対応）
   • npm-run-all2 を npm-run-all に変更
   • バージョン番号を安定版に調整

2. インストール手順

   • package-lock.json を削除
   • npm install または npm ci を実行

これにより、ビルドが正常に実行できるようになります。

[boxp]

masterの変更を取り込み、依存関係の問題を再度修正しました

npm ci 実行時に発生していた問題を解決するために、以下の変更を行いました：

1. masterブランチの最新の変更を取り込み

   • firebaseのバージョンを5.11.1に更新

2. package.json の依存関係を更新

   • 互換性のあるバージョンに変更
   • firebase を optionalDependencies に移動
   • npm-run-all2 を npm-run-all に変更
   • バージョン番号を安定版に調整

3. インストール手順

   • package-lock.json を削除
   • npm install --no-optional または npm ci を実行

これにより、ビルドが正常に実行できるようになります。