Help us understand the problem. What is going on with this article?

react-routerをv4にアップグレードしようとしてやめた話

More than 3 years have passed since last update.

業務でreact-router v2をv4にアップグレードにしようとしたけど諦めた話を書きます。
特に得るものはないですが、気持ちを鎮めるために書きます。

使用技術

弊社では下記のような環境でWebアプリケーションを構築しています。

  • React
  • Redux
  • redux-saga

そして、アプリケーションのルーティングに下記ライブラリを使用しています。

  • react-router
  • react-router-redux

主にreact-routerでページ遷移をし、react-router-reduxで履歴などを Reduxのstoreに紐付けています。

ここまではよくある構成だと思います。

顛末

2017年3月、react-routerのv4が正式にリリースされました。
とてつもなく破壊的な内容ゆえに一大騒動となったことは記憶に新しいでしょう。

弊社でもreact-routerを使用していたので、アップデートのタイミングをうかがっていました。
そして僕がそのアップグレードを任され、いろいろと調べてみた結果、アップグレードは見送りになった、という話です。

見送った理由

react-router-reduxがreact-router v4に対応していない

一番大きいのがこれでした。
react-router-reduxの最新版はv4.0.8(2017年7月11日現在)ですが、それはreact-router v4に対応していません。現在、v5のβ版が鋭意開発中とのことで、それはreact-router v4に対応しているとのこと。しかし、さすがにプロダクトでベータ版を使用するのはためらわれるので、今回はreact-router-reduxのアップグレードを見送りました。
(今までは React Community というグループ配下にリポジトリがありましたが、5月に react-router を開発している  React Training 配下に移動しました。今後は react-router の公式Packageとして開発が続くようです。v5が早くリリースされることを願っています。)

他のライブラリが使いにくい

上述の通り、react-router-reduxがreact-router v4に対応していないので、Reduxとの接続に別のライブラリを使おうと考えました。(ルーティングライブラリ一覧)(スターが多いものはほとんどない…)
その中で以下のライブラリが候補に上がりました。

しかし、ドキュメントが少なかったり、うまく動かなかったりしたので、結局使用を断念しました。

特に困っていない

バージョンが低いことによる弊害などは特になく、現状特に困っていませんでした。また、使用するライブラリなどを変更することでバグが起きてしまう可能性もあったので、今回はアップグレードを見送ることになりました。

疑問

僕らには本当にreact-router-reduxは必要なのか…?

  • ルーティングに2つのライブラリを使用するのつらい
  • Reduxに履歴とか全部突っ込むなら、react-routerではなく別のライブラリを使用すべきなのでは?
  • そもそもReduxにつっこむ必要あるのか?

まとめ

react-router-redux v5出たら頑張る

takanorip
都内でフロントエンドエンジニアをやっています。
https://takanorip.com
folio-sec
誰もがかんたんに資産運用することができるサービス「フォリオ」を作っているFinTech系スタートアップ
https://corp.folio-sec.com/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away