Vue vs React vs Angular Part.3

**デフォルトの名無しさん** · 2019/06/12(水) 19:04:55.46

実際どうなん？
Vue
https://jp.vuejs.org/
React
https://reactjs.org/
Angular
https://angular.io/
※前スレ
Vue vs React vs Angular Part.2
https://mevius.5ch.net/test/read.cgi/tech/1552136553/
※前前スレ
Vue vs React vs Angular
http://mevius.5ch.net/test/read.cgi/tech/1545395856/

★ここではjQueryの話題は禁止です
★jQuery房が書き込んでも無視してください

**デフォルトの名無しさん** · 2019/06/12(水) 19:06:51.08

>>1
スレ建て乙

**デフォルトの名無しさん** · 2019/06/12(水) 19:11:10.66

1. jQueryはシンプルに書けるVue・Reactは冗長

証拠 https://jsfiddle.net/t62b49mp/

JavaScriptのコードはこれだけ
$('.my-component [name="switch"]').change(function() {
　$(this).closest('.my-component').toggleClass('active', this.checked);
});

2. 信者「Vueならこれだけで動く！」

嘘1 isActive=false

嘘2 new vue({data:{isActive:false}})
https://codepen.io/anon/pen/MxmrjP （動かない）

嘘3
new Vue({
el: '#app',
data: {isActive:false},
})
https://codepen.io/anon/pen/XGgpZV （変な動きをする）

3. 結論
jQueryはシンプルに書けるVue・Reactは冗長

**デフォルトの名無しさん** · 2019/06/12(水) 23:07:01.43

相変わらず社会不適合者が粘着してんのな

**デフォルトの名無しさん** · 2019/06/13(木) 11:30:36.40

>>1乙

前スレの話題、無駄に冗長なコードよりは短い方が良いだろうけど
短さも保守性の一要素であって
同じく保守性に影響する型チェックや適切な分割などとトレードオフになることもある

WebサイトというよりWebアプリ向けのフレームワークとしては
最もスマートなHello worldが書けることより
規模や複雑さが増大したときに保守可能であって欲しい

**デフォルトの名無しさん** · 2019/06/13(木) 14:24:17.80

googleで「アヌス」って検索してたら
「新婚旅行で特別な体験」っていうタイトルがヒットしたので早速開いてみたら
ディオクレティアヌス皇帝の浴場レストランに行った話だった

**デフォルトの名無しさん** · 2019/06/13(木) 21:08:40.70

ReduxもHooks対応かぁ

**デフォルトの名無しさん** · 2019/06/15(土) 18:53:51.89

>>7
ウチのポートフォリオサイトも対応しなきゃなぁ…

**デフォルトの名無しさん** · 2019/06/21(金) 08:24:19.26

SPAのメリットってなんですか？

**デフォルトの名無しさん** · 2019/06/21(金) 10:19:04.51

ひろゆきがコラム書いてる

**デフォルトの名無しさん** · 2019/06/22(土) 00:23:12.00

>>9
【メリット】
・ネイティブアプリみたいに滑らかな画面遷移が可能。

・マテリアルデザインのガイドラインに沿ったUIライブラリが豊富。

・双方向バインディングによりHTMLの状態とJavascript オブジェクトの状態を一致させる事ができ、
jQueryを用いた泥臭いDOMいじり作業が不要。

・Cordovaでアプリ化してストアに登録する事も可能。

【デメリット】
・クローラがSPAに対応してない。SEO対策が必要な案件にはSSR必須 = サバーサイドのスキルも求められる。

・jQuery等のライブラリと比較して学習コストが鬼。特にAngular。

・Angular vs React vs Vue とスレタイにある通り、まだデファクトスタンダードが決まってない。

こんな感じかな。俺的には初心者には Vue → Nuxt がオススメ。
日本語ドキュメントが豊富で取っ付きやすい。
オススメしないのはAngular。TypeScript 必須 & 覚える事多い & 開発元の Google が最近Flutterばっか推してて将来 Flutter for web に喰われるかも。

**デフォルトの名無しさん** · 2019/06/22(土) 00:33:07.00

あ、もう一つ最大のデメリット忘れてたわ。

・基本的にはモダンブラウザのみ対応。古いPCを使ってるケチな会社…もといレガシーな環境では使えない。

**デフォルトの名無しさん** · 2019/06/22(土) 02:31:23.59

よく自信満々で偉そうに思い込み騙れるな。
3つともIE9で見れるが。IE9はモダンブラウザですか？

**デフォルトの名無しさん** · 2019/06/24(月) 00:45:32.28

なんか急に過疎ってんな

**デフォルトの名無しさん** · 2019/06/24(月) 00:49:33.05

みんな見限ったんだよ

**デフォルトの名無しさん** · 2019/06/24(月) 01:02:21.54

他所で訊いてここが良いと言われたので、質問させてもらいたくやってきました

Vueをtypescriptで書いて、property-decoratorで@Emitデコレータを使いたいときに
外部ファイルからimportしたvueインスタンス(仮にextvm)に
イベントをemitしたいときってどうやればいいのでしょうか

this.$emit('call')
に
@Emit() call{}
は相当していますが

extvm.$emit('call')
を投げるにはどうすればいいのだろうかという疑問です
property-decoratorの公式も見てみたのですが
例は全部this.$emitの置き換えばかりで分からなかったので
詳しい方いらっしゃいましたらお教えいただければ幸いです
どうぞよろしくお願いいたします

**デフォルトの名無しさん** · 2019/06/24(月) 01:02:29.59

何を見限ったんです？

React?

**デフォルトの名無しさん** · 2019/06/24(月) 09:21:50.31

>>17
jQueryおじさんの妄言だろ

**デフォルトの名無しさん** · 2019/06/24(月) 13:44:24.48

ViewModel for React使ってるやついる？

**デフォルトの名無しさん** · 2019/06/24(月) 18:02:35.13

ReactとVueどっちがおすすめ？

**デフォルトの名無しさん** · 2019/06/24(月) 18:12:51.55

jsがどのくらい出来たらvue.jsとかのフレームワーク習得が良いの？
html/cssコーダーとして4年くらいやってたんだけどjQueryでdomいじるくらいで他にライブラリ導入するくらい。
正しい記法やらも知らないし、js単体でのアプリケーション作成なども全く無理な状態。

**デフォルトの名無しさん** · 2019/06/24(月) 19:15:28.51

>>21
必要ないやつには必要ない
当たり前の話

**デフォルトの名無しさん** · 2019/06/24(月) 19:55:19.48

結局はPWAっぽいものを作りたいかどうかだな

**デフォルトの名無しさん** · 2019/06/24(月) 22:44:58.68

TypeScriptはどっちみち必須になるだろうな

**デフォルトの名無しさん** · 2019/06/24(月) 23:30:41.44

なるほど。使わない人には必要ないと。
しかし今転職考えててスキルセット考えるとコーダー関連しかできませんだと、どうにも辛い状況なんですよね。
PWAだのSPAだの作れますと言える状態にしたいのは間違いないので、とりあえずjsの勉強始めます。

**デフォルトの名無しさん** · 2019/06/25(火) 01:08:11.49

google i/o 2019見た？
googleがweb.devにreactのガイドコンテンツ作るってよｗｗ
google謹製angularの立場ｗｗｗｗ

**デフォルトの名無しさん** · 2019/06/25(火) 01:44:09.87

同時に勉強すればいいよ

**デフォルトの名無しさん** · 2019/06/25(火) 03:36:11.36

>>25
転職サイトで経歴に書くならReactとか食いつきはいいよね

**デフォルトの名無しさん** · 2019/06/25(火) 06:50:25.49

>>16
やりたい事半分も理解できてないから正しい回答か自信ないけど、2つのtsコンポーネントでファンクションを共有化したいのかな。

であれば自分なら2つのコンポーネント用tsファイルとは別にexport class書いたtsファイル1つ作って、
static なファンクションの中に共有したいファンクション書くな。

後は2つのtsコンポーネント上でそれぞれ↑のクラスをimportして、
import { CommonFuncClass } from './CommonFuncClass.ts';

@Emit call{
CommonFuncClass.funcName;
}

みたいにすればいいんでない？　適当に書いてるから間違ってたらすまん。

**デフォルトの名無しさん** · 2019/06/25(火) 14:58:20.86

TypeScript使ってないと死んでしまう

**デフォルトの名無しさん** · 2019/06/25(火) 15:04:15.58

死んでも困らない

**デフォルトの名無しさん** · 2019/06/25(火) 15:05:28.37

TypeScriptはあまえ

**デフォルトの名無しさん** · 2019/06/25(火) 23:31:08.98

スレの趣旨から少しずれてすみません
VueJS使っていて

どうしても $.ajax() の利便性を用いたく（jsonpの利用等で）
VueJS中でこういった部分的なjQueryの実装をしている人はいますでしょうか？

**デフォルトの名無しさん** · 2019/06/25(火) 23:32:26.85

キメラせずに素直にaxios使ってください

**デフォルトの名無しさん** · 2019/06/26(水) 00:06:33.98

>>33
通信部分で何使おうが大勢に影響ないし好きにしたら良い
唐突な$が気持ち悪い程度の話

**デフォルトの名無しさん** · 2019/06/26(水) 02:09:39.85

>>33
jQueryでDOMいじりしないならjQuery混在させても良いんじゃない？
ただajaxなんて使わなくても、Vueにはaxiosがあるからそっち使ったほうがいいよ。
（jQuery入れてると、jQueryしか出来ない馬鹿がjQueryをDOMいじりに使いやがるから）

あと、JSONPを使うのはCORSの制限回避の為？　素直にコンテンツサーバー側のCORS設定見直したほうが方向性としては正しいかと。

**デフォルトの名無しさん** · 2019/06/26(水) 03:51:32.78

むしろVueJS使わずに、jQueryにしたほうが良いのではないか？

**デフォルトの名無しさん** · 2019/06/26(水) 04:41:57.12

どうせやるんならVueよりもReactやった方がいいと思う

**デフォルトの名無しさん** · 2019/06/26(水) 08:35:04.28

スレタイの３つがどうなっていくのか色んな予想あるけどよくわからんなあ

**デフォルトの名無しさん** · 2019/06/26(水) 08:54:25.99

>>39

349 デフォルトの名無しさん sage 2019/04/11(木) 19:42:22.98 ID:GR4ezT/u
日本にいるとVue人気だから勘違いしそうになるがやっぱ採用実績はReactが圧倒してるんだな。475kサイト vs 64kサイトか……
しかしなぜかGitHubのスター数だけタメ張ってるｗ
Top JavaScript Frameworks For 2019
https://www.codementor.io/nikhil21tyagi/top-javascript-frameworks-for-2019-s8881i8ga

パフォーマンスについてはReactよりVueのほうがいいな。
AppRunってやつ速くて気になる。
しかしAngularいくらなんでも酷すぎる……
A RealWorld Comparison of Front-End Frameworks with Benchmarks (2019 update)
https://medium.freecodecamp.org/a-realworld-comparison-of-front-end-frameworks-with-benchmarks-2019-update-4be0d3c78075

**デフォルトの名無しさん** · 2019/06/26(水) 10:17:06.57

毎回同じヤツが言ってるのか知らんが旧版のAngularJSをAngularかのようにミスリードするのはどうかと思う

**デフォルトの名無しさん** · 2019/06/26(水) 11:19:59.87

Vue.js, jQuery は、併用できない

Vue.jsは仮想DOM で、独自のタイミングでDOMを更新するから、
jQueryで実DOMを変更しようとしても、元に戻ってしまう！

axios を使えば？

**デフォルトの名無しさん** · 2019/06/26(水) 12:36:54.61

RubyｷﾁｶﾞｲがhttpクライアントライブラリであるaxiosでDOM操作するようですｗｗｗｗｗ

**デフォルトの名無しさん** · 2019/06/26(水) 21:22:06.32

といいつつ大体共存してるんよねVue使ってるサイトって

**デフォルトの名無しさん** · 2019/06/26(水) 21:43:55.15

react + axios でええやん

**デフォルトの名無しさん** · 2019/06/27(木) 08:05:58.08

SPA自体が微妙

**デフォルトの名無しさん** · 2019/06/27(木) 19:53:10.03

全体から見たらほとんどのライブラリがjQuery要求するしなぁ
もちろん代替自体は進んでるけど、世の中新規案件より過去案件の保守しなければいけないポイントは増え続けてるわけで。

**デフォルトの名無しさん** · 2019/06/27(木) 20:06:51.85

ふーんMath.jsとかlodashとかThreeJSとかjQuery要求するんだ。へぇ。

**デフォルトの名無しさん** · 2019/06/27(木) 20:31:34.45

ReactやAngularって5年後使われていると思いますか？

**デフォルトの名無しさん** · 2019/06/27(木) 21:12:08.57

うん

**デフォルトの名無しさん** · 2019/06/28(金) 00:34:49.13

いや

**デフォルトの名無しさん** · 2019/06/28(金) 06:44:40.28

電子化して働き方改革だあ！って号令のもと新規で社内システム作っちゃったから5年は面倒見ることになりそう、後輩が…

**デフォルトの名無しさん** · 2019/06/28(金) 22:46:21.72

React は残るんじゃない？　バックが Facebook だし。
Angular が残るか消えるかは Google の気分次第かな。現にAngularJSは消えた様なもんだし。
Vue は Evan の個人開発だから、Evan の寿命が Vue の寿命かな。

33 · 2019/06/29(土) 01:05:21.67

助言を沢山下さりありがとうございます。
JQueryとの併用を検討してみます。

**デフォルトの名無しさん** · 2019/06/29(土) 01:19:30.63

実務ならそっちの方がいいかも知れんが学習が目的ならjQueryは完全に省いて
フレームワークの機能で賄う設計を身に着けた方がいい

混ぜる事を前提で進めるとどうしても設計的な欠陥に陥りやすい

**デフォルトの名無しさん** · 2019/06/29(土) 07:46:42.97

react自体なくなっても結局ああいうものがまた作られると思うぞ。

**デフォルトの名無しさん** · 2019/06/29(土) 10:45:14.45

Reactは完成形だけど状態管理が後付けだからなー

**デフォルトの名無しさん** · 2019/06/29(土) 11:18:41.10

根幹的にはブレることは無いとはいえ、その辺はまだ発展中なんだよな

Redux Hooksも今月リリースされたばかりだし
https://react-redux.js.org/next/api/hooks

**デフォルトの名無しさん** · 2019/06/29(土) 11:39:53.32

React Routerとかその辺も近いうちにHooks対応するだろうとかその辺の方向性は見えてるけどね

**デフォルトの名無しさん** · 2019/06/29(土) 12:49:00.59

公式じゃないのがね

**デフォルトの名無しさん** · 2019/06/29(土) 13:14:38.94

>>53
facebookだからみんな離れていったの知らないの？
未だに訴訟リスクは残る