2
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

vue.jsユーザーの驚く、JSファーストの世界(特にReact)

Last updated at Posted at 2022-02-01

はじめまして、これまでvue.jsをメインで開発してきた自分が、最近リアクトを勉強して驚いたJSファーストについて書いてみようと思います。

#①vue.jsの最初に覚えるv-if,v-modelなどの、「v-hoge」系のvue独自の記法は、無駄なFW自体の学習コスト

これ自分は、vue学んだ時にフレームワークを学ぶなら仕方ないような〜〜〜的な感じで軽く考えていました。
むしろ何も分かっていなかったので、v-modelとかよくわからんけど、JSで書くより楽なんじゃ?と思ったりしていました。

ただ、MVC(MVVM)の概念をもとに、結構無理に分割した結果、このv-hoge系の機能を実装してることを知りとても驚きました。

JSファーストでは、DX(開発者体験)を重要視するため、無理にMVCやMVVMの概念で分割するのではなく、この辺は機能ごとにコンポーネントに分割しようぜっていう考え方があります。
そのため、フレームワーク独自のお作法(例:v-hogeなど)ではなく、そのままのJSを知っていれば書ける書き方になっており、無駄なフレームワークの学習コストを上げないようになっているんですね。。。

#②HTMLと、JSが融合していてきもい!!!けど、これが真のJSファーストの姿。

vue.jsやRailsを勉強していた自分からすると、HTMLと、JSの各場所は分けたい(MVVMの責務の切り分け)をとても重視していました。
ただ、これは初見殺し的な部分が大きく、ある程度JSとHTMLを融合させて書くことで、上で書いたFW独自のルールを覚えるコストを削減し、さらに開発者のDXを上げるため、アプリケーションの機能ごとのコンポーネントの分割をよりしやすくするための工夫なのです。

つまり、MVCやMVVMの概念を無理に当てはめてコンポーネントを実装させるのではなく、機能ごとに分割したほうが良くね?という設計思想のもとReactのようなJSファーストのFEは作られていたのですね。

2
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?