概要

気づいたらこの記事書いて1年経過していた & 僕自身が React から卒業したので、ここ3年ぐらいのフロントの動きを振り返ってみようというモチベーションです。

React と Vue の視点からお送りします。
それ以外は こちら↓ をご参考までに。

補足

事実 + imo ベースでお送りします
１エンジニアが見ていた風景なので他の方とずれはあるかも
別に見ても何の足しにもならないので、見るならお酒片手に「あ〜こんなことあったな〜」と斜め読みしてください

2020

React

特に大きい動きは無し。
hooks API リリースが2019.6だったのですが、本体のリリースはしばらくお預け状態。

Vue

version3 リリース
当時 Vue を触っていたわけではないので多くを語れませんが、composition API は耳に入ってきていました。

imo

この当時、React はモダンでいけてるよみたいな空気だった気がする。
とともに X では Vue VS React みたいな投稿をよく見かけた。

この年に僕は初めて React に出会いました。当時勧められた技術が、

Redux
emotion
tsx
hooks

デファクトスタンダードとされていたのは

prettier
eslint
webpack

あとは、

styled component が当時は main だった記憶
fetch は page で書いてそのままコンポーネントに受け流す
コンポーネントの分け方は atomic design 以外のものは聞いたことがないものの、良いとはされていなかった
UI FW が結構使われていた気もする。vuetify / MUI など

この時は「store を噛ませる構成」が普通だった。
しかし jsx で書かれているコードも多く残っており、Redux * jsx は中々つらみがあった。

2021

React

log から追いかけるとリリースしたのはこれだけで、この年も大きい動きは無し。
それでもずっと動いているように感じたんだから、エコシステムが活発だったんだろうなという印象。

Vue

React と対照的に Vue は細かくリリースを積み重ねていますね。
2020年末に Vue3 リリースなので、この年は3.2.0までリリースしているようです。

imo

JAMStackに出会い、Gatsby.jsを触る → GraphQL / SSGにも触れる
Blitz.jsにも出会う → full stack JS のようなものの機運がやや高まっていた気がする
- BFFなり、BaaSみたいなものも full stack JS の流れでポツポツ聞くになった気もする
jsx から tsx にリプレイスする案件が多くなる。新規で jsx はもう選択肢としてなかった気もする
この時は Redux がまだ使われていた。新規の選択肢にもなっていた
SWR / recoil いいよという情報に触れ始める
このぐらいからコンポーネントの分け方にも名前や流派が付き始めた気もする
copilot始まった
npm が嫌われている。yarn がデファクトになりつつあったし、pnpm 初めて聞いたのもこの時
vite に出会う
Vue3 の話も耳に入ってきた
- このあたりで以前は Vue を使っていた人が React に流れてきた印象がある

基本的に yarn と tsx がとても良かった。SWR / recoil の話は耳にしつつも、Redux 全然良いやんという感じだった。
あとは vite が衝撃的だった。早い。そして設定も簡単。
webpack ほど細部までのチューニングはできなかったものの、そもそもそんなもの必要な application どの程度あるんだという話もあり、出会って以降の新規開発に webpack は選ばなくなった。

2022

React

version18 リリース。
log を見ていると useId がこの時。exprimental ながらも React Server Components(以下RSC) が入ったのもこの時。
あとは、createRoute が console 上で推薦されるようになった記憶。

Vue

Vue はこの年も細かくリリースを重ねているようですね。

imo

React18 の話が耳に入り始める
Next いいよみたいな空気を感じ始めていた
Gatsby の話は聞かなくなってきて、Remix / Astro / Svelte など他の FW をよく聞くようになってきた
React Hook Form / React Routerみたいなのはよく触った
もう Redux を選ばなくていいよねみたいな空気感になっていた

SWR を実際に触ったのがこの年。正直 Redux 選ぶ必要なくなったなと思った。
Redux も webpack 同様 too match なケースが多い。
React の application なら、SWR + useContext で事足りた。

後カスタムフックの話を耳にし出したのも確かこの辺。

2023

React

2023の正式リリースはなかったようですね。
ただし、この年はその他の動きが多かった。

Create React App の終焉

みんなのお父さん dan さんからのコメント。過去-現在-未来について細かく書かれており非常に良きと思った記憶が。
個人的にも触り始めた当初はお世話になったので、感謝の意しかありません。
(CRA から始めたpjで yarn eject された webpack の設定を触ってたのもいい思い出。多分)

Next による RSC を使った機能提供

微妙に2023ではない気もしますが、こまけぇことはいいんだよ。
最近は追えてないですが、これ以降も RSC をまともに扱えてるのは Next だけのような気もする??

アンチ Next の機運

問題提起

アンサーソング

この時になるほどなと思った意見が、「アンチ意見が目立つほど広く使われてきた証」的な post をみて確かにと思いました。

recoil の開発が止まる

機会があれば使ってみたいと思っていただけにややショックでした。

React.dev のリリース

これは本当に嬉しかった。2022までは公式docsがクラスコンポーネントで書かれていたので、新しく教える時の教材に毎回困ってたんですよね...

Vue

Vue は引き続きリリースを重ねています。
これは最近 Vue を触り始めたので知りましたが、2023にリリースされた3.4は minor version ながらも大きいリリースだなと思いました。

imo

Astro 実際に触った
JAMStack はもういないんだ
Next App router 開幕 → さよなら emotion
Headless UI 系の躍進
- 気づいたら MUI とかはあまり見なくなっていた
- chakraUI は良さそう感
create react app の終焉
studio をよく目にし出した
アンチ Nextの機運
さよなら recoil

React server component の影響で大好きだった emotion(というか runtime css in js) が使えなくなった。悲しい
さらに、emotion を利用していた MUI などの一部 UI FW も巻き添えを喰らっていた。

まとめ

俺の emotion を返せ

2024(余談)

Vue に転向しました
- React が嫌いになったとかではなく単純に転職した影響で
React version19の話とかはチラ見してますが、それぐらいの温度感です

次は React と Vue の比較を書きます。多分