Railsからフロントエンド領域だけなんとか切り出す

2407 ワード
フロントエンド Rails Rails テキストリンク

※注意：

  1. これが最適解とかいうわけではないです。個人的な経験に基づくソリューションです。
  2. Railsの良し悪しの話ではないです。あくまで開発規模や体制によっては手法を変えるのもアリだから一考するのも選択肢として存在するという話です。

前提

  • 小規模に開発していたRails製のwebサービスの機能拡張をより柔軟に行っていきたい
  • そのためサーバーサイド/フロントエンドそれぞれで課題を解決していくためにも分業化を勧めていきたい
  • Rails上のViewにフロントエンドを入れたまま分業化した場合、サーバーサイド/フロントエンドいずれかのエラーによって相手の作業をブロックするリスクを孕んでいる。
  • 既存のサービスでデグレを起こさず、開発上できるかぎりの疎結合でサーバーサイド/フロントエンド開発を実現することがゴール。

要点

  • Viewテンプレート内のbodyタグ内のDOMを取り除く
  • View内で利用していたRailsから渡される変数をscriptタグ内のグローバル変数に格納する(buttonやformなども基本的にuriだけ利用してjs側で生成する)
  • 仮想DOMで実装した外部のjsを読み込み、Rails側のグローバル変数を参照してつなぎこむ
  • あとはよきように運用する

手順

helloword.erb
<html>
<head>
...
</head>
<body>
<div>
<%= @message %>
</div>
...

のようなViewがあったとする。これを切り離したい場合。
erbは

helloword.erb
<html>
<head>
...
</head>
<body>
<script>
var bridge_data = {message:"<%= @message %>"}
</script>
<!--上記のグローバル変数を参照してDOMを作るjsを読み込む-->
<script src="/path/to/external.js"></script>

...

として、Viewをサーバー側に持たせない作りにすることで、分業をよりスムーズに実現することができる。（複雑な構成のdomほど効果は高くなる）

以上。

Ardupilot SITL(Software in the Loop)ソフトウェアシミュレーション
Pythonファイルシステム-os.path