React (Redux, TypeScript)へピボットし、開発を進めることを決めた理由

バックテックでwebエンジニアをしている井上です。
今回は、バックテックでフロントエンドのフレームワーク刷新を行った背景をお伝えします。
この記事を読んで、より社内開発の雰囲気を知ってもらえれば嬉しいです。

技術刷新の背景

弊社ではこれまで、フロントエンドのフレームワークにAngularJS(Angular 1.X系)を使用して開発をしていました。しかし、2021年6月で公式サポートが終了するという発表があり、フロントエンドのリプレイスが必要という課題が社内で挙がっていました。

さらに2020年10月から大きな新機能の開発が始まろうとしており、今まで通りAngularJSで進めていくのか、新しいフレームワークに挑戦するのかという選択をするタイミングになっていました。

結果として、既存のAngularJSではなく、React (Redux, TypeScript)で開発を進めることを決定しました。

社内にReactの実務経験者がおらず、リリース計画もぎりぎりという中で、この決定をするのはチャレンジングでしたが、決定をした理由としては以下の通りです。

レバレッジの効くことをやる

近い将来にAngularJSをすべて置き換えていくことになるのに、今AngularJSで実装すると、技術的負債を増やすことになります。AngularJSとReactでは記述方法がまったく異なるので、互換性がほぼなく、リプレイスは丸々書き直すことになります。

逆に考えれば、今Reactでやれば、リプレイスの工数をまるまる削減できるので、メリットがかなり大きいです。

また、今後の開発スピードが向上するというメリットもあります。
AngularJSではページごとにhtmlとjsを作成していたので、再利用もしづらく、コードの重複が多くなってしまい、機能追加をするにしても変更箇所が多く時間がかかるといった課題がありました。

Reactはコンポーネント志向のフレームワークです。Reactのベストプラクティスに沿ってコンポーネント単位で開発していくことにより、再利用性が高まり、新規機能実装のスピードが上がることは大きなメリットです。

また、多くの人に使われているフレームワークなので、ライブラリの数も多く、それらを使用することで、自分たちの実装量を減らせるメリットもあります。

『レバレッジの効くことをやる』というのは社内でもよく使う言葉で、間に合わせの対応をするよりも、多少リスクをとっても将来的にリターンの大きい選択をとるほうが、称賛されるケースが多いです。

最悪うまくいなかったときは、AngularJSで

リリースの期日はずらせなかったので、1~2週間やってみて厳しそうであれば、最悪既に慣れている技術を使って作り直せば間に合うと考えていました。最悪のケースを想定しておくというのは、なにかリスクをとる上では有効な手段だと思います。

最後に

弊社では、React, Redux, TypeScriptというフロントエンドの構成で最速で開発していけるフロントエンドエンジニアを募集しています！
新しい技術や、フロントエンドの開発環境をよりよくしていくことに興味がある人は、ぜひ一度お話しましょう！

▼フロントエンドエンジニアの募集はこちら
https://www.backtech.co.jp/recruit

#開発ブログ