Vue vs React vs Angular Part.4

■ このスレッドは過去ログ倉庫に格納されています
2020/06/11(木) 19:01:45.26ID:uGsh0NQC
実際どうなん？
Vue
https://jp.vuejs.org/
React
https://reactjs.org/
Angular
https://angular.io/
※前スレ
Vue vs React vs Angular Part.3
https://mevius.5ch.net/test/read.cgi/tech/1560333895/

★ここではjQueryの話題は禁止です
★jQuery房が書き込んでも無視してください
2020/06/30(火) 13:47:46.89ID:ww2Xd+MO
「フレームワークを習得」とか言ってることに違和感があるんだよなｗ
必要なら使うだけなんだし
2020/06/30(火) 14:33:38.78ID:ojYrCHBE
Ruby on Rails では、Bootstrap か、React が多い。
Vue.js は、見ない

コンポーネントだから、組み合わせやすいのだろう。
ある部品だけ、Reactを使うみたいな感じ

それに米国の企業だし
2020/06/30(火) 14:59:46.72ID:Ee44cQ0O
rubyのことは聞いてないから
2020/06/30(火) 15:28:22.98ID:j70U2+kl
>>45
ReactはFrameworkではなくLibraryだから、
他と組み合わせしやすいんでしょう

最近はRails関連でもReact使ってるのか
Reactはecosystemが充実してるな
2020/06/30(火) 16:27:02.21ID:ojYrCHBE
Ruby on Rails + React + Bootstrap + Material UI

Elemental UI は見ない
49デフォルトの名無しさん
垢版 |
2020/06/30(火) 17:40:35.19ID:Ug8SveUy
>>43
それならangular,next(react),nuxt(cur)との比較になる。
ただ習得難易度を比較するのはあまり意味がないと思う。迷うなら全部入れて弄ってみた方がいい。世間の評価と随分印象が違う事に気づくと思うよ。
俺はvueが好きだが選んだのはangular。
2020/07/01(水) 04:39:24.40ID:BX/M4O4u
Rubyやってるヤツの頭の中がいかにごちゃごちゃなのか分かる書き込みだな
5148
垢版 |
2020/07/01(水) 08:29:04.91ID:Zme9Nt79
Ruby on Rails では書き方を強制した、規約だけのStimulus も使う

それをリアクティブプログラミングにした、StimulusReflex もある
2020/07/03(金) 23:22:38.78ID:KyXHMv2P
Vue3.0からクラスベースのコンポーネントって無くなるの？
2020/07/03(金) 23:25:04.49ID:uIgOlo/V
ほらな。まーた今までの技術がオワコンになった（笑）
2020/07/03(金) 23:28:17.94ID:IqbF62xT
Reactでは随分前にそうなってたもんな
2020/07/04(土) 03:45:46.09ID:q+uG7L9l
reactってSFC標準にならないの
ファイル数多いから敬遠しちゃう
56デフォルトの名無しさん
垢版 |
2020/07/04(土) 03:50:59.89ID:OxpkXjjx
スーパーファミコン
2020/07/04(土) 09:58:26.51ID:Kg/e4APV
今どきスーファミとかだっせーよなー
2020/07/04(土) 18:47:03.26ID:JKT0dJEu
時代はメガドライブだよな
2020/07/06(月) 00:53:12.33ID:PFmAGtDP
ReactのHooksが登場してからは、Reactが一番導入のハードル低い気がするなー
Hooks系のライブラリ充実してるし
2020/07/06(月) 01:44:53.57ID:v1x+2Pdq
useEffectでjQueryと共存なんてキモチ悪いことも簡単にｗ
2020/07/06(月) 12:22:09.69ID:+5y8OyVS
Vue3.0
7月にRC
8月に正式版リリース
2020/07/06(月) 12:44:59.12ID:E5MtnOl4
どう変わるんや
2020/07/06(月) 19:58:43.29ID:QfKF0PFS
reactに近づく
つまりreactでよくね？ってなる
2020/07/06(月) 20:05:31.64ID:dZeM1NWt
つうかElmでいいじゃん…
2020/07/06(月) 20:28:13.21ID:v1x+2Pdq
svelteならまだしもelmはもう終わってるでしょ
2020/07/06(月) 20:29:20.31ID:PFmAGtDP
でも色んなツール出た方が活性化していいと思うなー
変化が無い方が廃れるの早いやろし
2020/07/07(火) 00:34:20.29ID:LF/sym53
vueのTS対応遅いからreactに移ったわ
JSXが嫌いだったけど慣れたら便利だな
2020/07/07(火) 07:07:55.28ID:FRgW1MQ9
Vue3.0はvueの書き心地の良さだいぶ減る気がする
リアクティブなデータが一段ネストされるのもストレス
69デフォルトの名無しさん
垢版 |
2020/07/07(火) 20:34:43.73ID:IVftZWlI
reactってクライアントサイドフレワなのに
サーバサイド技術のnpmとかnode.js
がインストールに必要なの意味わからなくね？
なんでjqueryと同様にCDNで配布してsrcで読み込む
シンプルな形式にしないの？
トランスパイルって鯖と蔵どっちで処理してんの？

なんでトランスパイラそのものをライブラリ内に
組み込んでHTMLのsrcで読み込んでブラウザに仕事させれば
いいものをユーザにnpmとかyarnとかwebpackとか
reqireさせるわけ？
そしてなんで色々なやり方が錯綜する訳？

なんでPHPがapacheやMySQLとズブズブに
蜜結合してるのと同じ轍を踏むわけ？
2020/07/07(火) 20:54:32.97ID:5jV7r1Oa
実行時のリソース消費を減らすためだよ
2020/07/07(火) 20:55:13.15ID:5jV7r1Oa
ちなみにCDNとscriptタグの組み合わせも使えるよ
2020/07/07(火) 21:12:22.45ID:Csl+eNq2
有名なフレームワーク・モジュールには、CDN もある

Ruby on Rails など、ウェブ系の開発者は、
VSCode, Node.js, Webpack などが必須

jQuery, Bootstrap, React なども
2020/07/07(火) 22:59:11.42ID:Ttnpigl4
>>69
おめーがアホだから理解不能なだけだろが
74デフォルトの名無しさん
垢版 |
2020/07/08(水) 00:21:09.70ID:739odCbc
>>69
>サーバサイド技術のnpmとかnode.js

この認識が可笑しい
75デフォルトの名無しさん
垢版 |
2020/07/08(水) 00:30:48.93ID:J4hybS9S
>>67
確かにvueのtypescript対応は不親切。
てかいい加減公式サイトぐらいtypescript対応しろと。
2020/07/08(水) 10:52:27.83ID:jfQpAxCR
>>72
だからお前いつもグルーピングがおかしいってば
2020/07/08(水) 11:23:22.62ID:s7sJ7O7X
rubyｶﾞｲｼﾞに触るな
7872
垢版 |
2020/07/08(水) 11:59:26.81ID:Z8A6jaoN
>>69
トランスパイルは、サーバー側でする。
その開発環境が、Node.js

もし、JSX で書いて、それをブラウザでトランスパイルすると、
時間が掛かるので、推奨されない

だから事前に、Node.js, Webpack, Babel, Browserify, Uglify, CssShrink, AutoPrefixer などで、
ES2015, JSX などを、ES5 に変換しておく
2020/07/08(水) 12:06:07.93ID:t4n6CtPA
なんでガイジ鯖でトランスパイルなんてとんちきなこと言ってんのかと思ったけどもしかしてc9みたいな環境でやってんのかなこいつ？
8072
垢版 |
2020/07/08(水) 12:10:06.57ID:Z8A6jaoN
トランスパイルの手順も、タスクランナーのGulp か、
プロジェクトのpackage.json 内の、npm scripts に書いて実行するだけ

watch 機能を書いて、ファイルを保存するたびに、自動的にトランスパイルすることもできる

Ruby on Rails では開発用サーバーに、webpack-dev-server を使う
8172
垢版 |
2020/07/08(水) 12:12:49.23ID:Z8A6jaoN
そもそも、ブラウザでトランスパイルするのは、全ユーザーが同じ変換をするから無駄

サーバーなら、1回の変換で、全ユーザーに対応できる。
変換後のHTML を送るだけ
2020/07/08(水) 12:17:22.01ID:QRjt2V7u
めんどくせーならNuxtでも使えや。
8372
垢版 |
2020/07/08(水) 12:20:39.69ID:Z8A6jaoN
Docker か何かの開発サーバーじゃないの？

漏れは、自分のPC 内のWindows 10, WSL, Ubuntu 18.04 で、
VSCode の拡張機能、Remote WSL を使って、
Linux側に、プロジェクトを作っている

Windows側からのブラウザアクセスは、
VSCodeの拡張機能・open in browser ではローカルファイルアクセスとなるので制限されるが、
VSCodeの拡張機能・Live Server では、サーバーを立ててのアクセスとなるので制限されない

Linux側には、日本人が作った、バージョンマネージャーのanyenv で、rbenv, nodenv を使って、
ruby 2.6.6, node 12.16.2 を入れた

yarn は、Windows側に入れて、WSL から、拡張子なしのyarn コマンドを呼べる。
これは、#!/bin/sh で始まるシェルスクリプト

anyenv は多言語向きで、rbenv, nodenv, pyenv, phpenv などを同じ使い方で、統一的に扱える。
同様のツールに、asdf もある
2020/07/08(水) 12:25:17.49ID:Kr2gnfN5
devcontainerのほうがいいでしょ
環境切り替えが楽チン
2020/07/08(水) 12:28:10.14ID:hmU+YLWt
anyenvとかすぐに重くなるから嫌い
なんとかenvは全部作り直せと言いたくなる
8672
垢版 |
2020/07/08(水) 14:11:54.59ID:Z8A6jaoN
phpenv が重いのは、すべてのファイルをコピーしているからとか、

何かのサイトに書いてあった
8772
垢版 |
2020/07/08(水) 14:16:33.13ID:Z8A6jaoN
Stoyan Stefanov の本には、Babel, Browserify は、

グローバルにインストールした方がメリットが多い、とか書いてあるけど
2020/07/08(水) 15:16:59.06ID:t4n6CtPA
>>81
そうじゃなくて、reactっていうかJSXのトランスパイルはrubyｷﾁｶﾞｲであるお前以外の99%はブラウザでもサーバでもなくフロントエンドの開発マシン、要は手元のPCでビルド時に行うの。
2020/07/08(水) 15:28:49.13ID:MVSOOhWY
いや俺はデプロイ先のコンテナでビルドするように設定してるけど
2020/07/08(水) 15:33:35.61ID:Kr2gnfN5
それはないな
起動が遅いのはコンテナでは許されない
2020/07/08(水) 16:12:22.96ID:MVSOOhWY
>>90
リリースのたびにローカルの開発環境でnpm run buildみたいなコマンド打って、トランスパイルされたjsファイルを手作業でアップロードみたいな作業するの？
零細サイト(アプリ)ならありかもしれないが…
2020/07/08(水) 16:19:50.85ID:I47WXMxT
なんで手動って決めつけてんの？
ビルドプロセスにデプロイも含めるでしょフツー
2020/07/08(水) 16:28:48.25ID:0bRtE3JM
>>91
Laravelならプロジェクト一式の中にwebpack関連の一式も入ってるけどね
2020/07/08(水) 16:47:50.70ID:Kr2gnfN5
>>91
手動でアップロード？
意味わからんこと言うなよ
95デフォルトの名無しさん
垢版 |
2020/07/09(木) 10:02:09.72ID:mOpBi7N3
>>91
tsファイルの変更を自動検知して.jsに自動でトランスパイルする設定で
開発するのが普通なんじゃないの

>>92
deployっていう用語は開発が終わって本番サーバーに移すときに使う感じでしょ

開発中のこまめな修正はbuildだから
buildとdeployはセットにしてしまうと不便
頻度が違いすぎる
2020/07/09(木) 10:04:52.31ID:G/OlOUwD
インフラ屋には「開発」って概念がないからｗ
あいつらは出来上がったものを配布するだけ
配布するときにビルドが必要かどうかってことしか知らない
ビルドだけが必要という発想がない
2020/07/09(木) 10:35:48.43ID:w7BJW0S5
CIでビルドからデプロイまでやるわなフツウ
毎回デプロイまでプロセス進めるわけでもないが
なんらかのトリガで自動デプロイまで整ってないとしんどいよ
2020/07/09(木) 12:28:57.46ID:KHuqFwsC
蔵「ここに要素追加で！中のここのテキストは決まり次第連絡します」
ワイ「よっしゃ手空いたし実装すすめたろ！ここのテキストは適当にうめとこ！できた！フロントビルドして表示確認したろ！」
CIとやら「ビルド＆デプロイ！」
本番サイト「おちんちんびろーん」
蔵「…」
2020/07/09(木) 12:52:10.72ID:CLykJNt5
手動デプロイする人、ビルド構成1つしか使えない人、いろいろいるんだなあー
2020/07/09(木) 14:13:27.36ID:fGQp3/0X
手動デプロイって人数1人の超小規模開発だけだろ
2020/07/09(木) 14:22:33.72ID:fGQp3/0X
なんかこのスレ、
・開発中のローカルサーバーでのビルド
・本番等へのデプロイ時に行うビルド
をごっちゃにしてる奴が居て話が噛み合わないわ
2020/07/09(木) 14:25:16.59ID:w7BJW0S5
どっちも同じだろ
パラメータ少し変えるだけだし
103デフォルトの名無しさん
垢版 |
2020/07/09(木) 14:39:00.18ID:vrNDocOm
ほらね
2020/07/09(木) 14:42:43.21ID:w7BJW0S5
まさかローカル用とデプロイ用で分けてメンテしてんのか？
DRYはどこに行ったんだ
2020/07/09(木) 14:46:26.77ID:KHuqFwsC
ハァ？なんでローカルの開発マシンで既にビルドしてるフロントをまたサーバーでビルドするんだ？
腐った思考がグルグル回ってんのはお前の頭ん中だけ。DRYじゃないのはお前。
2020/07/09(木) 14:51:31.22ID:w7BJW0S5
>>105
はぁ？
開発中はローカルでビルドするし、CIサーバーでもビルドする
当たり前のことだろーが
お前、はっきり言って意味わからんよ
2020/07/09(木) 15:02:50.19ID:pDJXId50
言うほどローカルでビルドする？
108デフォルトの名無しさん
垢版 |
2020/07/09(木) 15:15:30.24ID:fGQp3/0X
>>104
そもそもローカルではwebpack-dev-serverとか使って効率化するだろ。
お前…まさかファイル更新する度に毎回ビルドコマンド打ってるのか？

>>105
そもそも本番とかってリリース用のブランチと同期しながらリリースするんだから開発マシンとか関係ないだろ。
お前…まさか自分の開発マシンでビルド　したファイルを直接本番とかの環境にデプロイしてるのか？
2020/07/09(木) 15:18:52.05ID:dGRiARSQ
てかそもそもローカルで開発やってんの？
2020/07/09(木) 15:19:43.38ID:7NNwjcns
本番機械にデプロイしてから
デバッグしてるよ
2020/07/09(木) 15:50:54.77ID:U0+2kDKX
両方成敗されててワロタｗｗｗｗｗ
2020/07/09(木) 16:06:12.14ID:mOpBi7N3
デプロイとか書くのやめたほうがいいよ
バカっぽいから

deployの発音と全然違う
2020/07/09(木) 16:09:12.55ID:DLLEuHaF
デッポｫイ
2020/07/09(木) 16:12:04.53ID:p1w6aC/e
>>108
今はコマンドを打つかウォッチで自動化するかどうかは関係ない
どっちにしろ構成は同じだ
2020/07/09(木) 16:57:49.39ID:Oqcc9RL+
ディプ・ローイ
116デフォルトの名無しさん
垢版 |
2020/07/10(金) 00:30:34.49ID:wxXFpnos
gulpとかbabelとかwebpackとかyarnとか本末転倒なんだって
そんなものこれっぽっちも使いたくないんだよ。

楽したいと思うからフレームワークに頼るわけであって
使えるようになるまでコマンドいくつも叩くくらいなら
ネイティブJavaScriptで全部やりゃいいだろってなるわ
2020/07/10(金) 00:51:02.42ID:2N+fP911
じゃなんでこのスレ開いたんだ
2020/07/10(金) 01:17:45.44ID:jhbOVfsR
>>116
はっきりと勉強したくない（努力したくない・技術力をつけたくな）って言ったらどうか？
技術者の道具っていうのは自動車でも飛行機でも
技術力をつけて初めてさらに高度なことが出来るようになるもの
勉強しないで使えるものじゃないんだよ
2020/07/10(金) 01:26:15.32ID:ykDeil39
npm install && npm run watch
たったこれだけやん
あとはソースの更新を自動検知して再ビルドしてくれる
2020/07/10(金) 01:26:33.04ID:ykDeil39
あ、Laravelの場合はね
2020/07/10(金) 02:14:28.34ID:73Gt5ed7
確かにwebpackはクソ。
俺はビルド設定職人じゃねえっての。
何にでも設定あるのは仕方ないがややこしいすぎめんどすぎ設定方法すぐ変わりすぎ。
投げ捨ててsnowpackを使うことにした。
webpackはとっとと滅べ！
2020/07/10(金) 05:57:04.39ID:QHte8x2K
Ruby on Rails は普通、Heroku を使う

Rails 6 からは標準で、Webpack。
プロジェクト内に、node_modules もあるし、
最初から、Yarn に、便利なコマンドも登録されている

webpack-dev-server も入っているから、
最初から、ソースコードの変更をwatch している。
VSCode の拡張機能・Live Server のwatch と同じ

有名なYouTuber、雑食系エンジニア・KENTA も、
CircleCI も必要だって言ってるだろ
2020/07/10(金) 06:13:16.31ID:tMSRuIv2
>>116
ほんとだね
12472
垢版 |
2020/07/10(金) 07:49:21.18ID:QHte8x2K
Node.js, Webpack, Babel, Browserify, Uglify, CssShrink, AutoPrefixer などが無ければ、

ES2015, JSX などを、ES5 に変換できない
125デフォルトの名無しさん
垢版 |
2020/07/10(金) 08:17:54.92ID:gdbFqfW8
どんだけ必要なんだよww
馬鹿かよビルドばっかでReactの本題がほとんど頭に入らんわ
ちゃんと整理しろよwwww
2020/07/10(金) 08:47:02.79ID:LiH0PaR7
あの程度のツールの組み合わせもまともに理解できないような輩は
プログラムを仕事でやるのは辞めてほしいわ。
railsなんか使っても何がどこに作用してるかわからなくて糞コードになるのが目に見えてる。
2020/07/10(金) 09:00:52.47ID:ykDeil39
>>125
必要じゃなくてLaravelやRailsならもうプロジェクトに一式入ってる環境が整ってるからビギナーが気にする必要ないわけよ
2020/07/10(金) 09:09:17.82ID:ykDeil39
>>125
てかReactとか普通に入門書やらチュートリアルサイト見ればNode入れてcreate-react-app入れたら
create-react-appで新規プロジェクトを作成してnpm startやるだけって書いてあるだろ
それすらできんって言うんならプログラミングの才能ないからやめた方がいいぞ
2020/07/10(金) 09:46:57.35ID:GKub8uAj
魚捌けなくても寿司は食えるみたいな
130デフォルトの名無しさん
垢版 |
2020/07/10(金) 10:16:52.30ID:tLJkl0Xj
CPUが古いからかcreate-react-app、実行したら2分くらいかかるんだけど
新しめのRyzenとかだとどれくらいでcreate-react-appの処理終わるの？

>>128
チュートリアルの最初にcreate-react-appでてくるし
プログラミングの才能とかそんなレベルの話じゃない気がする

しかしReactの公式ドキュメントはそのあと一気にハードルあがる
いきなりゲームを作りましょうとかの解説になって挫折したわ
ゲーム作りはチュートリアルのレベルじゃないだろ！とツッコミたい

YouTubeの解説とかのがよっぽどわかりやすい
2020/07/10(金) 10:38:58.61ID:QHte8x2K
Bootstrap があれば、CSS 知らないでも、レスポンシブ対応できる

create-react-app は良いけど、
その後、どこから無料の、awesome なコンポーネントをパクッてくるのか、それが重要

Material-UI か？

Rails なんて、React からのコンポーネントのパクリしか考えていないw
132131
垢版 |
2020/07/10(金) 10:42:42.45ID:QHte8x2K
青色のボタンを使うと、Bootstrap 臭がするとかw

Rails は今や、Node.js, Webpack, React からのパクリしか考えない、段階に入ったw
2020/07/10(金) 10:46:13.74ID:4aXnhBqR
別にプロジェクトのイニシャルやるのに2分くらい掛かってもいいだろ
変更検知ビルドで2分掛かってたら大問題だけど
2020/07/10(金) 11:25:16.45ID:n1XvZUez
>>131
アイコンなら普通にReactDOMにリンクするdivタグがあるhtmlでcdn読み込みすればいいんじゃね？
2020/07/10(金) 13:26:16.21ID:2N+fP911
>>130
CPUじゃなくて回線速度じゃねえの
2020/07/10(金) 13:41:18.34ID:/uHfdbTh
IDEで新規プロジェクト作成に２分も掛かってたら待ってらんない
SQLのクリエイトデータベースでもそんなにかからない
2020/07/10(金) 15:23:36.78ID:tLJkl0Xj
遅いのは主に回線速度なのかなぁ？
みなさんは、create-react-app、何秒間で終わる？

>>136
Visual StudioでC#とかやってたから2分は相当長く感じる
2020/07/10(金) 18:51:55.72ID:QmDdrWog
create-react-appでプロジェクト作るところを言ってるのか、そのあとのbuildのことを言ってるのかどっち
2020/07/10(金) 18:59:02.17ID:nECgv1tu
だいたいwebpackのせい
滅びろ
2020/07/10(金) 19:09:24.73ID:tLJkl0Xj
>>138
もちろん、時間のかかる前者。project作成みたいな作業
ほかのひとは何秒くらいかかってるのかな、と
自分は120秒超えてたはず

そのあとのbuildというのはbuildしてる感覚はないのでよくわからない。
VSCodeがtsの変更を監視して.jsに変換するのがbuildなんだろうけど、
JSがcompile不要言語だからbuildといわれてもしっくりこない
後者は1秒未満
2020/07/10(金) 19:20:51.32ID:K5rpfeoQ
だいたいトランスパイルが面倒さの原因だしtsのまま動くようにしてほしい
142デフォルトの名無しさん
垢版 |
2020/07/10(金) 19:44:24.02ID:sls7voqY
よくもまあHTMLに埋め込むだけで動作する
シンプルなJavaScriptをここまで複雑にしたもんだ

開発環境複雑なのはマジでゴミだと思うわ
ツール名並べてビルド環境自慢してる奴はおもちゃ
組み立ててはしゃいでるガキと同じ。
そもそもそんな糞みてーなビルドなんかなくても動く
言語だったこと忘れてるみたいですね。
2020/07/10(金) 20:01:19.85ID:2N+fP911
>>142
シンプルで済むのはお前が一人で作るカップラーメンのタイマーくらいなんだが
■ このスレッドは過去ログ倉庫に格納されています
5ちゃんねるの広告が気に入らない場合は、こちらをクリックしてください。
ニューススポーツなんでも実況