[表示 : 全て 最新50 1-99 101- 201- 301- 401- 501- 601- 701- 801- 901- 1001- 2ch.scのread.cgiへ]
Update time : 11/13 10:50 / Filesize : 306 KB / Number-of Response : 1032
[このスレッドの書き込みを削除する]
[+板 最近立ったスレ&熱いスレ一覧 : +板 最近立ったスレ/記者別一覧] [類似スレッド一覧]


↑キャッシュ検索、類似スレ動作を修正しました、ご迷惑をお掛けしました

Vue vs React vs Angular



1 名前:デフォルトの名無しさん mailto:sage [2018/12/21(金) 21:37:36.86 ID:NZqrEm960.net]

実際どうなん?
Vue
https://jp.vuejs.org/
React
https://reactjs.org/
Angular
https://angular.io/
VIPQ2_EXTDAT: default:vvvvv:1000:512:----: EXT was configured

263 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 01:44:23.63 ID:GHq8zte20.net]
>>253
ネットはおかしい情報が多い。
ちゃんと本を見たほうがいいよ。

264 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 01:45:15.56 ID:dfUEINu60.net]
>>254
デストラクタの中で解放する1行を書き忘れた場合、それでも動くから
どこかで不具合が起きるだろうが、ソースが何10万行も有る
プログラムの場合、この間違えて書いてしまった行を探し出すのに苦労することになる。

265 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 01:45:52.84 ID:dfUEINu60.net]
ミスったw

デストラクタの中で解放する1行を書き忘れた場合、それでも動くから
どこかで不具合が起きるだろうが、ソースが何10万行も有る
プログラムの場合、この間違えて書き忘れた行を探し出すのに苦労することになる。

266 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 01:46:57.29 ID:GHq8zte20.net]
>>253
std や auto_ptr を使うから難しく感じるんだよ。
何度も言うが、それは C++ ではない。これはマジ。
今の std:: 系のライブラリはSmalltalk の信者が作ったものらしい。
C++ の標準化委員会がおかしなことになっていて、もはや、本来のC++
ではなくなってきており、だから、C++が難しいと感じる人が増えている
気がする。

267 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 01:47:47.99 ID:dfUEINu60.net]
>>258
え?お前C++使いこなせないの?

268 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 01:48:20.38 ID:GHq8zte20.net]
>>257
クラスが 100種類の場合、デストラクタは 100 個しかない。
だから、ソースが数10万行あっても、100箇所を調べるだけで済むよ。

269 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 01:49:31.69 ID:dfUEINu60.net]
>>260
調べる箇所が100箇所でも
何を解放し忘れたかを確認するのは大変

270 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 01:49:40.75 ID:GHq8zte20.net]
>>259
日本だと auto_ptr みたいなのが C++ だと思ってる人がいるけど、
勘違いだよ。

271 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 01:51:15.37 ID:dfUEINu60.net]
stdなんちゃらを使わなかったら
バッファオーバーランで脆弱性になるし
それでも動くから
どこかで不具合が起きるだろうが、ソースが何10万行も有る
プログラムの場合、この間違えた行を探し出すのに苦労することになる。



272 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 01:51:20.27 ID:GHq8zte20.net]
>>261
だから新しい言語を次々に覚えて C/C++ だけは覚えないで過ごしてきたのかな、
あなたは?
数十の言語を覚えるより、C/C++ を1つ覚えるだけが良いと思うよ。徹底的に
それだけを学んだほうが良い。

273 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 01:51:48.19 ID:dfUEINu60.net]
>>262
勘違いとかそうでも良いわw
auto_ptrが使えて、実際にauto_ptrが使われるがC++だから

274 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 01:53:24.20 ID:dfUEINu60.net]
>>264
はいそうですね。C/C++は数十の言語を覚えるのと同じぐらい苦労しますもんね
いろんな言語の機能をキメラのように組み合わせた言語ですから
人によって書き方がぜんぜん違う

auto_ptrを使ってるだって!?これC++じゃないよ!
って言う人がいるぐらいだから

だから開発効率が悪い

275 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 01:54:19.14 ID:5ssU2x9I0.net]
さもTypeScriptが競合であるかのように突っかかってきてるが全く的外れ。

TypeScriptのトランスパイルターゲットはJS。
競合はその他AltJS。
この中では既に天下取って安泰。

C++のコンパイルターゲットはWASM。
競合はRust、Kotlin、.NET、、、どんどん増えるぞw
がんばってな!w

もちろんナマのJSはWeb界のグルー言語として残り続けるよ。
シェルスクリプトが性能を理由に消えないようにね。

276 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 01:54:36.76 ID:GHq8zte20.net]
>>263
そうならないように、C から C++ に進化してきたんだ。
そのために、コンストラクタ、デストラクタの概念が導入された。
それだけでも十分に安全で簡単に書ける。
逆に、std ライブラリは構造が理解しにくいので難しく感じるんだろう。
auto_ptr とか使おうとすると、C++ は一気に煩雑で嫌いになってしまうと思う。

だから、auto_ptr も std:: 系ライブ来も SmallTalk 信者が作ったものであって、
C++ の流儀とは全く異なる異質なもの。C++ で SmallTalk をやろうとするので
めちゃくちゃ複雑になってしまっている。

277 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 02:22:49.78 ID:GHq8zte20.net]
>>266
>はいそうですね。C/C++は数十の言語を覚えるのと同じぐらい苦労しますもんね
C++98 まで覚えれば大体C++の基本は習得できていて、それはそんなに大変
ではない。

・auto_ptr 系は、uniq, smart など沢山ありすぎるので、初心者には難しく、
 下手に使うと、生ポインタより危険かも知れない。これらはかなり後発のものなので、
 最初は覚える必要はない。
・std:: 系ライブラリは後から習得すればよい。

278 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 03:28:22.27 ID:NEY8ay330.net]
>>229
マジで?!
だって公式のデモはiPhoneだと動かへんで?

279 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 04:23:45.97 ID:VGvE+KfY0.net]
>>270
まさかSafariとか使ってないよね?

280 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 08:13:08.13 ID:a9PctXZid.net]
C/C++は使うべき場面が決まってるから他の言語と揉めたりしないと思ってたんだが。

281 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 09:05:05.03 ID:yk1KGOSba.net]
なんかSafariだけで動くwasmの代替品独自に作ってなかったっけ?



282 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 09:40:07.95 ID:SgfrIpbp0.net]
>>271
SafariもWasmはサポートしてると読んだけど、確か。

283 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 09:53:24.60 ID:GHq8zte20.net]
TypeScript って、MSの独自言語なんだよね、知らないけど。

284 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 10:06:57.83 ID:GHq8zte20.net]
>>261
例えば、VS の VC++ で C++ ソースをデバッグモードでビルドして、できたバイナリを
デバッガで実行すると、そのアプリの終了時に、メモリーリークが起きているか
どうかがIDEの Output Pane に出力されるようになっていて、その

285 名前:際、どのソースの
何行目で new TYPEしたオブジェクトが解放し忘れているかが、ずらずらと一覧表示される。

で、その場所が分かったら、多くの場合は、そのポインタをメンバ変数に「持っている(have a)」
class のデストラクタに、1行、delete ptr; と書くだけで、メモリーリークは直る。

例外として、複数のポインタから同じオブジェクトを参照していて、かつ、そのポインタ
が永続的にグローバル変数や、何らかのクラスのメンバ変数に格納されている場合には、そこまで
単純には行かない。その場合は、プログラマが頭で考える必要がある。
[]
[ここ壊れてます]

286 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 10:21:08.64 ID:uBt5bsN50.net]
C++の方向性は最初から何も変わっていない
ctor/dtor, RAII, ムーブとより整理されていっただけ

1985 C++ / TYPE * (Cfront 1.0)
1986 C++ / (実装予定のtemplateなどの説明した文書が公開)
1991 C++ / T* (template可能, Cfront 3.0)
1992 C++ / auto_ptr (STL実装, 例外導入, RAII)
1998 C++ / (最初の標準化, C++98)
2011 C++ / unique_ptr (ムーブセマンティクス, C++11, auto_ptr非推奨化)
2015 Rust / 言語レベルで所有権システムを導入 (デフォルトがムーブ, Rust 1.0)

wasmに絡むとはいえスレチ気味で
しかも古いやり方の話を何レスしてるんだか・・・

287 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 12:08:13.64 ID:ARXdU5axd.net]
>>274
カバーしてる範囲が他のブラウザーに比べてかなり狭い

288 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 12:29:26.16 ID:PdBWBPPzd.net]
このスレ的にはわざわざC++使うんじゃなくてTS→wasmじゃないの

289 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 13:09:58.06 ID:cmhWA5saM.net]
tsnativeかts.net来ないとwasmにはコンパイル出来ないだろ。
せっかくAltJS戦争に勝ってブラウザのjsに対する忖度パワーをすべて手に入れたのにわざわざwasm戦争に参入する必要はないだろ。
c++の構文が古くさすぎ冗長すぎで嫌、rustの構文はキモすぎて嫌と言うならkotlinかc#にすれば。

290 名前: mailto:sage [2019/02/13(水) 18:53:44.11 ID:Wb2hS8BD0.net]
>>249
C++ はひどい言語だ。これは、多くの平均以下のプログラマーが使ってるために
さらに輪をかけてゲロゲロになっていて、どうしようもないゴミが
簡単に生産されるようになってる。正直いって、C を選ぶ理由が C++ プログラマーを
追っぱらうため *だけ* だったとしても、それ自体、C を使う強力な理由になりうる。

C++ はトンでもなく悪い設計の元になりうる。どうせこの言語ではいつも STL やら
Boost やら、その他ゲロゲロベロベロの「素敵な」ライブラリの機能を使って、
それがあんたのプログラムに「役立つ」んだろうが、以下のことが起きる:

- うまく動かないときにもたらされる際限のない苦痛 (あと STL とか、特に Boost が
安定してるとか移植性があるとかいう奴は、どいつもこいつも大ウソつきで、
もはや笑えるレベルを超えている)

- 非効率な抽象プログラミングモデルで、2年たった後にこれらが実はそんなに
効率的じゃなかったことに気づくケース。でもそのときにはすでに全部の
コードがその素晴らしいオブジェクトモデルに依存していて、直すためには
アプリ全体を書き直さなきゃなんない。

言いかえれば、唯一まともで、効率がよくて、システムレベルで使えて、移植性がある
C++ ってのは、基本的に C で使える機能だけに限ったときなんだ。そして C だけに
限定するってことは、他の人がそれをめちゃくちゃにしないってことで、
ついでに沢山のプログラマが実際に低水準の問題を理解することができて、アホらしい
「オブジェクト・モデル」のたわごとを持ちこまないってことだ。

291 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 20:56:27.69 ID:kDMwAzYp0.net]
VuexとReduxってどっちがムズイの?



292 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 20:56:51.46 ID:kDMwAzYp0.net]
もしかして考え方同じ感じ?

293 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 21:10:22.40 ID:tuDfzjia0.net]
Angularってwikipediaには「フロントエンドWebアプリケーションフレームワーク」って書かれてるけどまさにその通りだよな。javascriptのフレームワークって感じではないわ。
HTMLとCSSとjavascriptの技術を採用したweb

294 名前:Tイト開発フレームワークって感じ。 []
[ここ壊れてます]

295 名前:デフォルトの名無しさん [2019/02/13(水) 21:18:15.13 ID:sgtLrhrBr.net]
Reduxのほうがムズいけど、これからやるならReduxがいい

296 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 21:20:44.51 ID:dfUEINu60.net]
>>284
JavaScriptのフレームワークって感じではないって意味がわからんぞ。

普通はJavaScript製のフレームワークって意味だろ
○○(何かしらの言語)製のフレームワークなのだから
AngularはJavaScript(製)のフレームワークだ

別の言語なら、〇〇(言語)のフレームワークなんてものが存在するのか?

297 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 21:31:05.74 ID:kDMwAzYp0.net]
angularとReact、Reduxってどっちが簡単?

298 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 21:51:18.70 ID:jwc/pNVH0.net]
学生時代、英単語の暗記が得意だったやつはangular、数学が得意だったやつはreact

299 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 22:24:48.70 ID:tuDfzjia0.net]
>>286
なるほど。
ピュアjavascripで書いたら大変な記述をちゃちゃってやってくれるからスレタイの3つとかjqueryとかはjavascript(の)フレームワークって呼ばれてると思ってたんだがとんだ勘違いだったのね。

300 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 22:28:21.60 ID:tuDfzjia0.net]
冷静に考えれば>>289はライブラリか。

301 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 22:33:40.93 ID:cHKWNBlR0.net]
jqueryとreactは自称ライブラリ、vueとangularは自称フレームワーク
公式サイトのトップを見た限り



302 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 23:20:38.84 ID:dfUEINu60.net]
>>289
それを言ったら、jQueryで使うのはピュアJavaScriptだし
Angularで使うTypeScriptやReactで使うJSXは
ピュアJavaScriptではないけどさ

303 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 23:44:57.61 ID:D91GFqhb0.net]
react捨てるにしてもreduxの考え方は学んどいて損はないよ。

304 名前:デフォルトの名無しさん mailto:sage [2019/02/13(水) 23:51:17.06 ID:jwc/pNVH0.net]
hook apiとcontext apiデフォで使えるようになるから個人ユースの規模ならredux必要なくなるよ。

305 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 08:50:15.44 ID:4Gf71Z9ua.net]
>>284
Angularと比べるならVueとよりもNuxtと比べる方が合理的だな

306 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 08:51:45.88 ID:4Gf71Z9ua.net]
>>286
コーディングはすべてTypeScriptだけどね

307 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 09:00:56.39 ID:kPGufiyx0.net]
ものは試し
初心者だがAngular勉強してみるわ

308 名前:デフォルトの名無しさん [2019/02/14(木) 11:29:40.87 ID:MlsuSDTjr.net]
reactにしとけ

309 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 12:15:57.21 ID:nZj2/pMr0.net]
React勉強したがやっぱりウェブサイトの殆どには適用できない技術だな
例えばニュースサイトにReactを導入するメリットはないだろう

310 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 12:30:22.33 ID:mbps9XCNa.net]
融通が利くのはVue

311 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 12:39:53.13 ID:HVhxRx5Ma.net]
MVC+Vueが世界最強



312 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 12:43:26.84 ID:QUGQ3bvOr.net]
>>299
画面遷移がなくなるからメリットはありだろ

313 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 13:14:13.76 ID:kPGufiyx0.net]
Reactにした
Angularバージョンで詰みそうになる感じだし
学習リソース少ないし

314 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 13:22:31.29 ID:MhXZGfUyd.net]
潰しの効かなさを除けばAngularが一番いいと思う。ガッチリした設計な分だけ迷わずに使えるしプロジェクト管理もしやすい。
ただ習得してもキャリア的なメリットが薄そうだから自分で選択する気になれん。

315 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 13:27:23.06 ID:DBAMfZpK0.net]
当分は問題ないだろうけどAngularは将来的にはどうなるんだろうな
同じくGoogle製でしかも競合となるFlutter/Hummingbirdのリリース準備が進んでるみたいだし

316 名前:デフォルトの名無しさん [2019/02/14(木) 14:07:13.01 ID:MlsuSDTjr.net]
世の中的にはReactが主流

317 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 14:42:13.00 ID:nZj2/pMr0.net]
>>302
画面遷移をなくせなんて誰からも要望来てないんだが?

318 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 14:43:08.15 ID:nZj2/pMr0.net]
VueもReactもAngularも将来性はないよ

近い将来にWebComponentに
置き換わることが決定している

319 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 14:51:21.14 ID:kPGufiyx0.net]
>>308
逆って聞いたけど

320 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 15:15:15.70 ID:nZj2/pMr0.net]
逆って今WebComponentがないのに
今WebComponentを使ってるわけ無いだろ

321 名前:デフォルトの名無しさん [2019/02/14(木) 15:35:58.92 ID:MlsuSDTjr.net]
>>307
お前バカだろ?
だいぶバカだな



322 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 18:38:55.70 ID:MhXZGfUyd.net]
結局ピュアjavascriptを真面目に身につければOK?

323 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 18:54:26.61 ID:nZj2/pMr0.net]
ピュアJavaScript + jQueryだな

https://w3techs.com/technologies/history_overview/javascript_library/all
73.8%に増加。今でもjQueryのシェアは圧倒的で伸び続けている。

324 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 18:58:38.20 ID:pR+IykPzM.net]
どうせwpだろwww
railsが使われてるからrubyが死にきれないのと似たようなもんwww

325 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 19:03:26.19 ID:nZj2/pMr0.net]
だから「本当にやりたいこと=WordPressでできる範囲のこと」なんだから
フレームワークもいらんし、どうせjQuery使われてるからjQueryでいいってことなんだよ

326 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 19:04:04.42 ID:nZj2/pMr0.net]
需要と供給

いくらすごいことができるようになっても
求められてないんだよ。

327 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 19:07:18.73 ID:pR+IykPzM.net]
間違ってないと思うがなぜwpのスレに籠らずこんなスレ来て啓蒙活動してるのかw
他人が勉強するのが不安で怖いんだろ?ww
そんな女の腐ったようなセコい性格だからいつまでたっても童貞なんだよwww

328 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 19:08:13.46 ID:nZj2/pMr0.net]
wpを持ち出してきたのお前じゃん?
頭大丈夫か?

329 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 19:14:23.47 ID:pR+IykPzM.net]
論理に破綻はないが?wp圧倒してるの事実だし。現状に安穏としたいならしてれば?俺らは勉強するから、ってこと。図星刺されて恥ずかしくなっちゃったのかなw
お前のやってることってテストの前に勉強してるやつをガリ勉・ダサいとレッテルはって集団でみんなで堕落しようとセコい行動する女みたいなんだよw
男でそれじゃダメだよ。

330 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 19:14:29.36 ID:fSoz/vTj0.net]
angularは勧めんな。railsもそうだがああいう丸ごと全部なものになれると
それ以外なんもできなくなる。

331 名前:デフォルトの名無しさん [2019/02/14(木) 19:17:17.50 ID:MlsuSDTjr.net]
wpしか使えない底辺カスは死ぬまでjquery使ってろ



332 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 19:20:32.23 ID:nZj2/pMr0.net]
>>319
> 論理に破綻はないが?wp圧倒してるの事実だし。

wp圧倒してるの事実である根拠は?
事実だとしてそれがjQueryにどれだけ影響してるの?
wpのシェアなんてウェブ全体からすればたいしたことないじゃない

333 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 19:21:17.93 ID:DfU+cSuaa.net]
新しいフロントフレームワークが出た時に丸ごとすげ替えれるならなんでもいいよ
俺はMVCがベストバランスの正解だと思うがね

334 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 19:22:01.34 ID:nZj2/pMr0.net]
backboneを勉強した人は無駄になった。
Angularも1系を勉強した人は無駄になった。
jQueryは登場してから13年使われ続けている。

これが現実やで

335 名前:デフォルトの名無しさん [2019/02/14(木) 19:25:35.68 ID:OfZpiUzn0.net]
wpの保守死ぬほど大変だけどな。てかフレームワークとwpは全く別物だろうよ。ブログのフレームワークと言えない事も無いが。

336 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 19:38:24.66 ID:pR+IykPzM.net]
>>322
ビルトインされてるよ。テーマによってはwpビルトイン版と競合を避けるため他のバージョンを別に導入する場合もある。
そしてwpのシェアはcms中では60%、全Web中では33%
だからwp除くならjQueryは40%程度だなw

337 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 19:43:27.31 ID:nZj2/pMr0.net]
> だからwp除くならjQueryは40%程度だなw

圧倒的シェアじゃないか!

338 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 19:50:59.92 ID:pR+IykPzM.net]
最初からシェア小さいとは言ってないだろw
増加してるのはwpのシェア増につられてだろうと予測しただけ。
おそらく合ってるなw
jQueryバカが威張るのは滑稽。

339 名前:デフォルトの名無しさん [2019/02/14(木) 20:14:34.64 ID:MlsuSDTjr.net]
jqueryしか使えないバカが多い
バカのくせにバカを賛美している

340 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 20:27:26.21 ID:nZj2/pMr0.net]
所で仮想DOMのアプローチって本当に速いのかな?

仮想DOMはDOMを触らないって言うけど、
結局最終的な形にするためにDOMを構築するでしょう?
そのときに要素を作ったり削除したり

そんな事しないで、CSS使って要素を隠したり表示したほうが速いない?
jQueryはDOM操作が得意なわけだけど、DOMを作ったり削除したりするんじゃなくて
classを変更して見た目を変えることで擬似的にDOMが表示されたり消えたりするって
いうのがベストプラクティスだと思ってる。この場合はDOMの構築をやらないので
仮想DOMのアプローチよりも速いんじゃない?

341 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 20:30:52.74 ID:RyxU72PZ0.net]
cssのが早いのは当たり前だろ…
お前、こういうスレ来るのは10年早いよ。
真摯に勉強しろやマジで。スレタイ読まずに荒らしてないでさぁ



342 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 21:08:57.94 ID:kPGufiyx0.net]
VuexとReduxって難易度変わらない?

343 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 21:10:34.79 ID:nZj2/pMr0.net]
どちらも単に面倒くさいだけじゃないの?

344 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 21:11:54.44 ID:nZj2/pMr0.net]
正直Reduxとか使うよりも、カスタムイベントを使ったほうが楽だと思う

345 名前:デフォルトの名無しさん [2019/02/14(木) 21:25:16.30 ID:MlsuSDTjr.net]
マジでお前来るなよ
スレチクソキチガイが
テメーの妄想なんかどうでもいいんだよ
勝手にjqueryスレ立ててそっちでやれバーカ

346 名前:デフォルトの名無しさん mailto:sage [2019/02/14(木) 21:53:19.44 ID:nZj2/pMr0.net]
だが断る

347 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 07:48:37.76 ID:ayjwUPM20.net]
>>304
そういう観点ならNuxtでもいいと思う

348 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 08:12:30.75 ID:+Jrl5jTr0.net]
Vueが最強なんじゃね?
仕事ならReact

349 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 08:39:56.97 ID:5wBlw8GS0.net]
仕事でもnuxtつこてるわ
angularとreactは敷居が高め
他のメンバーが嫌がるのよ

350 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 08:56:20.31 ID:EFNDTiKGa.net]
そういやVueでもjsx使えるとかVueの和書の一番厚い本に書いてあったな

351 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 09:54:44.63 ID:Nwwq6bubM.net]
reactのために作ったってだけである種類の関数の入れ子をxml風に記述できるというだけの独立した仕組みだからreact関係なく使えるよ。



352 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 13:09:17.41 ID:YF3F5Mzod.net]
>>337
そうなのか。興味湧いてきたのでちょっとNuxt試してみます。

353 名前:デフォルトの名無しさん [2019/02/15(金) 19:10:03.96 ID:s9lB6bHor.net]
ReactやVueやる奴らは当たり前だがフロントデザインやUXできるんだよな?

354 名前:デフォルトの名無しさん [2019/02/15(金) 19:14:19.75 ID:uyGcnsGR0.net]
>>330
仮想domのメリットは最終的にはリアクティブ。その例で言えばjQueryは要素を消すのに.hide()して直接domを操作するが、リアクティブでは単に変数をfalseするだけになる。
複雑な入力フォームも恐ろしく作りやすくなるから、一度vueの公式見るといい。

355 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 19:47:12.24 ID:fQG3bb7RM.net]
勉強しなくていい言い訳探しに来てる奴に何言ってもムダ

356 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 21:10:18.28 ID:Tr9ixmy70.net]
>>344
> その例で言えばjQueryは要素を消すのに.hide()して直接domを操作するが、
あー、それがお前の根本的な間違いなんだよ。
お前っていうか、世間一般?使い方間違えてるんだよね。
そういうDOM操作なんてしません。

jQueryでは単にHTMLのclassの(例えば)activeをdeactiveにするだけになる。
複雑な入力フォームも作れるし、classを変えるだけで全く違った表示にすることができる
そのフォームを使ってる間JavaScriptは全く使用しない。
デザイナが自由に好きなデザインで作ることができる。
そしてjQueryではclassの値を変えるだけになる。

357 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 21:28:10.41 ID:LmytZ3o2d.net]
>>343
むしろそっちのが専門や

358 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 21:31:08.33 ID:fQG3bb7RM.net]
jQueryのhideはdisplay: noneだろ。
active、deactive(笑)に至っては意味不明。
jQueryではそういうときはactiveクラスをtoggleClassで付けたりはずしたりするんであって、active外してdeactive(笑)つける、deactive(笑)外してactive付ける、なんてマヌケなことはしません。
やっぱりね、自分が勉強したくないもんだから他人の足を引っ張ろうとするような女の腐ったような童貞は自分が上げてるライブラリもまともに使いこなせないwwミジメ過ぎwwwww

359 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 21:33:20.85 ID:kkRd+/gL0.net]
jQueryからreactならそこまで乗り換えコストかからんと思うけどな。

360 名前:デフォルトの名無しさん [2019/02/15(金) 21:46:27.22 ID:s9lB6bHor.net]
>>347
合格

361 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 21:48:11.36 ID:Tr9ixmy70.net]
>>348
ん?お前俺が言ったことと大差ないよな?

activeクラスを 付けるor 外す ことで表示の切り替えを行うから
そんなことでDOM操作なんてしないってことだろ?

でそれが>>330で書いたことにつながるんだよ。
仮想DOMは最終的にDOM操作をするから遅くなるが、
jQueryではCSSによって見た目を切り替えるだけだから速いってこと



362 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 21:51:50.27 ID:zC296ldL0.net]
いやDOM APIを通じて操作するんでしょ

363 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:06:11.07 ID:Tr9ixmy70.net]
>>352
そりゃVueやReactだって最終的にはDOM APIを通じて操作するよ
ただしその操作の内容を、DOM要素の削除や追加じゃなくて
クラス名を変えて表示を切り替えるだけにすると速いってこと

364 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:07:28.91 ID:NXuVhChr0.net]
Angularの方が難しいの? Reactの方が自由に構成決めたりコーディングしたり出来る分、
自分で決めなきゃいけない事が多くなって逆に難易度高いって聞いたけど。

Angularの方が環境構築も規約も全部世話してくれるから楽だって聞いたからAngularから入ったんだけど。もしかして騙された?

365 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:10:09.24 ID:I8iEDAq80.net]
>>354
英語などの単語の暗記が得意だったならangular
数学が得意だったならreact

366 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:14:49.66 ID:fQG3bb7RM.net]
さすがjQueryバカ。伊達に名前にバカって付いてないな。
クラスの付け外しも厳然たるDOM操作。
そんなことも分からないとは…使われるjQueryもかわいそうだ。

367 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:20:03.31 ID:I8iEDAq80.net]
そもそもjQueryのコア機能はDOM操作なんだが…
DOM操作しないならjQuery要らねーよ。
贔屓のライブラリの存在理由否定してどうする。

368 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:22:45.45 ID:Tr9ixmy70.net]
>>357
DOM操作のうち、class属性を変えるだけにするということ
そしてCSSでブラウザにネイティブ処理させるから速いんだよ
要素の追加や削除は必要最小限にするのが鉄則

369 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:29:21.05 ID:Tr9ixmy70.net]
>>354
自分がやりたいことと、フレームワークが提供してくれる機能とのバランスだよ

業務アプリみたいに複雑なインターフェースのアプリをガッツリと大量(=画面数が多い)に
作らなきゃいけないならAngularがいいだろうけど、そうでもないなら
Reactで適当にデータ管理してやれば楽ってこと
Angularはいろんなことを面倒見てるけど、そこまでやることないじゃん?って思うならReact

更に言うならウェブサイトみたいなものはjQueryで十分ってこと

370 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:30:21.14 ID:fQG3bb7RM.net]
> ネイティブ処理させるから速いんだよ

だったらネイティブのDOM API使うわw
You Don't Need jQuery!
https://blog.garstasio.com/you-dont-need-jquery/dom-manipulation/

371 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:33:24.44 ID:Tr9ixmy70.net]
>>360
それもバランスの問題だな。
そこ見ても分かるだろ?いずれの例もjQueryの方が短く書けている
開発効率の高さがあるからjQueryのほうが良い訳



372 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:34:33.79 ID:fQG3bb7RM.net]
せっかくだから日本語版
jQueryは必要ない(You Don't Need jQuery)
https://github.com/nefe/You-Dont-Need-jQuery/blob/master/README-ja.md

373 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:37:44.38 ID:Tr9ixmy70.net]
フレームワークの欠点は単純なウェブサイトでは
生産性を落とすという大きな問題があるってこと

374 名前:デフォルトの名無しさん [2019/02/15(金) 22:38:05.96 ID:s9lB6bHor.net]
https://i.imgur.com/obAeeP9.png

375 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:38:49.90 ID:Tr9ixmy70.net]
ついでだから、jQueryは必要ない(?)から一例を抜粋

8.7 slideToggle

スライドを伴って、エレメントの表示・非表示を切り替えます。

// jQuery
$el.slideToggle();

// Native
let originHeight = '100px';
el.style.transition = 'height 3s';
let { height } = el.ownerDocument.defaultView.getComputedStyle(el, null);
if (parseInt(height, 10) === 0) {
el.style.height = originHeight;
}
else {
el.style.height = '0px';
}

376 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:41:31.02 ID:fQG3bb7RM.net]
css tricksのYou Might Not Need jQuery
https://css-tricks.com/now-ever-might-not-need-jquery/

その翻訳
https://coliss.com/articles/build-websites/operation/javascript/now-ever-might-not-need-jquery.html

377 名前:デフォルトの名無しさん [2019/02/15(金) 22:43:21.30 ID:s9lB6bHor.net]
DOMにノードを追加すると、DOM APIと直接対話するVanillaを1回呼び出すだけで済みますが、jQueryは多くの操作を実行します(スタックが長すぎて画像に収まりません)。違いは明らかです。

Vanilla:4ミリ秒
jQuery:95.3ミリ秒
Vanilla Javascriptは、追加時のjQueryよりも約25倍高速です。

378 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:44:41.61 ID:Tr9ixmy70.net]
>>367
いや、だからそんなことをしないで、クラスの書き換えだけを
やることで高速化できるって言ってるんだよ
話ついてきてね

379 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:48:19.07 ID:zC296ldL0.net]
>>359
使い分けって言いながらフレームワーク要らないって言うから意味不明になるんだよ
「自分の仕事では」要らないって話だろ?

380 名前:デフォルトの名無しさん [2019/02/15(金) 22:51:08.66 ID:s9lB6bHor.net]
>>368
class追加するだけでもjqueryより10倍速いんですが?
https://i.imgur.com/nEJCnHz.png

381 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:51:38.93 ID:7RVZ/4z70.net]
削除はともかく、追加がクラスの書き換えだけの訳ないわな。その書き換える対象がまだ無いんだから。



382 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:51:58.45 ID:fQG3bb7RM.net]
jQueryはネイティブに比べて遅い上にサイズも大きすぎる。
画像でもないのに数十kBとかアホか。
短く書けりゃいいのならnanoなど代替ライブラリもある。
nanoのコード例:
$(".someClass").css("background-color:green;").html("Hello World");
$('#c').animate('2.3', '1.2','0','1','1','0','0', '0','0','1').css('background-color:red').text('Hello');

$("#a").on("click", function(){

$("#someDiv").css("background-color:green;color:#fff;");

})

nanoは0.6kB。
jQueryは100倍もコード容量かけて何やってんのwwwww

383 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:54:11.02 ID:I8iEDAq80.net]
ボコボコでワロタw
我が物顔でスレチ荒らしするからこうなるww

384 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:54:50.30 ID:Tr9ixmy70.net]
>>372
じゃあnano使えば良いんじゃないですか?
フレームワークよりも大幅に小さいし

385 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:56:00.99 ID:Tr9ixmy70.net]
ウェブサイトではフレームワークは重すぎで生産性を下げるという
大きな問題があるが、jQueryやnanoはDOM APIの冗長性を省くだけだから
生産性は上がるしか無いというのが大きなメリットなんだよ

386 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 22:59:32.27 ID:fQG3bb7RM.net]
まあjQueryがいらないのは確かだね。
要素のstyle操作程度ならなおさらね。
「DOM操作しない方がいい」って言ってたし、じゃあDOM操作ライブラリのjQueryはいらないねw
え、やっぱりDOM操作したい?そして短く書きたいって?
100倍軽いnanoがあるよw

387 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 23:04:02.60 ID:Tr9ixmy70.net]
nano信者か・・・

388 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 23:05:15.16 ID:Tr9ixmy70.net]
そういやzeptoとかもあったけど、
今までの経験上、軽いだけの代替ライブラリは
結局本家を超えることって無いんだよな
nanoが普及すると良いね

389 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 23:09:04.09 ID:ca0WBun30.net]
すまん、ガチで話についていけてないんだが、>>351でjQueryは速いって書いてあるからjQueryは速いのか!って思ってたんだけど結局遅いの?

390 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 23:11:01.96 ID:zC296ldL0.net]
何をもって速いとするかに依る

391 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 23:11:48.08 ID:ca0WBun30.net]
>>380
速さを求めるときに使うもの?



392 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 23:12:36.21 ID:fQG3bb7RM.net]
GitHubがjQuery辞めたので https://ushirock.hateblo.jp/entry/2018/07/28/013507

jQuery が DOM 操作の際に eval() を多用しているため CSP を safe モードで使えないらしい

これは jQuery の核になる部分の仕様らしく、 .html() はどんな時でも任意のコードを実行する可能性があると

やっぱり jQuery といえば Sizzle でのセレクタ解析が遅いとか(querySelectorが使える場合優先されるらしい)ネイティブへの置き換えとかに目が行きがちだけどもこういう深い話でのデメリットもあるんだなと

393 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 23:14:27.13 ID:Tr9ixmy70.net]
>>379
jQueryが速いなんて言ってないんだが?
ファイルサイズではフレームワークよりも小さいから
初回ダウンロードは速いだろうけど。

速いって言う話はDOM操作で要素を消したり作ったりするよりも
classを変更するだけにしてCSSで表示したり見えなくしたりするほうが
速いだろうってこと。

394 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 23:15:42.26 ID:fQG3bb7RM.net]
jQuery。それは、

・遅い

・重い

・アンセキュア

なDOM操作ライブラリ。

395 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 23:16:58.62 ID:Tr9ixmy70.net]
>>382
ソースコードざっと見たけど、evalが見当たらないんだけど何行目にある?
https://code.jquery.com/jquery-3.3.1.js

396 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 23:17:08.57 ID:NXuVhChr0.net]
jQueryを使うのって、速さ云々より一つのコードがどんな環境でも同じ様に動くって所なんじゃないの?

ブラウザの種類やバージョンでJavascriptの挙動の違いがあるから、それを吸収する為にjQueryを使うんじゃない?

397 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 23:17:55.89 ID:zC296ldL0.net]
>>381
はっきり言ってjQueryが遅いとは思わない
熟練した人が地道に管理すれば十分速い

それが手間じゃねぇの?ってのがフレームワークの意義

398 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 23:21:18.07 ID:Tr9ixmy70.net]
>>384
jQueryってDOM APIを使ってるだけなのに
なんでアンセキュアになるの?

399 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 23:21:36.55 ID:ca0WBun30.net]
>>383
そうか、なんかすまん。

>仮想DOMは最終的にDOM操作をするから遅くなるが、
>jQueryではCSSによって見た目を切り替えるだけだから速いってこと

この部分読んで仮想DOMは遅くてjQueryは速いのか!って解釈しちゃったんだが仮想DOMに比べて速いだけでjQueryも速くないんだな。

400 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 23:25:42.00 ID:ca0WBun30.net]
>>387

>>367の結果だけ見ると遅すぎ(10回やると1秒!?)って思っちゃったんだが……

webは基本的には静的コンテンツだから気にならない世界なのかな。

とりあえず俺にはこのスレの会話を理解する能力が足りないっぽい。

401 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 23:28:54.96 ID:ca0WBun30.net]
まあ1つの処理に4ミリ秒って時点で衝撃的な遅さだしweb開発の世界はそんなもんなのか。



402 名前:デフォルトの名無しさん mailto:sage [2019/02/15(金) 23:31:51.99 ID:I8iEDAq80.net]
jQuery使うと100ミリ秒になるけどなw

403 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 00:34:30.68 ID:oKtXVOCjd.net]
vue.jsが
やたらめってら、もてハヤサれる昨今だけど
ぶっちゃ毛v-forが仕様としてオワッテると思うわ。
それとuidの生成パターンをC言語なら「ポインターが理解でないワケ」や
「ポインター徹底攻略」、、、JAVAならデザイパターン本みたいな
分厚い本で説明しなきゃ
いけないのに、それを全くやってないよな。
俺が考えるvue.jsが広まらないワケだよ。コンポーネントをどうユーザーが
受けとるべきかも、簡単な再帰などを使ってイラストレートしなきゃいけないのに
これも全くやってない。細々としたシステムは売り込んでるけど
vueの長所が全くされてない

404 名前:デフォルトの名無しさん [2019/02/16(土) 00:34:57.77 ID:fcnsYPNW0.net]
早い遅いじゃなくて開発効率の話だろ。domを直接指定して操作云々はもう止める、最小限にするて事。今後確実にそうなるのは皆分かってると思うが。

405 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 00:44:30.53 ID:HVh9Xg4td.net]
実行速度の話をしてる人たちに、いきなり開発効率の話をしだすのは草。なんの関係もないじゃんw

406 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 01:34:13.23 ID:SPTGalft0.net]
実行速度については、DOM要素を作成したり削除したりするよりも
CSSで表示したり隠したりしたほうが速いんじゃないかってだけのこと
それをやるにはVue/React/AngularよりもjQueryの方が楽ってこと

DOM操作がネイティブよりも速いなんて話はしてない。
CSSによる表示切り替えの方が速いって話をしてる。

そのCSSによる表示切り替えを楽にやる(開発効率が良い)のは
jQueryってだけのこと

407 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 01:47:37.10 ID:P5gjDjW+0.net]
DOM要素の追加削除とCSSの表示切り替えって役割が違わね?

408 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 01:49:25.92 ID:P5gjDjW+0.net]
CSSの表示切り替えは既に存在する要素に対して行うのに対してDOM要素の追加は動的に要素を追加するためにやるもんだと思うんだが。
この2つは比べるべきものなの?

409 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 01:59:26.44 ID:P5gjDjW+0.net]
スレタイの3つとかはSPAのような高性能なブラウザアプリを作成するものでしょ。例えばofficeとかslackとか。CSSの切り替えだけでいけるの?

410 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 02:11:14.67 ID:yZTjSyit0.net]
相手せんでええよキチガイだから。

411 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 04:00:16.99 ID:H80q57B70.net]
>>354
難しいというより学習コストが高い=最低限として覚えなきゃいけない事が多い
その反面必要な機能をサードパーティーから探してくる必要性がかなり低い



412 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 04:05:31.34 ID:H80q57B70.net]
>>379
普通にUIとして使う分にはそんなに気になるほどの事でもないけど
Canvasに連続的に描画とか行う場合はダイレクトにその遅さが目立つってくらいかな

413 名前:デフォルトの名無しさん [2019/02/16(土) 06:51:31.57 ID:fcnsYPNW0.net]
早いからじゃなくて便利だからjQueryを使うんだろ。なんで今更速度の話になってんの?

414 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 07:10:24.28 ID:H80q57B70.net]
最近ブラウザでWebRTCとかやるのもわりとあるケースだし遅いってのは無視できない問題でもあるよ

415 名前:デフォルトの名無しさん [2019/02/16(土) 07:20:20.26 ID:Ka3Sv0NV0.net]
>>403
jQueryは仮想DOM操作より早いと信者が言い出したから。

416 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 08:04:12.49 ID:SPTGalft0.net]
>>405
デマ乙

>>330を見れば分かるが仮想DOMよりも
classの変更で表示・非表示の切り替えをしたほうが速いって言ってる

417 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 08:58:01.91 ID:P5gjDjW+0.net]
もう一度聞くけど、classの変更でできることって限られてるでしょ?見た目の操作だけかな?
それが仮想DOMより速くてもどうしようもなくないか?役割が違うんだから。
なんか自分の間違いを認めたくないから無理やり話をすり替えようとしてるようにしか見えないんだが…

418 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 09:01:46.50 ID:mve ]
[ここ壊れてます]

419 名前:ZudXk0.net mailto: >>406
仮想DOMだって属性の値にしか差分がないことがわかったらそれだけ反映するようにはできるだろ。
これなんかわかりやすい。
https://kuroeveryday.blogspot.com/2018/11/how-to-create-virtual-dom-framework.html
[]
[ここ壊れてます]

420 名前:デフォルトの名無しさん [2019/02/16(土) 11:06:01.11 ID:fcnsYPNW0.net]
スレタイから逸脱しすぎてると思ったらjQueryと比較してる奴がいるのか。。もう何年

421 名前:も前に通り過ぎた話題だぞ。前見ようぜ。 []
[ここ壊れてます]



422 名前:デフォルトの名無しさん [2019/02/16(土) 11:13:52.65 ID:jR4qOrfsr.net]
ReactとかVueすら使えない超低レベルなクソジジイが騒いでるだけだから

423 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 11:14:50.85 ID:SPTGalft0.net]
>>407
> もう一度聞くけど、classの変更でできることって限られてるでしょ?見た目の操作だけかな?

要素の追加削除の代わりに見た目を変更するっていうのは、
単に要素を追加削除するコストだけではなく
イベントハンドラの設定のコストも減らせる

もともとjQueryはデリゲートが簡単にできるから、要素が増えたり減ったりしても
イベントハンドラは最初に一回だけ設定すれば良いんだが、
それを使わなくても例えば要素のonclick属性とかに直接やる場合でも
要素が追加したときに新たにイベントハンドラを設定しなくてすむ

仮想DOMではDOM操作を最適化して必要な場合だけ実行するが
速度の話をするならそもそもDOM操作自体を減らそうという発想にしたほうが良いと思う
要素ごとにイベントハンドラを設定するよりも、
要素の親に一つだけイベントハンドラ設定したほうがいいわけだし

424 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 11:35:47.92 ID:H80q57B70.net]
こっちでやったら?

Webフロントエンドで脱jQueryを目指すスレ
https://mevius.5ch.net/test/read.cgi/tech/1547896353/

425 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 11:38:28.40 ID:auHH3gBua.net]
使える使えないと使う使わないは別のこと
jQueryが殆どの場合最適解でSPAが勝てる領域はかなり狭いという事実を見失っちゃいかん

426 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 11:41:22.10 ID:SPTGalft0.net]
SPA、シングルページアプリケーションであって
シングルページウェブサイトじゃないからな

アプリケーションの時点で、ならネイティブアプリにしろよって
言われる時代

427 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 11:52:58.50 ID:R2hmaITu0.net]
勝手にそんな時代を作るな

428 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 11:56:31.80 ID:H80q57B70.net]
まぁ正直フレームワークは知らなくてもいいかも知れんがNodeを知らないと確実に困る時代にはなってくると思う

429 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 12:00:35.69 ID:auHH3gBua.net]
ネイティヴアプリは環境差異とデプロイメントがめんどくさいんだよね
dockerがGUIをサポートしてくれたら乗り気になるかもしれんがな

430 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 12:09:05.56 ID:SPTGalft0.net]
>>417
それはウェブでも変わらん。カメラ使おうと思ったら
ブラウザごとに使うAPIは違うし、端末ごとに対応してる
解像度も違うし散々だったぞ

dockerってLinuxの話してる? それならSnapsやFlatpakなどが登場してる。
Dockerはあくまで開発者向けで自分で作ったアプリをデプロイするときに使うもの。

一般ユーザー向けにアプリを配布するならSnapsなどを使う
GUI対応でディストリ非依存のパッケージ管理システム

431 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 12:16:07.61 ID:H80q57B70.net]
>>417
ネイティブの面倒なところはそこよりも
OSの差異で動かなくなったりするところだな特にiOSとか



432 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 12:19:58.87 ID:auHH3gBua.net]
>>418
Snapsってdockerのように依存関係や実行時の環境もカプセル化してくれんの?

433 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 12:34:18.62 ID:msvpDp2N0.net]
>>419
その差異をブラウザは吸収できないんだよね
だからみんなネイティブアプリにする

434 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 12:41:53.08 ID:R2hmaITu0.net]
みんなって誰だよ
勝手に決めるな

435 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 12:43:59.75 ID:P5gjDjW+0.net]
>>411
具体例をお伝えした方がいいのだろうか?
例えばサーバーのDBに対して検索かけてとってきた要素を並べてコンテンツだすとかclassだけでなんとかなるの?
そもそも要素を出したし消したりでなんとかなるような簡単なものにReactとか使わないものじゃね?

436 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 12:47:43.95 ID:P5gjDjW+0.net]
サービス提供する側としてはネイティブよりSPAの方がよいケースはままあるでしょ。
例えばインストーラーが不要、そもそも技術者がいない、今までの資産をそのまま流用できる、とかとか。
ハードを

437 名前:限定しないソフトウェアの提供形態って殆どの場合は都合できまるもんだと思う。 []
[ここ壊れてます]

438 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 12:50:25.75 ID:0+4MW20ta.net]
ネイティブはストアにリリースすんのがイチイチめんどくさい

439 名前:デフォルトの名無しさん [2019/02/16(土) 13:05:39.77 ID:jR4qOrfsr.net]
jqueryしか使えない無能の自己紹介はいらん
消えろカスジジイ

440 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 13:13:23.51 ID:dSQ6SPUO0.net]
Angular習得した後にjQueryで書かれたコード見たら吐き気がしてくるわ。

「こんなコードわざわざ書かなくても取ってきたデータバインディングすりゃ良いのに」って思う箇所が多々ある…。

まぁ、古いブラウザでも動くようにしなきゃならないからjQuery使ってんだけどね。

441 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 13:19:34.25 ID:H80q57B70.net]
>>427
Windows7のサポートが切れればなぁ



442 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 14:02:04.13 ID:msvpDp2N0.net]
>>427
お前が書くコードがクソなだけw

443 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 16:10:27.79 ID:dSQ6SPUO0.net]
>>428
サポート切れてても「壊れてないから」とか「投資できる余裕がない」とか「基幹システムが新しいOSに対応していないから」って理由で
古いOSと機械を使い続ける客もいるんだよなぁ。あんまりよろしくは無いんだけど。

>>429
jQueryベースでデータバインディングみたいなコード書けるん?
書けるなら書き方教えてくれや。こちとら嫌々でもjQueryとは付き合っていかなきゃなんねーんだよ。

444 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 16:16:01.06 ID:sYjKK7tj0.net]
イベント使え

445 名前:デフォルトの名無しさん [2019/02/16(土) 17:30:33.50 ID:fcnsYPNW0.net]
>>430
使ったことないが、backboneやKnockoutやらのIE7でも動くライブラリ使ってみれば?ただ今更勉強する意義を考えると辛いなあ。。

446 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 18:08:11.34 ID:auHH3gBua.net]
旧ブラウザサポートはお高くなりますよ?
これでほとんどの客が黙る

447 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 19:11:18.01 ID:LE6s3aZE0.net]
やっすい案件ほどクソ要求してきやがる。

448 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 19:38:01.61 ID:H80q57B70.net]
>>430
少なくともイントラではなグローバルサイトではサポート切れたOSの対応は打ち切っていいだろ

449 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 19:40:47.09 ID:msvpDp2N0.net]
Androidだとサポート切れといっていいOSはどれ?

450 名前:デフォルトの名無しさん [2019/02/16(土) 20:08:25.91 ID:4RfOpqIfr.net]
>>433
最新バージョンのreact使ってるけどIE11で問題なく動作しとる

451 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 21:03:12.87 ID:H80q57B70.net]
正直互換性の点ではIE11よりもEdgeの方が癖があるんだよね
まぁEdgeもChromiumベースになる計画があるらしいしEdgeのChromium化とWindows7のサポート打ち切りが来ればパブリックサイトは随分シンプルになるんじゃないかと思う



452 名前:デフォルトの名無しさん mailto:sage [2019/02/16(土) 22:09:54.11 ID:gLKxbWo30.net]
chromiumになってもなんかしらイレギュラーがありそう
信用できない

453 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 08:20:58.26 ID:O/E0SKNM0.net]
フロントエンドなんてそんなもんだとしか言いようがない。

454 名前:デフォルトの名無しさん [2019/02/17(日) 09:26:47.38 ID:x12h9xDW0.net]
逆に言えば進化の余地ありありと言うこと。でもフレームワーク競争もひと段落して数年は安定じゃないかな。ブラウザもChromiumとSafariに収束されつつあるし。あとはiOS safariにpush通知実装されればなあ。

455 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 09:30:51.46 ID:Y22Zw0Bq0.net]
プログラマには、Apple機がなくなった方が楽になると思われている。
IEが消滅して言ったのと同じ状況がApple機に対しても起きつつあると思う。
iPhoneは売れなくなった。

456 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 09:44:50.06 ID:E0TCVuWu0.net]
フロントエンドは端末とブラウザの進化の影響をもろに受けるからねぇ…。

クロスプラットフォームの分野でも、SPAが技術的に枯れる前にどんどん新しいフレームワーク出て来るからな。最近だとFlutterとか。

SPAだけでも選択肢多いのに、xamarinだのcordovaだのFlutterだのと。
こっちとしては「クロスプラットフォームアプリ開発するなら結局どれ選べばいいんだよ」的な状態だわ。

457 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 09:48:46.68 ID:Y22Zw0Bq0.net]
結局、大きい組織が作ったものを使っていくようになるんだろう。

458 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 09:49:49.70 ID:eXZp7YPc0.net]
Apple機さえ無視すれば、プログラミングが色々便利になる。

459 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 10:25:00.47 ID:vi4O111wa.net]
>>443
どれでもいい
フロントは使い捨て
簡単に乗り換えできるようにビジネスロジックと疎結合に作る
そこだけ死守すればなにを使ってもいい

460 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 10:44:59.94 ID:1mijhG+I0.net]
cordova使うならIonicでいいんじゃない?
最近はAngularだけじゃなくVueにも対応したらしいし
そういやReactNativeにもVue版出てたな

461 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 15:29:11.35 ID:KFkN1Yft0.net]
vueはreactパクってばっかだな。
storybookもパクってなかったか?
nuxtもnextのパクりだろ?
さすが中国人プロジェクトw



462 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 16:09:57.46 ID:E0TCVuWu0.net]
別にパクっていてもそれで良くなるなら別に何でもいいけど。ただvueは元Google社員とはいえ中国人でしかも個人開発だろあれ。

いつ開発が止まるかもわからない、信用のない国の人間が作ったもんを率先して基礎にしたがる奴なんているのかな。

vue使いたがる奴なんて、vueを使いたいから使うんじゃなく、技術力低いからvueしか選択肢が無いんじゃないかと。

463 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 16:17:22.57 ID:YF9uE98b0.net]
技術力低くても使えるなんてコスト低くて最高だな

464 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 18:12:29.77 ID:jxnSJIL40.net]
どうせWebComponentsが完成したら
またガラリと世界が変わるんだから
どれ使っても一緒

465 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 18:17:28.09 ID:1mijhG+I0.net]
>>451
過大評価しすぎ

466 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 19:04:36.50 ID:vi4O111wa.net]
何れにせよあっという間に時代遅れになることは確かだ

467 名前:デフォルトの名無しさん [2019/02/17(日) 19:11:48.12 ID:8CydzgAW0.net]
金融系取引先においてある、およそ10年前に作られた当時先端のActionScript製RIA業務システムを見るとふふってなる。

468 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 19:15:44.06 ID:jxnSJIL40.net]
10年前、2009年か。なら当時最先端のAngularJSを使っていればよかったのに

469 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 19:19:23.16 ID:jxnSJIL40.net]
Reactは2013年だから10年前には選べない
Vueも2014年だから無理
Backboneは2010年だからギリ間に合うか?
Knockoutも2010年だな

10年前の最先端は、すべからくオワコン
ReactもVueもあと5年程度の命だろ

470 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 19:27:54.46 ID:GfPZMs79M.net]
*すべからく

471 名前:デフォルトの名無しさん [2019/02/17(日) 19:39:34.68 ID:6yF6+Ynsr.net]
Reactオワコンだからこれからはjqueryオススメ



472 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 20:02:00.60 ID:4TiEHd4P0.net]
>>448-449
やっぱ、Aureliaだな

473 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 20:17:50.30 ID:1mijhG+I0.net]
>>459
この前のレスで気になってたから今ちょうどインストールしてた
何気にAngularの一番厚い本(アプリケーションプログラミング)で主要なフレームワークとして挙がってるのな

>>448
パクリから始まったのは確かだけど今やNuxtはSSRの為だけのものじゃなく
Vueベースのフルスタックフレームワークなんだよな

474 名前:デフォルトの名無しさん [2019/02/17(日) 20:40:36.87 ID:SrJ5Oa/9p.net]
Reactがオワコンって即ちjsがオワコンって事だと思うんだけどそれはないんじゃないか?

475 名前:デフォルトの名無しさん [2019/02/17(日) 21:28:50.33 ID:6yF6+Ynsr.net]
ReactがオワコンになってjsもオワコンになってjQueryだけが使われると思ってるクソジジイが一匹いるけど

476 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 21:36:36.53 ID:1mijhG+I0.net]
jQueryは別にいいんだけどWebpackは知らんとこの先ついて行けんくなると思うよホント
今やブラウザでなんでもできる時代やしなんでも作らないかんくなるから何も勉強しなくても余裕とは思わん方がいい

477 名前:デフォルトの名無しさん [2019/02/17(日) 22:05:35.95 ID:x12h9xDW0.net]
jQueryが長生きなのは認める。

478 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 22:23:23.44 ID:jxnSJIL40.net]
babel使うんだからwebpackぐらい使うだろ?

479 名前:デフォルトの名無しさん [2019/02/17(日) 22:57:23.05 ID:6yF6+Ynsr.net]
普通に使うよな

480 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 23:02:22.78 ID:1mijhG+I0.net]
もしかしてAureliaってCliでプロジェクト作っても碌にデモ画面も表示されない?

481 名前:デフォルトの名無しさん mailto:sage [2019/02/17(日) 23:57:17.64 ID:AOpTaf3U0.net]
単刀直入に質問。Vue.jsとReactを勉強するための書籍を探してる。今は
両方のチュートリアル見たりしながら写経しつつ、我流で勉強中。
●Vue.jsは技評のVue.js入門と基礎から学ぶシーアンドアールのVue.jsで迷ってる
●Reactはどれも評価高いものがなくて迷ってるが今は見送り?

ちなみにJSの知識だが、今までjavascriptは紫の山田本一通り通したことがあり、AngularJS1.5で簡単な
検索システム組んだことあるぐらい。いちおうjQueryも一通り触れてプログラムに
色々システムを手書きで組み込めるレベルはある。



482 名前:デフォルトの名無しさん [2019/02/18(月) 00:24:29.50 ID:ZveW3gOd0.net]
>>468
vueだけど、俺は「基礎から学ぶvue.js」買ったよ。技評の方は読んでない。公式webとその本で十分網羅されてると思う。

483 名前:デフォルトの名無しさん mailto:sage [2019/02/18(月) 00:32:34.18 ID:PvqzGaNZ0.net]
おお、サンクス。なら、そっちも買うか

484 名前:デフォルトの名無しさん mailto:sage [2019/02/18(月) 01:01:22.40 ID:qsq8EO4j0.net]
Nuxt.jsビギナーズガイド―Vue.js ベースのフレームワークによるシングルページアプリケーション開発、
花谷 拓磨、2018/10/17

基礎から学ぶ Vue.js、mio、2018/5/29

Node.js超入門、掌田津耶乃、2017

Electronではじめるアプリ開発
~JavaScript/HTML/CSSでデスクトップアプリを作ろう
野口 将人・倉見 洋輔、2017


入門 React ――コンポーネントベースのWebフロントエンド開発、2015

Reactビギナーズガイド ――コンポーネントベースのフロントエンド開発入門
Stoyan Stefanov, 2017
https://github.com/stoyan/reactbook


初めてのJavaScript 第3版 ――ES2015以降の最新ウェブ開発、オライリー、2017

JavaScript 第6版、2012、David Flanagan

485 名前:デフォルトの名無しさん mailto:sage [2019/02/18(月) 01:12:07.61 ID:TCe7B/Jv0.net]
↓Reduxに関しては一番詳しく書いてあるけどサンプルプログラムの入手先が本誌に書いてない・やっぱちょい古い
React入門 React・Reduxの導入からサーバサイドレンダリングによるUXの向上まで

↓構成は悪くないしサンプルプログラムがしっかりしてる点はいいがバージョンが古いのとRedux

486 名前:ェ載ってない
いまどきのJSプログラマーのための Node.jsとReactアプリケーション開発テクニック

↓これはやめといたほうがいい
React開発 現場の教科書

とりあえず一番上がいいかな
[]
[ここ壊れてます]

487 名前:デフォルトの名無しさん mailto:sage [2019/02/18(月) 01:14:46.55 ID:TCe7B/Jv0.net]
>>471
Node.js超入門は全然役に立たんし買う必要ないと思う

てか全般的に2017年以前の書籍勧めちゃいかんだろ

488 名前:デフォルトの名無しさん mailto:sage [2019/02/18(月) 01:17:18.50 ID:TCe7B/Jv0.net]
>>470
基礎からは著者のサポートサイトも併せて見るとやりやすい

489 名前:デフォルトの名無しさん [2019/02/18(月) 08:10:58.01 ID:3Fbf7ypjr.net]
フロントは更新や淘汰が速すぎるから書籍だと情報が古くなるのは仕方ない

490 名前:デフォルトの名無しさん [2019/02/18(月) 08:44:20.46 ID:WLtbirMY0.net]
SproutCoreとかもう名前が挙げられることもないからな。
なぜかmeteorは今更挙げられることがあるが。

491 名前:デフォルトの名無しさん mailto:sage [2019/02/18(月) 22:14:52.84 ID:WoGhDUeR0.net]
逆にフレームワークを本買ってまで勉強する必要あんのかな。

公式のチュートリアル一通りやればどう書けばいいかは大体想像付くし、
あとは自分でお題決めて、わからん事は公式ドキュメントやstackoverflowとにらめっこしてれば、大抵の物は作れるだろ。



492 名前:デフォルトの名無しさん mailto:sage [2019/02/18(月) 22:20:39.28 ID:788tab2z0.net]
>>477
そう。英語勉強したほうがマシ。マジで。

493 名前:デフォルトの名無しさん mailto:sage [2019/02/18(月) 22:38:28.05 ID:dNYL//qB0.net]
フレームワーク本を1週間で読めるとして、
英語を勉強するのとどちらが速いと思いますか?

494 名前:デフォルトの名無しさん [2019/02/18(月) 22:44:57.01 ID:3Fbf7ypjr.net]
英語は10年やっても無理だがフレームワークなら1日で覚えられる

495 名前:デフォルトの名無しさん mailto:sage [2019/02/18(月) 22:53:31.84 ID:788tab2z0.net]
ウンコ訳で周回遅れの邦訳に付き合わなくてよくなるぞ。
英語なら電子版無料公開してるような書籍でも日本では印刷してボッタくっている。

496 名前:デフォルトの名無しさん mailto:sage [2019/02/18(月) 22:56:21.87 ID:7ubWqY/W0.net]
理解できなけりゃ金払ってでも理解すりゃ良いんだよ。

497 名前:デフォルトの名無しさん mailto:sage [2019/02/18(月) 23:01:29.12 ID:PvqzGaNZ0.net]
理系じゃないんで抽象的な表現が苦手なんだよな。なので、ひとつ何か
コンポーネント指向がわかる手ほどき書がほしかったわけで

今、基礎から学ぶ読んでるけど、デザイナー向けに書かれてるだけあって
わかりやすくていい

>>478
むしろ、英語は読める口(ニュースサイトの記事や英語版Wikipediaの記事とかは
だいたいわかる)なんだけどね

498 名前:デフォルトの名無しさん mailto:sage [2019/02/18(月) 23:10:58.27 ID:6vaPKOJl0.net]
話題になり始めたらとりあえずgithub見に行くな
必要なものは大抵その中か、そこからのリンクにある

499 名前:デフォルトの名無しさん mailto:sage [2019/02/18(月) 23:17:17.71 ID:2Q4jbH6wM.net]
>>483
はぁ、コンポーネント指向を…
Atomic Design ~堅牢で使いやすいUIを効率良く設計する くらいしか知らないな。この本で使ってたのはReact。

500 名前:デフォルトの名無しさん mailto:sage [2019/02/19(火) 01:42:29.59 ID:qmiILQOL0.net]
>>468
Vue本は両方買った
ある程度動けばいい実践派は猫本
理論から入りたい理屈派は技評本ってとこ
俺は技評の方が性にあった

501 名前:デフォルトの名無しさん [2019/02/19(火) 02:51:16.21 ID:QF2NWP5xr.net]
China開発者が作ったvueと、Facebookが作ったReactは将来性も含めてどっちがオススメ?



502 名前:デフォルトの名無しさん mailto:sage [2019/02/19(火) 09:00:05.79 ID:8ne5Wfny0.net]
vueはちょいと手を広げすぎな気はする。

503 名前:デフォルトの名無しさん mailto:sage [2019/02/19(火) 09:01:38.38 ID:494Vj+cBa.net]
もしかしてAngularって本当に淘汰されてる?

504 名前:デフォルトの名無しさん [2019/02/19(火) 09:14:50.98 ID:jwE8w3hJ0.net]
Angularのシェアが落ちてると言うより、angular採用するまでも無いサイトが他を使用してるだけだろう。vueなんかは小さく始められるから入力フォームにだけ利用もできるしjQueryと共存もできるしね。俺もフォームから始めたな。随分スッキリした。

505 名前:デフォルトの名無しさん mailto:sage [2019/02/19(火) 13:47:21.51 ID:YsDFh+D0d.net]
vueの良さが今日

ようやく判ったな。コンポーネントという単位で

分けることにバックエンドとフロントエンドとミックスできて

しかもjQueryまで使える。よぼどvueを

知ろうとしないとこの境地には辿りつけないけど

506 名前:デフォルトの名無しさん [2019/02/19(火) 15:11:28.48 ID:QF2NWP5xr.net]
React終わったな
もはやvueの勢いにはどうあがいても勝てない

507 名前:デフォルトの名無しさん mailto:sage [2019/02/19(火) 15:40:44.07 ID:SwtNBaDUM.net]
※スターの半分以上は中国人です

508 名前:デフォルトの名無しさん mailto:sage [2019/02/19(火) 15:46:05.13 ID:g2OPfq0o0.net]
中国人がどんどんcomponent作ってくれるから楽できる

509 名前:デフォルトの名無しさん [2019/02/19(火) 16:37:04.20 ID:wezyZP0ya.net]
Alibaba vs Facebook

510 名前:デフォルトの名無しさん mailto:sage [2019/02/19(火) 18:19:10.23 ID:QwJoWSeKd.net]
俺は中国人の勢いにかけるぜ

511 名前:デフォルトの名無しさん [2019/02/19(火) 19:06:32.74 ID:sMCHYB6e0.net]
>>495
アリババの勝ちだな。



512 名前:デフォルトの名無しさん mailto:sage [2019/02/19(火) 19:10:40.62 ID:Qqrvi8yYa.net]
Aurelia試してみたけどcliでプロジェクト作ってもhttp-serverインストールした上必要なファイル手動で追加せんとデモ画面もろくに表示されんとかこりゃ流行らんの当たり前やん

513 名前:デフォルトの名無しさん [2019/02/19(火) 21:08:49.53 ID:sMCHYB6e0.net]
中間とってビュアクトにしたらいいのでは。

514 名前:デフォルトの名無しさん mailto:sage [2019/02/19(火) 22:32:39.35 ID:E9aKyrSX0.net]
>>490
AngularはAngularJSでやらかしたのがデカイんじゃない?

一生懸命AngularJS勉強して「さあこれから本格的に開発していこう!」って矢先に互換性のないAngular 2発表、
AngularJSはオワコン化じゃ、次何が出ようと「誰がお前らのフレームワークの習得に投資するんだよ」ってなるわ。

515 名前:デフォルトの名無しさん mailto:sage [2019/02/20(水) 01:13:44.34 ID:1A7mnZWV0.net]
>>496
わからない時は英語じゃなくて
中国語で検索しないといけなくなるのかな?

516 名前:デフォルトの名無しさん mailto:sage [2019/02/20(水) 02:18:36.91 ID:23FEoZns0.net]
>>500
ほんまそれだわ、3年前Angular2で別物になったと思えば、もう6とかいってるし…
数年でもう5まで行ったLaravelも大概じゃないがそれよりひどい

517 名前:デフォルトの名無しさん mailto:sage [2019/02/20(水) 02:27:40.92 ID:23FEoZns0.net]
あと、フルスタックじゃないAngularJSのような気軽さがないとね…。
ReactとRedux、Vueとnuxtみたいな関係が必要だ。門戸は広く、奥行きは深くすべき
ReactはVueに影響されたか、だいぶ記述はわかりやすくなったから、前よりは
とっつきやすくなったと思う

518 名前:デフォルトの名無しさん mailto:sage [2019/02/20(水) 07:17:02.34 ID:SpCnH/g70.net]
おいreactに来たhooks apiめっちゃいいやんけ。クラスなんていらんかったんや!

519 名前:デフォルトの名無しさん [2019/02/20(水) 07:59:55.95 ID:zvYiCp4Or.net]
クラスでええやん

520 名前:デフォルトの名無しさん mailto:sage [2019/02/20(水) 13:47:47.60 ID:n2p9Q1hFd.net]
>>502
7やろ

521 名前:デフォルトの名無しさん [2019/02/20(水) 14:20:15.26 ID:B6NZYAeG0.net]
>>503
> ReactとRedux、Vueとnuxtみたいな関係
言いたい事は分かるが一応訂正。reactとnext.jsに対応するのはvueとnuxt.js。ステート保持はreactがredux、 vueがvuex。



522 名前:デフォルトの名無しさん mailto:sage [2019/02/20(水) 19:48:50.57 ID:CEoya/3z0.net]
HooksってReduxとの相性どうなの

523 名前:デフォルトの名無しさん mailto:sage [2019/02/20(水) 20:13:36.83 ID:SGVVPurF0.net]
Reduxが要らなくなるのがHooksなんじゃないの?

524 名前:デフォルトの名無しさん mailto:sage [2019/02/20(水) 20:17:31.57 ID:hK+DOQwsM.net]
context apiと組み合わせれば。
デカイアプリはまだまだreduxじゃないかな?
しかし確実にstate管理の枠組みにも変革を促すであろう。
post reduxにどんなのが出てくるのか楽しみ。

525 名前:デフォルトの名無しさん mailto:sage [2019/02/20(水) 20:24:09.86 ID:SGVVPurF0.net]
ということで、またオワコンが一つ増えますね。Reduxはオワコン。
ほれ、また次だぞ。チキンレースは終わってないぞ!

526 名前:デフォルトの名無しさん mailto:sage [2019/02/20(水) 20:36:00.91 ID:hK+DOQwsM.net]
まあreduxはめんどくさすぎるからな。
小規模アプリでも必須みたいな風潮が異常だった。

527 名前:デフォルトの名無しさん mailto:sage [2019/02/20(水) 20:47:56.19 ID:IrLSPTwba.net]
>>507
現状nuxtは大きくなりすぎたからnextと比較するのは不毛

528 名前:デフォルトの名無しさん [2019/02/20(水) 22:17:55.07 ID:zvYiCp4Or.net]
まじか
いまReduxつこてるのに

529 名前:デフォルトの名無しさん [2019/02/21(木) 16:37:13.46 ID:QuFAf9ehr.net]
reactでブラウザの戻るに一つしか履歴が登録されない
意味不明

530 名前:デフォルトの名無しさん mailto:sage [2019/02/21(木) 17:02:23.80 ID:f8G92//U0.net]
ヒステリーAPIを使え

531 名前:デフォルトの名無しさん [2019/02/21(木) 17:08:39.36 ID:QuFAf9ehr.net]
ヒストリー使ってるんだけど

・createBrowserHistoryライブラリ(IE対応のため)
・redux
・react-redux
・connected-react-router

これら使ってなんとか構築してるんだが一つしか履歴残らん

てか解説サイトがほとんどない…



532 名前:デフォルトの名無しさん mailto:sage [2019/02/21(木) 18:31:50.74 ID:++Eueb0Rd.net]
>>516
ヒステリーAPIは草

533 名前:デフォルトの名無しさん mailto:sage [2019/02/21(木) 20:33:12.61 ID:P4oXdJL20.net]
>>515
これのexampleの構成をよく見た方がいい
https://github.com/supasate/connected-react-router

534 名前:デフォルトの名無しさん mailto:sage [2019/02/22(金) 03:02:07.44 ID:y9srh0J/p.net]
>>516
まあまあ
落ち着けよw

535 名前:デフォルトの名無しさん [2019/02/22(金) 12:59:46.42 ID:CkzBv4Her.net]
とりあえずhistory直す
なんかわからんがLink使うとhistoryの履歴が3つ登録される
SPAはここがめっちゃめんどくせぇ
なんでブラウザの操作までjsで組まなきゃいけないんだか

536 名前:デフォルトの名無しさん mailto:sage [2019/02/22(金) 13:22:14.53 ID:nIPzShw8a.net]
てかオッペケってReactマスターやなかったんかい

537 名前:デフォルトの名無しさん mailto:sage [2019/02/22(金) 13:32:15.20 ID:9C0ENtC1M.net]
別にSPAにせず普通にページ遷移してもいいんだがな。誰もやらないだけで。したがってサンプルも転がってないw

538 名前:デフォルトの名無しさん [2019/02/22(金) 14:06:18.79 ID:CkzBv4Her.net]
>>522
すまん、App.jsのコンストラクタ内でthis.props.history.listen使ってしまっておった
これやめたら直りました
dispatchで初期化するのにつかってたのが間違い

539 名前:デフォルトの名無しさん mailto:sage [2019/02/22(金) 21:03:06.66 ID:wU2NQYd9a.net]
>>519
サンプルここにあんじゃん

540 名前:デフォルトの名無しさん mailto:sage [2019/02/22(金) 21:06:35.12 ID:Q1wbj0yj0.net]
Reactはホント人によって使うフレームワークやライブラリが全然違うな。
ちょっと興味あったけど、これじゃどっから始めたらいいか全然分からん。

てか、ReduxだのNextだの、第三者が作ってるであろうフレームワークの開発なりサポートなりが終わってしまったら、代わりはどうすんだ?

541 名前:デフォルトの名無しさん mailto:sage [2019/02/22(金) 21:14:42.59 ID:QkaGMiSY0.net]
極力公式か大きめの企業がメンテしてるものだけで作る
コミッタが少ないものは使わない
ライブラリへの依存が散らばらないよう自コードで軽くラップして使う



542 名前:デフォルトの名無しさん mailto:sage [2019/02/22(金) 21:19:43.61 ID:wU2NQYd9a.net]
まぁ本当にSSR必要かってのもあるけどね
最近自分の関わってる案件だと会員サイトの認証済み領域の情報は一切検索エンジンにヒットさせる必要ないからSSRとは無縁なんだよな

543 名前:デフォルトの名無しさん mailto:sage [2019/02/22(金) 21:24:17.86 ID:LKaW/yz70.net]
スペシャルスーパーレア?

544 名前:デフォルトの名無しさん mailto:sage [2019/02/23(土) 00:29:55.26 ID:tE6+E9hM0.net]
>>526
大丈夫。その前にReactが終わる。VueもAngularも
あと数年後は今存在してないフレームワークが使われてるよw

545 名前:デフォルトの名無しさん mailto:sage [2019/02/23(土) 07:14:02.54 ID:6swyBY50a.net]
数年後も残ってるのはjQueryだけ
MVC+jQが正解なんだよ

546 名前:デフォルトの名無しさん [2019/02/23(土) 09:37:08.18 ID:2sBO9l/X0.net]
いやreact vue angularについては長生きすると思う。ここ数年は本当酷かったフレームワーク戦争も落ち着いたしあと5年は使えるんじゃないか?ようやく腰を据えて安心して学べる状態になった。

547 名前:デフォルトの名無しさん mailto:sage [2019/02/23(土) 10:08:06.99 ID:tE6+E9hM0.net]
あとたった5年(笑)

548 名前:デフォルトの名無しさん mailto:sage [2019/02/23(土) 10:16:15.94 ID:tE6+E9hM0.net]
お前ら、RADツールって知ってるか?
ウェブの世界じゃあまり知られてないかもしれないが
デスクトプアプリの世界じゃ20年以上前から存在してるものだよ
VBとか有名だな

で、reactなどは近い将来RADツールに置き換わる。
RADはツールであってフレームワークではないから
正確に言うとRADツールを作りやすいフレームワークになるということ

コンポーネントは作ってパーツとして使える。
使いやすいコンポーネントが最初から揃っている。
GUIでマウスで操作するだけで簡単にコンポーネントが配置できる
まあここまではUIエディタ(HTMLエディタ、JSXエディタ)と
変わらんわけだがここからがJavaScript

コンポーネントを選ぶんで書きたいイベントを選ぶとイベントハンドラが生成される
自分で紐づけとかしなくて良いんだよ。JSXとか書かなくていい。
イベントハンドラ名もデフォルトで自動生成、プログラマはイベントの中身を書くだけ
データのバインドとかもRADツールで紐付けるべきものの名前を書くだけ

20年前のVBはすでにこういった世界だったんだよ?

549 名前:デフォルトの名無しさん mailto:sage [2019/02/23(土) 10:34:55.14 ID:6swyBY50a.net]
だが滅んだ

550 名前:デフォルトの名無しさん mailto:sage [2019/02/23(土) 10:55:53.84 ID:awIWFh910.net]
マウス1つでレスポンシブデザインまで対応出来るなんて
夢みたいなツールじゃん

551 名前:デフォルトの名無しさん mailto:sage [2019/02/23(土) 11:17:14.46 ID:tE6+E9hM0.net]
レスポンシブはブレークポイントを複数定義して
デフォルトからの差分みたいな感じでデザインするんだろうね



552 名前:デフォルトの名無しさん [2019/02/23(土) 11:17:41.85 ID:XpMOEioH0.net]
選択肢の一つをあたかも統合されるかのような詭弁はNG。
ポトペタASP.NETが密結合過ぎてわざわざOSS界隈に歩み寄った歴史を思い出せ。

553 名前:デフォルトの名無しさん mailto:sage [2019/02/23(土) 11:25:13.71 ID:6swyBY50a.net]
技術がなく判断できない企業はノンプログラミングという言葉に騙されやすいのだろうね

554 名前:デフォルトの名無しさん mailto:sage [2019/02/23(土) 11:32:23.19 ID:RWE+nJx90.net]
>>539
WIXはそんなに悪くないが一般的には酷いの多いよね

555 名前:デフォルトの名無しさん mailto:sage [2019/02/23(土) 12:15:44.69 ID:tE6+E9hM0.net]
>>539
ノンプログラミングはだめだろうね。
今のRADはGUIのエディタで作ってもいいし、
コードで書いたとしてもGUIに反映されるようになってる

556 名前:デフォルトの名無しさん mailto:sage [2019/02/23(土) 12:23:17.31 ID:n0LspLEFd.net]
>>538
Web Formsね

557 名前:デフォルトの名無しさん mailto:sage [2019/02/23(土) 12:37:28.79 ID:K/uRyWeBM.net]
WebFormは一瞬でページ作れるから
ものによっては便利だが

558 名前:デフォルトの名無しさん mailto:sage [2019/02/23(土) 12:41:54.25 ID:6swyBY50a.net]
単純なページはスキャフォールディングでええやんけ

559 名前:デフォルトの名無しさん mailto:sage [2019/02/23(土) 12:45:12.12 ID:tE6+E9hM0.net]
スキャフォールディングはページを作るものではなくて
ベージの一番最初のコードを生成するだけです。
その後に生成したコードを修正して作っていかなければいけません。

560 名前:デフォルトの名無しさん mailto:sage [2019/02/23(土) 12:52:56.11 ID:6swyBY50a.net]
修正すればええやんけ
ポトペタより簡単でソースも綺麗やで
ポトペタなんてマウス操作とアイコン探しの悪魔的苦行の繰り返しやないか
あれが楽とかマゾでもよう言わんで

561 名前:デフォルトの名無しさん mailto:sage [2019/02/23(土) 13:01:24.38 ID:K/uRyWeBM.net]
いやちゃんとしたい時はMVCなんだが
WebFormの存在理由もそれなりにある



562 名前:デフォルトの名無しさん mailto:sage [2019/02/23(土) 13:09:09.75 ID:K/uRyWeBM.net]
さすがにVueとかにはくっつけられないから
スレ違いだったな
RazorPagesはくっつくかな

563 名前:デフォルトの名無しさん mailto:sage [2019/02/23(土) 21:37:53.78 ID:QCtZNWil0.net]
>>538
MVCやSignalRも知らないおバカさん

564 名前:デフォルトの名無しさん [2019/02/24(日) 02:35:29.23 ID:7mFkjhD10.net]
>>549
RADの話が出たからWebFormsみたいなクソが消えた歴史を考えろっつってんのに、何がSingnalRだよ。文脈読め。

565 名前:デフォルトの名無しさん mailto:sage [2019/02/24(日) 02:58:24.82 ID:O4f1RypY0.net]
>>550
ASP.NET=Web formsっていう発想自体が頭おかしいんだよ

566 名前:デフォルトの名無しさん mailto:sage [2019/02/24(日) 03:19:47.26 ID:wTcw/8fo0.net]
お、お、お、おちけつよ!

567 名前:デフォルトの名無しさん mailto:sage [2019/02/27(水) 15:11:35.98 ID:XUj+n7600.net]
Reactというかredux?見てて思うのは、
お前らネットワークプロトコルでも作ってるのかよって話

普通にメソッド実行すればいいのに、
パケットデータ作って、そのパケット解析して処理実行す

568 名前:
メソッド一つ実行すりゃ終わりなのに

関数型にしたいのかどうか知らんが、目的を履き違えてる。
バグを減らすために関数型にする。そのために複雑にしてバグを作りやすくしてどうする
関数型じゃなくていい、バグを減らすためにシンプルにしろよ
[]
[ここ壊れてます]

569 名前:デフォルトの名無しさん [2019/02/27(水) 15:24:17.37 ID:PVZtgHDGr.net]
>>553
しかしflux概念は世界的に認められてるから広く使われるわけで、キミの主張vs世界中の開発者の同意でキミが勝てるわけないよね
そのへんどうすんの?

570 名前:デフォルトの名無しさん mailto:sage [2019/02/27(水) 16:07:14.12 ID:XUj+n7600.net]
反論しないで、世界に広める方法を聞く
変なレスだなぁw

571 名前:デフォルトの名無しさん mailto:sage [2019/02/27(水) 16:34:28.95 ID:XUj+n7600.net]
ところでさ、

function foo() {
 return { hoge: 1, hage: 2 };
}

expect(foo()).toEqual({ hoge: 1, hage: 2 });

みたいな意味のないテスト書いてないよな?

固定の連想配列返す関数のテスト書いても意味ないぞ
二度手間なだけで、それを避けるためにどうせコピペするんだろうし



572 名前:デフォルトの名無しさん mailto:sage [2019/02/27(水) 17:20:11.35 ID:fbQufi7O0.net]
>>553
メソッド実行するって具体的にはどういう形?

dispatchの前処理と後処理を自分で追加したメソッドを
ストア(↓)に生やすようなのをイメージしたけど合ってる?
https://github.com/reduxjs/redux/blob/master/src/createStore.js

573 名前:デフォルトの名無しさん mailto:sage [2019/02/27(水) 17:45:18.46 ID:XUj+n7600.net]
>>557
ようするに、

Actionみたいな「処理の内容をパラメータ化したオブジェクト」を
いちいち作らせるのをやめてくれ、

Reducerみたいな、switchでActionのパラメータみて分岐して処理する
ようなおのをいちいち作らせるのやめてくれ

ってことだよ。

onclickにincrementメソッド書いたら、+1するincrementメソッドが呼ばれます。
でいいじゃねーか。直感的だろ?それで別にテストできないわけじゃないんだし

574 名前:デフォルトの名無しさん mailto:sage [2019/02/27(水) 17:50:17.86 ID:avwBchUKa.net]
IOモナド不要論に近いものを感じる
単にReactを選択しなければいいだけなのにね
選択肢の中に一つでも気に入らないものが混じってると全否定を始めるんだからもう

575 名前:デフォルトの名無しさん mailto:sage [2019/02/27(水) 17:53:11.18 ID:XUj+n7600.net]
IOモナド不要論というか、IOモナド至上主義じゃないってだけ
副作用排除は素晴らしいよ?でも複雑にしてまでやることじゃない。
バグは副作用でも増えるだろうが、複雑にしても増えるんだよ
書くものが増えれば増えるほど、書き間違いも増えテストも増えるんだから

576 名前:デフォルトの名無しさん mailto:sage [2019/02/27(水) 17:58:32.64 ID:fbQufi7O0.net]
>>558
その形なら単にReduxを使わなければ良いだけでは?
使用を強制されてるのなら何とも言えないけど

ちなみにうちは本開発でReduxを使ってない
別に嫌ってるわけでもなく、とりあえずバニラなReactでやってるうちに
Contextが来たのもあって特に入れたい状況にもならずって感じ

577 名前:デフォルトの名無しさん mailto:sage [2019/02/27(水) 18:03:11.05 ID:XUj+n7600.net]
>>561
たぶんReduxは捨てろって流れになるだろうね。
それが可能になるContext

行き過ぎた関数型ブームなんだろうな。
だいたい行き過ぎて戻ってやっと最適な状態になる。

あと別に使用を強制されてない。
React自体使ってないものw

578 名前:デフォルトの名無しさん mailto:sage [2019/02/27(水) 18:13:46.28 ID:gzx7LPiYa.net]
>>553
ていうかまず状態って言うほどサイト全体で持つ必要あるのか?って思うね
大体の場合はコンポーネントの中で閉じててもいい場合が多いし
本当にサイト全体で持ちたいデータはリロードとかて吹っ飛ばないようにlocalstrageにでも書いた方がいいんじゃないかとか

579 名前:デフォルトの名無しさん mailto:sage [2019/02/27(水) 18:21:13.76 ID: ]
[ここ壊れてます]

580 名前:U+okKr8Fa.net mailto: 遷移して戻ってまだ編集内容が残ってると逆に気持ち悪い []
[ここ壊れてます]

581 名前:デフォルトの名無しさん mailto:sage [2019/02/27(水) 19:19:39.92 ID:6a6tMlMF0.net]
どのコンポーネントが状態持ってるのか探す方がめんどくさいじゃん。



582 名前:デフォルトの名無しさん mailto:sage [2019/02/27(水) 19:36:24.78 ID:haTnnqieM.net]
reactは好きだけどreduxめんどくさい論は大賛成!
hooks + contextに大期待!!

583 名前:デフォルトの名無しさん mailto:sage [2019/02/27(水) 20:01:14.80 ID:gzx7LPiYa.net]
>>565
その部品の情報がその部品で閉じてるなら探す必要ないじゃん?

584 名前:デフォルトの名無しさん mailto:sage [2019/02/27(水) 20:20:53.09 ID:33VvYXhGp.net]
Redux使わずcontextAPIのみでアプリ作ったけど、なかなか良い感じ
シンプルisベストだね

585 名前:デフォルトの名無しさん mailto:sage [2019/02/27(水) 22:38:29.67 ID:U+okKr8Fa.net]
マルチページ+Vueがベスト

586 名前:デフォルトの名無しさん mailto:sage [2019/02/27(水) 23:30:28.79 ID:6a6tMlMF0.net]
>>567
その部品で閉じるような状態ならな。
二つ以上の部品にまたがる状態だってあるだろ。

587 名前:デフォルトの名無しさん mailto:sage [2019/02/27(水) 23:47:31.09 ID:XUj+n7600.net]
だから2つ以上の部品にまたがる所だけで良くなるだろ

588 名前:デフォルトの名無しさん [2019/02/27(水) 23:49:27.29 ID:PVZtgHDGr.net]
reduxなんて面倒くさいレベルに入らないだろ
しょぼいシステムしか作ったことがないんだろうが

589 名前:デフォルトの名無しさん mailto:sage [2019/02/27(水) 23:52:10.20 ID:6a6tMlMF0.net]
>>571
その分け方がわかりやすいと俺は思わん。アドホックな部分が増える。

590 名前:デフォルトの名無しさん mailto:sage [2019/02/28(木) 00:01:04.44 ID:IYEK0cme0.net]
>>572
つまりあなたも面倒くさいって思ってるわけですよね?
このぐらいのレベルなら耐えられるって言ってるだけだし

591 名前:デフォルトの名無しさん mailto:sage [2019/02/28(木) 00:13:22.40 ID:WHNbTV5sp.net]
Reactそのものが面倒だと思う
サーバーサイド一本の人が移動してきて、Reactのコンポーネント一つ任せたら、onclickで画面をエフェクトさせるのが出来ないとブーたれてた
cssと組み合わせてやるんですよと教えたけど、デザインとロジックが分離されてない糞フレームワークだと文句ダラダラ
結局Reduxのところだけ担当してもらった
サーバーサイドだけの人はこの世界では使い道がない



592 名前:デフォルトの名無しさん mailto:sage [2019/02/28(木) 00:24:32.39 ID:PBjHM/k00.net]
それはサーバーサイドしか知らないのに画面のエフェクトだデザインとロジックの分離だ言う
その人個人の問題なんじゃないかね。

593 名前:デフォルトの名無しさん mailto:sage [2019/02/28(木) 00:30:03.58 ID:IYEK0cme0.net]
デザインとロジックが分離されてないのは本当だろ

594 名前:デフォルトの名無しさん [2019/02/28(木) 01:39:22.43 ID:FLrrxMk0r.net]
>>574
こんなのより何千倍も面倒くさいプログラミングしてきてるから面倒くさくねえ部類って言ってんの
頭イカれてんのか?

595 名前:デフォルトの名無しさん mailto:sage [2019/02/28(木) 06:14:57.31 ID:WHNbTV5sp.net]
何千倍も難しいって、口調が前にどこかのスレで見たような気がする
確か自称ゲームプログラマーじゃなかったけ

私大文系はクズだのヴァカだの幾何学的計算が出来れば高卒でも理系とか意味不明な発言の人だった

596 名前:デフォルトの名無しさん mailto:sage [2019/02/28(木) 06:16:05.22 ID:WHNbTV5sp.net]
バカじゃなくてヴァカという変な単語を連呼してたので覚えてる

597 名前:デフォルトの名無しさん mailto:sage [2019/02/28(木) 06:50:50.42 ID:6H8i6ZZe0.net]
てかテキストボックスのチェンジイベントでイチイチReducerだかDispatcherだかを経由してストアに書きに行くもんなの?
確定ボタン押した時でよくない?

598 名前:デフォルトの名無しさん mailto:sage [2019/02/28(木) 06:55:29.34 ID:6H8i6ZZe0.net]
>>577
デザインとロジックが分離してない上にVueみたいにコンポーネントとして独立するわけでもないっていう中途半端さがね

599 名前:デフォルトの名無しさん mailto:sage [2019/02/28(木) 08:52:57.67 ID:jOvvow1Ud.net]
落ち着け、議論を飛び出してケンカになってるぞ。そこまでくると他の人に迷惑だから頼むから我慢して2、3日スレから離れて観て欲しい。

600 名前:デフォルトの名無しさん mailto:sage [2019/02/28(木) 08:57:16.34 ID:w/cn9HKca.net]
>>583
ビビんなよ。5chではよくあることだろ

601 名前:デフォルトの名無しさん mailto:sage [2019/02/28(木) 10:41:44.71 ID:6x03bq62a.net]
ビジネスロジック→Service(バックエンド)
プレゼンテ



602 名前:ーションロジック→ViewModel(js)
デザイン→View(html/css)

サーバーサイドおじさんはプレゼンテーションロジックがお気に召さないらしい
ビジネスロジックとデザインだけで完結するMVCフレームワークが人気
[]
[ここ壊れてます]

603 名前:デフォルトの名無しさん mailto:sage [2019/02/28(木) 10:50:58.35 ID:GdwBglQC0.net]
>>585
そこに、ActionとAction CreatorとReducerとStoreは
どこに含まれるの?って話だよ

アーキテクチャ上、必要ないものが多すぎる

604 名前:デフォルトの名無しさん mailto:sage [2019/02/28(木) 12:22:34.05 ID:qWkUq+5ha.net]
>>586
分類するなら全部プレゼンテーションロジックだろう
SPAとかいう誰得要件のせいでプレゼンテーションロジックが過剰に肥大化複雑化してしまった結果それらが産まれた
従来のマルチページに戻すだけでスッキリ解消される

605 名前:デフォルトの名無しさん mailto:sage [2019/02/28(木) 12:46:03.68 ID:jOvvow1Ud.net]
誰得っていうけどブラウザアプリ作るならSPAの方がUXが劇的に向上するケースが殆どじゃないか?

606 名前:デフォルトの名無しさん mailto:sage [2019/02/28(木) 12:49:53.87 ID:qWkUq+5ha.net]
UXが向上したということにしたいだけでは?
案外ユーザーはシンプルなMVCのほうが簡単で良いと思ってるものさ

607 名前:デフォルトの名無しさん mailto:sage [2019/02/28(木) 13:05:42.47 ID:jOvvow1Ud.net]
シンプルなMVCかどうかの判別ってユーザーからできるの?ユーザーってもしかして顧客のこと?

608 名前:デフォルトの名無しさん mailto:sage [2019/03/02(土) 15:08:24.35 ID:IgVX/rLT0.net]
年明けてから二ヶ月経過したけどなんだかんだ書籍出てるな
売れてるんかねぇ

動かして学ぶ!Vue.js開発入門 (NEXT ONE)/翔泳社/森巧尚/2019/1/15発売/ISBN-13: 978-4798158921
Vue.js & Nuxt.js超入門/秀和システム/掌田津耶乃/2019/2/5発売/ISBN-13: 978-4798056593
AngularによるモダンWeb開発 基礎編 第2版/日経BP社/末次章/2019/2/23発売/ISBN-13: 978-4822254537
React.js&Next.js超入門/秀和システム/掌田津耶乃/2019/3/8発売/ISBN-13: 978-4798056920

609 名前:デフォルトの名無しさん mailto:sage [2019/03/02(土) 16:45:37.50 ID:yWxTFA8Fp.net]
ウチの会社でReactのアプリを独自UIの新規開発からロジック周りまで全部できるPGは一人しかいないわ
オフショア入れて百人以上PGいるけど、みんなFlexbox使って自分でUI書けませんとか、エフェクトのアニメーションを自作できませんとか、htmlとcssで躓いてる
デザイン系が得意なPGだと今度はDBやAPIが良く分かりませんという風になる

デザインとロジックの分離が不完全なので不器用な奴には使えない
結局Reactのアプリ制作はその一人が設計構造を考えて何人かで分担して作ってる
その一人がいなくなったら改修も容易ではない

610 名前:デフォルトの名無しさん mailto:sage [2019/03/02(土) 16:52:47.42 ID:IgVX/rLT0.net]
>>592
そう最低限なんでもできるリーダーがいなきゃ初期導入すら始まらんもんな
浸透すらしてないのにフロントとバックを分業分業言い過ぎだとは常々思ってる

611 名前:デフォルトの名無しさん mailto:sage [2019/03/02(土) 17:18:02.29 ID:mksg7qZ+0.net]
html5で独自属性を使うときはdata-*で命名する規則になってるけど
どのフレームワークも無視してるのはなぜ?



612 名前:デフォルトの名無しさん mailto:sage [2019/03/02(土) 20:30:41.54 ID:b3M+C2mw0.net]
「知りません」は別に問題無いけど「やってみても分かりません」という奴は
PGとも呼べない半人前だと思う
でも多いんだよなそういうの

613 名前:デフォルトの名無しさん mailto:sage [2019/03/02(土) 20:45:13.26 ID:ujIKCjUH0.net]
>>594
その属性はビルド後も残るの?

614 名前:デフォルトの名無しさん mailto:sage [2019/03/02(土) 21:47:05.25 ID:gbDUCVtH0.net]
>>595
「よく分からないけど動いた」

615 名前:デフォルトの名無しさん [2019/03/02(土) 21:51:40.27 ID:Fdvrrf47r.net]
>>592
フロント、バックエンド、DB、インフラからデザイン、写真加工、キャラ背景画作成、アニメーションまでできる俺は頂点に立てるかな?

616 名前:デフォルトの名無しさん mailto:sage [2019/03/02(土) 22:08:26.00 ID:Lvrdovo/0.net]
>>593
> 浸透すらしてないのにフロントとバックを分業分業言い過ぎだとは常々思ってる

一人でなんでもにできる人が居ないから、分業にしないとだめって話なんじゃないの?
Reactでどうやって分業するのかしらんが。

Reactは設計レベルで分業がし辛いフレームワーク

617 名前:デフォルトの名無しさん mailto:sage [2019/03/02(土) 22:12:30.11 ID:bakyLAA50.net]
rails、angular、vueなら分業しやすいとでも?

618 名前:デフォルトの名無しさん mailto:sage [2019/03/02(土) 22:15:55.89 ID:Lvrdovo/0.net]
まあそうだね。

RailsのERBはHTMLに近いから編集してもらえるし、
AngularもHTMLベースだから。

ReactとVueはJavaScriptの中にHTMLの断片が埋まってるから
それを修正して思い通りのデザインを作ってもらうのは無理だろう

619 名前:デフォルトの名無しさん mailto:sage [2019/03/02(土) 22:24:29.37 ID:20MtSIx6a.net]
フロントとバックは分業したほうが楽だ
どっちもできる人は多くない
いたとしても負荷がかかるから無理強いするとブラック企業になってしまう
それに分業といってもAPI(作る|呼ぶ)だけだろう
難しいとこなんて何もない

620 名前:デフォルトの名無しさん mailto:sage [2019/03/02(土) 22:33:41.00 ID:IgVX/rLT0.net]
>>599
逆に分業じゃなっきゃできんってヤツはわざわざ勉強してまで新しい技術を導入したいとかいい出すヤツは居ないっていう話だよ

>>600
なんでRailsねじ込んできた?

621 名前:デフォルトの名無しさん mailto:sage [2019/03/02(土) 22:40:19.17 ID:x3fQB5qB0.net]
>>594
無視ってどういう意味で?少なくともReactのアプリで使えているけど。



622 名前:デフォルトの名無しさん mailto:sage [2019/03/02(土) 22:46:45.64 ID:0oz9yp0R0.net]
阿部寛のHPを構築するならVue、React、Angularどれがいいの?

623 名前:デフォルトの名無しさん mailto:sage [2019/03/02(土) 22:48:37.42 ID:Lvrdovo/0.net]
>>603
意味がわからん。

仕事を一人でやるのは大変だから、分業できるようにしないと駄目って話なんだが?
新しい技術であっても、それで分業ができればいいんだよ。
というか分業ができる技術を導入するべきだ。

624 名前:デフォルトの名無しさん mailto:sage [2019/03/02(土) 23:11:54.68 ID:bakyLAA50.net]
この作業がそんなに難しいことだと思えないんだけど、そんなもんかね。
>ReactとVueはJavaScriptの中にHTMLの断片が埋まってるから
>それを修正して思い通りのデザインを作ってもらうのは無理だろう

625 名前:デフォルトの名無しさん mailto:sage [2019/03/02(土) 23:27:02.72 ID:Lvrdovo/0.net]
>>607
難しいかどうかじゃなくてやり方が全く違う。
普通はHTMLとCSSで作るんだから

626 名前:デフォルトの名無しさん mailto:sage [2019/03/02(土) 23:47:00.54 ID:IgVX/rLT0.net]
>>604
確かにReactの場合はそういう書き方やってないよね
独自属性でもclassName以外はonClickとか元の属性と見ても違和感ないし

>>594が言ってるのはvueのv-modelとかv-onとかv-bindとか
angularでもng-modelとかそういう独自属性があるのを言ってるんだと思う

>>594
ちなみにこの辺の独自属性ってフレームワークのコアライブラリで先に処理されて仮想DOMになるからなのか
ブラウザのデバッガでは存在しないものとして表示されないんだよね
今確認したけど<input v-model="msg" />みたいに書いた場合は
ブラウザのデバッガのElements(Chrome)やインスペクター(Firefox)で見ると<input>に変わってる
BootstapのNavbarなんかでよく使うdata-toggleやdata-targetはそのまま表示されてるから
html5の独自属性とは違う位置付けだと考えた方がいいんじゃないか

627 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 00:02:03.36 ID:PCCGC897a.net]
Vueの独自属性はHTML5準拠やで
なのでdata-*にしなきゃいかんルールなどない

628 名前:デフォルトの名無しさん [2019/03/03(日) 00:05:23.14 ID:QTOYGzGrr.net]
Chromeのvue dev-toolで確認できるんじゃないの

629 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 00:10:23.09 ID:eREWiz410.net]
>>611
それ使えば確かに見れるけどElements側に出ないって事は実DOMとしてはレンダリングされてないって事だと思う

630 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 00:17:30.72 ID:PCCGC897a.net]
単にインスペクターが無視してるだけだ
正しい属性なんだからレンダラが無視するわけにもいかんだろ

631 名前:デフォルトの名無しさん [2019/03/03(日) 00:43:00.34 ID:0eQXv8px0.net]
>>609
>v-modelとかv-onとかv-bindとか
そうそう。data-*ではないカスタム属性ってEclipseに警告だされてすっきりしない
だから実行時に消えるとしてもhtml5のカスタム属性としてはよくない気がする

本来ならxhtmlの名前空間みたいに*:*でカスタム属性を命名できれば良かったんだけどね



632 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 00:48:58.18 ID:GWdBiIMXa.net]
未だにEclipseなんてゴミを使ってるヤツが居ることに驚きなんだか

633 名前:デフォルトの名無しさん [2019/03/03(日) 01:03:17.04 ID:QTOYGzGrr.net]
eclipseww

634 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 01:41:00.89 ID:QeUrAhcJM.net]
実際レンダーする前のリソースなんだから
しょうがないんじゃないの
VSCodeとかでVue拡張使えばいいじゃん

635 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 01:46:51.51 ID:eREWiz410.net]
>>613
v-ifとv-showの違いとか読んだことない?ないものはないんだよ

636 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 08:28:07.07 ID:oO/57lY20.net]
なんだ、レンダリング前のテンプレートの話か。ならHTML5に準拠してないのは当たり前じゃん。
たしかにXHTMLならその規格に準拠した中で拡張できるけどHTML5はそれと決別したしねぇ。

637 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 09:22:56.48 ID:PCCGC897a.net]
>>618
正しくDOMとして評価された後にDOMを消してるだけ
拡張属性は正しく評価されてる

638 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 09:29:26.03 ID:eREWiz410.net]
>>620
だからその評価がBlinkやGeckoみたいなレンダリングエンジンで評価されるか
V8やSpiderMonkeyみたいなJavaScript実行エンジンエンジンで評価されるかの違いだって

639 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 10:40:12.55 ID:BbxzBxVK0.net]
>>608
そこまで違う作業とあんまり思ってなくて、
やってもらうとしてそんなに反感食うもんかなという風に思ってるのだが。
かなり勝手に思ってるだけだから実際の現場感覚はわからんけど。

640 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 11:31:27.74 ID:cmngH9hR0.net]
UIが劇的に切り替わる様な要件じゃ
デザインとロジックを完全に分離とかそもそも不可能じゃないの

641 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 13:57:28.79 ID:PCCGC897a.net]
デザイン
プレゼンテーションロジック
↑JS+HTML+CSS
--------
↓API
ビジネスロジック

デザインとロジックを分離するって言った場合、分離するのはビジネスロジックのこと
プレゼンテーションロジックを分離するという意味ではない



642 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 15:00:36.37 ID:KP+Vu9ps0.net]
WebまではHTML+CSSだけ分離も可能だけど
スマホWebアプリ/スマホアプリになってくると動きも含めてのUXという性質が強くなる

UI用ロジックや機能性まで考慮する「UXデザイナー」と
静止画の用意で終わるデザイナーとの差は大きい

Reactは後者のデザイナーとは相性悪いだろうね

643 名前:デフォルトの名無しさん [2019/03/03(日) 15:07:16.96 ID:QTOYGzGrr.net]
デザインもUIもUXもフロントも全部やればいいじゃん
そもそもなんでできないのか不明
フロント勉強してできるようになったのならデザインも勉強すりゃいい

644 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 16:31:53.99 ID:xQ2gqaf30.net]
>>626
何でも一人でやる時間があればそうする

645 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 16:40:53.54 ID:8CruhG400.net]
少なくとも難しいから分業してるわけじゃないだろうね。効率の問題。

646 名前:デフォルトの名無しさん [2019/03/03(日) 17:40:54.12 ID:QTOYGzGrr.net]
>>627
時間があればじゃなく、必要だからやらなきゃいけないんだよ
最近世界的にもその必要性が言われてる

>>628
効率悪いから一人でやるべきなんだろ

・フロントデザイナはコーディングできない

・フロントエンジニアはデザインできない。デザイン貰ってもセンスゼロだからコーディングで表現できない

https://postd.cc/the-death-of-front-end-developers/

647 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 17:56:55.95 ID:8CruhG400.net]
>>629
開発の規模とか体制によりけりだろ。
例えば自分が所属してるとこだと、フルスタックにやれる人にはデザインなんかに凝ってる時間があったら別の仕事やらせたい。

648 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 18:01:05.79 ID:eREWiz410.net]
効率でいうなら複数のサイトを作業区分毎に分業するよりも1サイト1人でやる方がよっぽどいいと思うけどね

649 名前:デフォルトの名無しさん [2019/03/03(日) 18:15:09.19 ID:QTOYGzGrr.net]
>>630
>デザインなんかに

そこの認識なんだよなあ
プログラマはデザインわかってないからデザインなんかにという言葉が出てくる

650 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 18:45:41.76 ID:8CruhG400.net]
>>632

651 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 18:47:22.33 ID:8CruhG400.net]
>>632
うーん、なんか噛み合わないな。デザインは大事だと思うから分業して欲しいと思うんだよね。そしてエンジニアが楽しいからってデザインに凝るのをよくないと思ってる。



652 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 18:49:08.31 ID:eREWiz410.net]
>>632
まぁ例えば
プログラミングレベルが10で
デザインレベルが5とかの人材の場合
どちらかと言えばデザインよりコーディングやって貰った方が効率いいってはあるんじゃない?

653 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 18:51:32.92 ID:8CruhG400.net]
>>631
それは否定しないがその人材を安定して確保しようとするといくら払えばいいの?という話にならないか?

654 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 18:54:01.18 ID:eREWiz410.net]
>>636
確保するんじゃなくて育てようって気がないのかね
これだから衰退するんだよ

655 名前:デフォルトの名無しさん [2019/03/03(日) 18:54:24.45 ID:QTOYGzGrr.net]
>>634
デザイン凝るっていう判断はどこでしてるの?
仕様として必要ならやるよな
それともそのフルスタックエンジニアの独断でやってるのか、デザインわかってない奴が決めてるのかにもよる

656 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 18:58:26.46 ID:8CruhG400.net]
>>637
育てること考えると余計に分業したくなるだろ。2人を両方フルスタックにするのと、それぞれ専門持たせて育てるのどっちが現実的なのか考えてくれよ。
なんか理想論でマウントとられても困る。

657 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 18:59:34.47 ID:cmngH9hR0.net]
人材云々の話は経営者が判断すべき問題であって
勉強しなくていいとかそういう問題じゃないでしょ

658 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 19:01:59.76 ID:eREWiz410.net]
>>592みたいに1人が抜けたらヤバイっていう状況はホントにヤバイから
できるうちに育てた方がいいよホント

659 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 19:03:05.35 ID:8CruhG400.net]
>>638
まあそれはそうだ。
仕様がガッチリ決まってるようなデザイン作成ってのを見たことないから故の思い込みかもしれんが、UIとなると必要以上に時間がかかってしまうという思い込みが自分のなかにあるのは確かだ。

660 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 19:04:53.82 ID:8CruhG400.net]
>>640
勉強すべきかどうかという話だったの?だとしたら俺も勉強すべきだと思うよ。

661 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 19:08:50.10 ID:8CruhG400.net]
ちなみに俺は>>630で体制によりけりと書いてるように、少数のとこならエンジニアのスキルや素質に合わせればいいと思ってる。少数でイキのいいベンチャーとかなら有能が多数派ってこともあるだろうしね。
おそらく仕事量に対する有能人材の割合が重要なんだと思う。



662 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 19:17:40.56 ID:26syIpped.net]
規模が大きくて大人数じゃないと作れませんねぇ、じゃあどこで分担しましょうか?

って考えればいい。

663 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 19:35:22.77 ID:PCCGC897a.net]
業務系だとそういう場合はレイヤーじゃなくてコンテキストで分けるのが主流だね
レイヤーで分ける企業はかつて見たことない

664 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 20:04:17.44 ID:WgQds1l30.net]
規模が大きくて大人数じゃないと作れませんねぇ、じゃあどこで分担しましょうか?

え?分担したら効率が悪いだろって?

じゃあ、2人で2ヶ月の仕事を、あなた1人で2ヶ月でやってくださいね。
効率がいいんだから2倍ぐらいやれるでしょ?
でも給料は変わりませんから。

665 名前:デフォルトの名無しさん [2019/03/03(日) 20:12:49.02 ID:QTOYGzGrr.net]
>>647
そうなる
エンジニアスキルはできない奴に比べて何倍も差あるからな
だから給料もそれに比例する

666 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 20:33:30.24 ID:WgQds1l30.net]
> だから給料もそれに比例する

夢見るのやめとけw

2人で2ヶ月も、1人で2ヶ月も
働く期間が2ヶ月なら給料は同じだ

667 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 21:11:25.76 ID:BbxzBxVK0.net]
スケールしない作業だと言われればそうかもなとしか言えんな。
できるなら起業しとる。

668 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 21:42:00.62 ID:QNZEu7Q40.net]
Rails と、Node.js + Express は、全く同じ。
Bundler と、npm, yarn も、全く同じ。
ERB と、EJS も、全く同じ

Webデザイナーの仕事を楽にする! gulpではじめるWeb制作ワークフロー入門、中村 勇希、2018/5/29

Node.js超入門、掌田津耶乃、2017

Junichi Ito (伊藤淳一)
Rails 5.1で作るVue.jsアプリケーション 〜Herokuデプロイからシステムテストまで〜
https://youtu.be/ycOeM2umXkY

669 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 22:00:40.86 ID:YuQgiS/h0.net]
>>651
死ね

670 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 22:01:29.06 ID:hdxDgHRsa.net]
Heroku使うメリットってなに?

671 名前:デフォルトの名無しさん [2019/03/03(日) 22:24:37.66 ID:QTOYGzGrr.net]
>>649
フロントデザイナーとフロントエンジニアがいても完成しない(デザインをコーディングで実現できないから)
しかしフロントフルスタックエンジニアがいれば何倍も早く完成する

何倍も早く完成するなら給料高くて当たり前
キミはどんなクソな会社で奴隷やってんの?
そもそもキミはフロントフルスタックエンジニアなのか?



672 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 22:34:10.60 ID:hdxDgHRsa.net]
寧ろフルスタックエンジニアって中小にこそ居るからな
待遇良くないってのもまぁあると思う

673 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 22:54:37.37 ID:QNZEu7Q40.net]
Heroku を使うのは、圧倒的にわかりやすいからだろう

それで、プログラマーの人件費が節約できる

674 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 23:07:55.84 ID:sIAjtg1ud.net]
>>654
逆にどういった組織を想定しているのか聞きたい。
1人にやらせた方が効率がいいのは当たり前だが、高給払えるような利益あげてる企業で、そんな体制で運営できるような小さなプロダクト扱ってる会社ってそんなにあるのか?

675 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 23:09:14.73 ID:eREWiz410.net]
慣れてしまえばLinuxでの鯖構築なんて難しい事なんもないけどな
特定の会社のインフラに依存するのってなんか怖いよね

676 名前:デフォルトの名無しさん mailto:sage [2019/03/03(日) 23:14:25.71 ID:GjzBYSLPd.net]
>>658
動かすまではともかく、商用運用するとなると結構ハードルあがるから需要はあるんじゃない?
安定稼働、セキュリティ、費用計算、etc.

677 名前:デフォルトの名無しさん [2019/03/03(日) 23:56:16.49 ID:dWHbj95s0.net]
>>629
デザイナのコーディングは昔からの課題だよな。
ただcssやdomが打てるなら、vueだとかなりスッキリ分業出来ると思うけどな。社内か社外かの方が問題大きい。

678 名前:デフォルトの名無しさん [2019/03/04(月) 01:06:09.78 ID:hdL+Fhbir.net]
>>657
フロントフルスタックがほとんどいないから仕方なくフロントデザイナーとフロントエンジニアを雇っているわけじゃん?
てことは当たり前だけど2人分の給料払ってるのは事実だよな
それが小さな会社だろうが大きな会社だろうが2人分払ってる

しかしそこにフルスタックが入って2人より速く作れて品質高いなら、2倍払っても納期早まるんだから安くなるじゃん

そいつは高給かもしれないがむしろ人件費安くなるんだけど?

679 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 01:26:05.61 ID:GKEA/LnB0.net]
>>661
なんか勘違いしてないか?

・早く作れるとしても2倍の速度にはならない。
・なぜなら仕事量は2倍になるから
・でも給料が2倍になることはない
・儲けは会社のもの

680 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 01:28:05.52 ID:GKEA/LnB0.net]
・早く作れるとしても2倍の速度にはならない。
・なぜなら二人の仕事を一人でやるので仕事量は2倍になるから
・でも給料が2倍になることはない
・仕事量が増えても納期は伸びない
・儲けは会社のもの

681 名前:デフォルトの名無しさん [2019/03/04(月) 03:24:32.08 ID:hdL+Fhbir.net]
>>662
お前が勘違いしてるだろ

・分業の場合
フロントデザイナーがデザインする

フロントエンジニアがコーディングする

デザインセンスないからコーディングできない

納期遅れる

・フルスタック1人の場合
フルスタックがコーディングとデザイン両方を同時にやる



682 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 06:33:24.10 ID:xKwIvMQM0.net]
>>626
>フロント勉強してできるようになったのならデザインも勉強すりゃいい

これなんかいい勉強法ってある?

683 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 07:36:10.51 ID:0mKT+E5t0.net]
2倍くらいはなるだろ上手く行かなきゃ進捗出ない事なんてザラにあるだろうし

>>665
イラストレーターとかが1からUIデザインするサイトとかじゃない限りはCSSフレームワーク使えりゃいいんじゃない?

684 名前:デフォルトの名無しさん [2019/03/04(月) 09:49:24.20 ID:hdL+Fhbir.net]
>>665
自分で言っといてすまんけど、正直デザインセンスっていくら勉強してもなかなか向上しないんだよね
ベースとなるデザインの勉強はそのへんの学校に通いつつ、普段はひたすらUI/UXの情報みたり(海外系サイトおすすめ)して
構造や配色などの知見を増やし、あとはフロントデザイナーに金払って教えてもらう

685 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 11:00:17.97 ID:fPP1emsu0.net]
>>664
それただのウォーターフォールやん
分業は同時進行するんだよ

686 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 11:02:34.38 ID:fPP1emsu0.net]
・フルスタック1人の場合
フルスタックがデザインする(その間コーディングできない)

フルスタックがコーディングする(その間デザインできない)

一人でやるから同時に作業できなくて時間がかかる

納期遅れる

・分業の場合
フロントデザイナーとフロントエンジニアが両方を同時に作業を始める

687 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 12:14:16.79 ID:F1HORdDoa.net]
でも分業するとインターフェースの協議に時間がかかるからそれがなかなかペイできないんだよね

688 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 12:30:51.83 ID:gIkfSPyQ0.net]
>>668
横から質問なんだけど
デザインが決まってない状態で
フロントエンジニア(プレゼンテーションロジック担当?)って何の作業するの?

689 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 12:35:52.25 ID:yQsTNF7Xa.net]
>>671
詳細なデザインがないと出来ないこと以外の全部

690 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 13:01:07.29 ID:enTqHBl5M.net]
ハハハ

691 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 14:17:57.52 ID:fPP1emsu0.net]
>>671
あのさぁ、かっこいい見た目なんか作らないでいいから
動きが必要なところをさっさと作るとかあるでしょ



692 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 14:49:51.44 ID:vM9NvnRR0.net]
見た目のない動きか
文字列かな

693 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 15:18:45.40 ID:fPP1emsu0.net]
かっこいい見た目といったのに
全く何も表示がないものと解釈するのか
馬鹿なのかな

694 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 15:36:50.66 ID:ldzpTYWZ0.net]
僕のおちんちんも激しく動きます

695 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 16:46:58.11 ID:gIkfSPyQ0.net]
>>672 >>674
例えばこんな感じを想定して作り始めて
https://i.imgur.com/kwOSd6U.jpg
デザイナからこれが来たら割と手戻ったりしない?
https://i.imgur.com/Q9xaols.png

他の例
https://i.imgur.com/gb8zhRE.jpg
https://i.imgur.com/EDbn41B.png
https://i.imgur.com/H1gSLxX.jpg

696 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 17:04:13.55 ID:yQsTNF7Xa.net]
>>678
そういうのは手戻りではなく設計不足というのですよ

697 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 17:14:40.72 ID:gIkfSPyQ0.net]
>>679
設計の段階でデザインがほぼ固まってから実装ということなら
デザイン→実装の直列作業で
同時進行じゃない気がするんだけど・・・

698 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 19:04:00.56 ID:kaSUrRDqa.net]
デザインとロジックの分業は分かるが
結局フロントロジックとバックロジックの分業なんてしたって無駄なんだよ

699 名前:デフォルトの名無しさん [2019/03/04(月) 20:44:55.78 ID:hdL+Fhbir.net]
>>678
おれこのくらい他人のデザインも不要だしモックなくても頭の中でデザインできるからすぐにコーディングできるわ
なんなら数パターンのデザインを一つのソースで作ることもできる

さっきから言ってることだが、フルスタックはデザインもコーディングも「同時進行」で作業するんだよ
デザインしてからコーディングをやるんじゃないから

700 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 21:38:41.81 ID:0mKT+E5t0.net]
SPAじゃなくPWAってこれから流行るの?

701 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 22:18:18.82 ID:fPP1emsu0.net]
>>678
手戻りが出ないように最初のざっくり方針を決めとこうな



702 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 22:19:37.95 ID:fPP1emsu0.net]
>>682
> さっきから言ってることだが、フルスタックはデザインもコーディングも「同時進行」で作業するんだよ

同時進行で作業するが、一人でやるから時間が2倍かかるって話なんだが?

703 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 22:20:44.65 ID:fPP1emsu0.net]
どうしてもデザインが完成しないとコーディングが出来ないって言うなら、

相手にデザインさせている間、自分は違う仕事をやればいいだけだし

704 名前:デフォルトの名無しさん [2019/03/04(月) 22:42:20.42 ID:hdL+Fhbir.net]
>>685
何度も言うのめんどくせ
まあわからん奴にいくら言ってもわからんからどうでもいいや

705 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 22:51:08.65 ID:0mKT+E5t0.net]
人数増えた分だけ作業が速くなると錯覚してる大企業体質に何言っても無駄だと思うよ

706 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 23:01:25.29 ID:VXdcZokm0.net]
なんで極論同士で争うんだ?
開発規模(複数プロジェクトの合計の規模も含む)が大きくなって一人じゃできないから分業が発生するってだけだろ?
みんな一人でやった方が効率がいいとわかってるし、一人じゃ限界があるってわかってるんだよな?

707 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 23:05:47.91 ID:Gt0dR1DD0.net]
人数が増えるほど、すり合わせコストが掛かるから、単純な掛け算にならない。
意思疎通・教育コストが掛かる

仕事量 = 単位仕事量 * 人数 * (1 - すり合わせコスト)

1 - すり合わせコストが、人数が増えると、
0.8 から、0.5 まで、ドンドン下がっていく

工場で言う、段取りコスト・間接作業。
直接作業をするのに必要な、作業

だから、プログラマーのように難しい仕事は、単純に人数を増やしていけな

708 名前:「。
人数効果があるのは、すごく簡単な単純作業の場合だけ

こういうのは、中小企業診断士・MBA のテキストに書いてある
[]
[ここ壊れてます]

709 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 23:06:55.42 ID:VXdcZokm0.net]
重要なのはいかに効率よく分業するかだろ?

710 名前:690 mailto:sage [2019/03/04(月) 23:11:34.47 ID:Gt0dR1DD0.net]
でも複数人数の良い点も多い

視野が広くなる。
一人じゃ気付かない事に、気付く

教育にも良い。
ペアプログラミングは、非常に効果的

一見、損に思うけど、
教育効果により品質が向上して、後で十分に取り戻せる

711 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 23:24:38.44 ID:56/JbqfwM.net]
Web制作板行けやカス



712 名前:デフォルトの名無しさん mailto:sage [2019/03/04(月) 23:32:05.12 ID:/Cs1xWTia.net]
>>692
辞めなければな!

713 名前:デフォルトの名無しさん mailto:sage [2019/03/05(火) 05:46:36.86 ID:437fdADv0.net]
>>694
そういう発想だから辞められるんだよ。

714 名前:デフォルトの名無しさん mailto:sage [2019/03/05(火) 07:55:43.10 ID:N2s6BYvr0.net]
>>684
「デザイン」の定義が食い違ってるのかもね

それはデザインを先に固めるって言うんだ
同時進行してない

デザインは設計だと考えてるからこそ>>668に疑問を持ったわけ

こういったこと
https://uxdesign.cc/designchallenge-cd7bdb589855

715 名前:デフォルトの名無しさん mailto:sage [2019/03/05(火) 11:20:44.07 ID:YFVILFEb0.net]
>>696
ざっくり方針を決めただけなので
デザインは変わることがありますが
デザインを先に固めています。

と言いたいの?

716 名前:デフォルトの名無しさん mailto:sage [2019/03/05(火) 11:43:17.86 ID:DIrFqE8lM.net]
「ざっくり方針決める」だけで給料もらえて納期遅れを下流のせいにできるなんて……


……なんていい仕事なんだ!俺がやりたい!

717 名前:デフォルトの名無しさん mailto:sage [2019/03/05(火) 12:25:43.27 ID:IGhfqt8ja.net]
ウェブ系は楽だよなぁほんと
モダンで便利なエコシステム
ハイスペックな開発機
クラウドへのアクセスもサクサク
厳しい社内統制もなくゆるい現場
シンプルで簡単なドメイン
10年物のレガシーなんて無い

718 名前:デフォルトの名無しさん mailto:sage [2019/03/05(火) 12:41:39 ]
[ここ壊れてます]

719 名前:.55 ID:4lHVjw0ya.net mailto: >>699
Java6「現役やで」
[]
[ここ壊れてます]

720 名前:デフォルトの名無しさん mailto:sage [2019/03/05(火) 14:48:04.00 ID:YFVILFEb0.net]
>>698
わざと?必死だね?

ざっくり方針を決めるのは、デザイナーとプログラマーで
並行して作業を進められるようにするためだよ。

でないと一人で作業することになって、2倍の時間がかかる

721 名前:デフォルトの名無しさん [2019/03/05(火) 16:44:18.98 ID:nrrzzgEL0.net]
>>699
フロントはどんどん楽になるよね。やってて楽しいのがweb系。ただサーバサイドやDB、ネットワークはレガシーも残ってるよ。



722 名前:デフォルトの名無しさん mailto:sage [2019/03/05(火) 20:46:44.51 ID:nwidEdp+0.net]
>>701
その2倍ってのがおかしいって

723 名前:デフォルトの名無しさん mailto:sage [2019/03/05(火) 23:25:03.26 ID:8a3k8XPA0.net]
たしかサーバーサイドJavaでJSPのテンプレートエンジン廃れたよね?
htmlに<if>とか<for>とか変なタグを入れるなって流れになったはずだけど
最近はJavaScriptで同じようなことしてるよなあ

724 名前:デフォルトの名無しさん mailto:sage [2019/03/05(火) 23:42:35.99 ID:exrcDGV20.net]
それはJavaが廃れたんであって、Javaの世界じゃあ普通にやってるよ。

725 名前:デフォルトの名無しさん mailto:sage [2019/03/06(水) 01:11:22.98 ID:C3QpaLdU0.net]
>>704
JSPはJAVAソースコードを出力する為のテンプレートであって、HTMLそのものでは無いよ。

JSP→解析→JAVAソースコード→コンパイル→classファイル

このclassファイルが、外部からのリクエストに対してHTMLを出力して、レスポンスで返してるんや。

んで、出力されたHTMLには<%if( 条件式 ){%>なんて文字列も出てこないよ。
そもそもこの<%%>タグはHTMLの為じゃなく、JAVAソースコード生成の為に使われるから出てくるわけ無い。

726 名前:デフォルトの名無しさん mailto:sage [2019/03/06(水) 01:43:49.00 ID:Uli2bEJM0.net]
Spring Boot のテンプレートエンジンは、Thymeleaf とかだろ

727 名前:デフォルトの名無しさん mailto:sage [2019/03/06(水) 08:55:10.29 ID:lkGca0kGd.net]
そういう意味ならJSFがある

728 名前:デフォルトの名無しさん mailto:sage [2019/03/06(水) 22:12:48.11 ID:oR6mPeK70.net]
スレ違いかもしれないけど、たまには気分転換にvueとかreactとかの話題はどうかな?

729 名前:デフォルトの名無しさん mailto:sage [2019/03/06(水) 23:50:49.60 ID:1pbO3u+T0.net]
Reactの仮想DOMとかいうのが未だに分からん
HTMLをオブジェクトの木構造にしないで文字列のままで握ってるってことでOK?

730 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 02:22:49.29 ID:/M0SxS0j0.net]
>>710
違う。
メモリ上に持つ実DOMの劣化レプリカ。
そして利用者は実DOMはイジらず、劣化レプリカの方をイジる。
angular react vueなどの仮想dom系のライブラリが劣化レプリカの変化から、最小の実dom操作を計算して適用。
昔は人がやってた仕事がライブラリに委譲された格好。

731 名前:デフォルトの名無しさん [2019/03/07(木) 02:44:23.97 ID:FkBKY4Sxa.net]
HTML のタグを javascript のオブジェクトで単純に表現しただけのもの。react であれば、createElement 関数で生成されるオブジェクトのことになる。で、そのインスタンスの変化に合わせて実際の HTML に反映してくれる。



732 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 03:07:16.07 ID:7lOwuU310.net]
>>711
HTMLElementじゃないけど似たようなのをツリーで持ってるのか
HTMLElement.clone(true)でページ全体のクローンを作って、
それをDOM操作してからdocument.documentElementに差し替えるのかと思ってた

単純にFragment使ってDOM操作するより速いのか気になる

733 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 07:22:52.72 ID:rioBJ/QG0.net]
やってることは実DOMの変更をバッファして
変更タイミングをいい感じでやってくれてるってことじゃないの?

734 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 08:43:40.11 ID:oVD+pZgg0.net]
>>713
> 単純にFragment使ってDOM操作するより速いのか気になる
速くならない

× 仮想DOM

735 名前:ヘ速い
○ 仮想DOMは遅くならないように頑張っている

速い速い詐欺のどこが詐欺かって言うと
何より速いかを書いてない所

仮想DOMの最初の発想は、実DOMと同じような内容をメモリ内に保持しておいて、
仮想DOMから実DOMをすべて生成しよう!という発想

もともとはゲームから来ている発想。
ゲームは1秒間に60回ぐらいメモリ内容を元に画面全体を書き換えている。

変更があるたびにDOM全体を書き換える。
当然DOMでそんなことやったら遅いって思うよな?
そこで差分を計算して変更があった所だけ書き換える

つまり

○ 仮想DOMは画面全体を書き換える発想だが、差分だけを書き換えるから、画面全体を書き換えるより速い

と言ってるだけ

そもそも実DOMを操作しているときは、必要最小限のものしか書き換えないので
仮想DOMが差分(必要なところ)だけ書き換えるといっても、それ普通ですよね?という話でしか無い。
むしろ仮想DOMは実DOM操作よりメモリ使用量は増えるし、差分計算の分遅くなってる。
[]
[ここ壊れてます]

736 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 08:54:40.49 ID:NrdLaj5lM.net]
実DOM操作自体の速度は当然変わらない。
人が書くか仮想DOMライブラリがやるかの違いだけ。
ライブラリは実DOM操作の回数を減らすため仮想DOM持って計算頑張ってるだけ。
「DOM操作が速くなる」とか言ってるのは全部嘘。

737 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 09:00:44.74 ID:oVD+pZgg0.net]
> 人が書くか仮想DOMライブラリがやるかの違いだけ

人は「全体の中から差分を計算してそこだけ書き換える」
なんてことはやってないですよ。

人はある処理の中でDOMのどの部分を書き換えたいかを
知っているので、必要最小限のDOM操作しか変更しない
(クソプログラマなら全部消して作り直すとかいう無駄してるかもしれんが)

その全部消して作り直すっていうのをやろうという発想が仮想DOMで
遅くならないように差分を計算して、必要最小限のものだけ変えよう。というふうに
自分で遅くしておいて、自分で改善した(速くした)って言ってるだけなんです

738 名前:デフォルトの名無しさん [2019/03/07(木) 09:10:38.72 ID:FKXLE38I0.net]
速度に関しては実dom直接操作よりは遅い。その辺はググればすぐ出るから見とくと良い。ただおかけでリアクティブという大きなメリットを手に入れた。ページ切り替えさえ差分更新してspaも出来る訳で、レスポンスは全体的に向上する。

739 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 09:19:40.62 ID:NrdLaj5lM.net]
人はある処理の中でDOMのどの部分を書き換えたいかを
知っている(担当の頭の中にある)ので、必要最小限のDOM操作しか変更しない。

人の頭に依存しないように機械的に
最小限のDOM操作を特定・適用までやろうとしたのが仮想DOM系ライブラリ。

人が脳のリソース使ってやるか仮想DOMライブラリが自動でやるかの違いだけ。

740 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 09:27:16.66 ID:oVD+pZgg0.net]
ここで忘れてはいけないのは

> ただおかけでリアクティブという大きなメリットを手に入れた。ページ切り替えさえ差分更新してspaも出来る訳で、レスポンスは全体的に向上する。

リアクティブは本当に必要なのか?
SPAは本当に必要なのか?

ということ

世の中の多くのソフトウェアはリアクティブなんか使っていない。
それでまともに動く製品を作れている。

SPAもそうだ。ユーザーにとってはシングルページだろうが、マルチページだろうが関係ない。
シングルページだとページごとに分担して開発するのが難しくなる。
マルチページなら、ページごとに別の人が担当して開発するのが楽である。

741 名前:デフォルトの名無しさん [2019/03/07(木) 09:52:31.84 ID:FKXLE38I0.net]
リアクティブのメリットは複雑な入力フォームが分かりやすい。pc購入する際のカスタマイズ画面なんかが良い例。以前と比べて工期の短縮できて保守が凄く楽。部分的な導入も出来るからvueで試せば分かる。フォーム周りは圧倒的にリアクティブが良い。



742 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 09:57:57.50 ID:oVD+pZgg0.net]
>>721
リアクティブがやりやすいんじゃなくて、
以前のやり方がだめだっただけでは?

743 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 10:01:54.73 ID:oVD+pZgg0.net]
>>721
その例ってこんな程度でいいの?

https://www.dell.com/ja-jp/shop/serviceselection/cai401cspgmt04oo3ijp?selectionState=&c

744 名前:artItemId=
https://www.dospara.co.jp/5goods_pc/pc_bto.php?h=d&f=d&m=pc&tg=13&mc=8374&sn=3619&vn=1&lf=0
[]
[ここ壊れてます]

745 名前:デフォルトの名無しさん [2019/03/07(木) 10:43:49.16 ID:FKXLE38I0.net]
>>722
ある入力に対して別の複数の要素が動的に変更される場合、リアクティブだとcomputedプロパティで自動的にuiに反映されるよう設定するのがとても楽。これjqueryだと面倒だしミスも増える。

>>723
この程度って。。結構大変だよ。条件も頻繁に変わるだろうし。

746 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 10:54:23.39 ID:oVD+pZgg0.net]
>>724
やっぱり使い方がわかってないだけだな

ある入力に複数の要素が動的に変わるならば、
その要素の親に、クラスをつけて、
あとはCSSで、それ以下の要素の表示、非表示状態を切り替えるだけだよ

jQueryだと最低3行。あとはCSSでおしまい。

747 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 11:05:05.80 ID:oVD+pZgg0.net]
前から思ってるんだけど(自称)プログラマって
HTML/CSSは嫌いです。出来ません。って人多いよね。

それを毛嫌いしてるというか、CSSなんてデザイナが使うもんだろ
馬鹿にしている感じで、俺出来ないから(笑)みたいな感じで言う。
恥ずかしいと思ってないんだろう。

多くのDOM要素はCSSを使って単に見えなくしたり表示したりすればいいだけなんだが
(プログラマとしての技術力不足で)CSSを使えないから
JavaScriptでいちいち作り出したり削除するしか出来ないんだよな

748 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 16:04:46.19 ID:uSXw2eVGM.net]
>>720
要件を勝手に決めつけないでよ
客からユーザーから代弁して喋るなら何だって言いたい放題じゃん

749 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 17:22:06.09 ID:oVD+pZgg0.net]
>>727
だったら要件を決めつけてメリットだって言わないでくれ
要件によってはデメリットなんでしょ?

750 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 18:14:20.13 ID:mVKClUMzd.net]
簡単にいい感じのページが作れるのはメリットの一つだと思うけどな。
例えばpythonは成果物に関してはCに対するメリットはないけど簡単に作れるから人気なわけで。

751 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 21:20:18.65 ID:bV0vVOYFM.net]
>>728
いやだからさ
「要件次第」で済む話を何度掘り返すのよ
スレタイ見てスレチだと思わないの?



752 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 22:37:46.71 ID:cPei42ec0.net]
>人はある処理の中でDOMのどの部分を書き換えたいかを
>知っているので、必要最小限のDOM操作しか変更しない
>(クソプログラマなら全部消して作り直すとかいう無駄してるかもしれんが)

クソプログラマは全部消して作り直す
賢いプログラマはどうDOM操作すれば最適かなどという生産性のない仕事をフレームワークに任せる

753 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 22:42:13.25 ID:N/E4f3Caa.net]
>>725
管理対象の状態数が増えるのがやだ
状態はできるだけ純粋で論理的な形式で管理したい
という要求がスッポリ抜けてるね

754 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 22:55:10.59 ID:Tta1cO7U0.net]
GoogleもこれからPWAで攻めてきそうだけどね

755 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 22:59:25.97 ID:Y4GuSkwR0.net]
>>732
CSSは宣言型なので、
管理対象の状態数が減るんですよ

756 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 23:00:35.30 ID:Y4GuSkwR0.net]
>>731
> 賢いプログラマはどうDOM操作すれば最適かなどという生産性のない仕事をフレームワークに任せる

もっと賢いプログラマは、必要なことしかしないんだよ。
Aを変えたいなら、Aだけを変えましょう。ってね

757 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 23:01:50.74 ID:N/E4f3Caa.net]
>>734
domの状態数は多すぎるよ

758 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 23:04:15.56 ID:N/E4f3Caa.net]
>>735
見えるか見えないかみたいな、ただの論理値を管理したいだけなのに
それをわざわざdom/cssの物理構造に縛られた迂遠な方法で管理するのは確かに賢くないな

759 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 23:09:46.27 ID:oTfLqBj1a.net]
まあ本当に賢いプログラマ達はフロントエンドなんてやらないんですけどね

760 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 23:11:14.61 ID:N/E4f3Caa.net]
>>738
それは同意

761 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 23:12:46.45 ID:Y4GuSkwR0.net]
AしたらBを変えたいんですが?

Reactを使うと・・・・



ではBを変数に結びつけましょう。
そういうコードを書き換えます。
そうすれば変数を変えればBも変わります。
おっと待ってください。
そのために変数をSTOREに入れなければいけません。
STOREからとってきて、STOREを更新・・・いえいえいけません
新しくオブジェクトを作るのです。
そのオブジェクトを作るために〜
オブジェクトを変更する関数を用意するのです!
その関数を作るための、はい、メッセージが必要ですね。

えぇ、ですからね、AしたらAction Creatorを使ってactionを生成して
Storeに対してactinonをDispatchして、ReducerがDispatchに反応して
actionタイプから今の状態から新しい状態を変更すれば、
ほら簡単にBが変わるんです!

え?普通にAイベントのハンドラでBを変えればいいじゃないかって?

ムキー!



762 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 23:14:47.91 ID:Y4GuSkwR0.net]
>>737
> それをわざわざdom/cssの物理構造に縛られた迂遠な方法で管理するのは確かに賢くないな

だから、CSSを使うといいですね。
JavaScirptからは親となる要素にクラスを設定するだけなんですよ。
簡単。DOMがどういう構造になっているかなんて関係ない。

あとはデザインを作る人が、その状態でどう表示したいかを作るだけなんです。

763 名前:デフォルトの名無しさん [2019/03/07(木) 23:23:16.99 ID:jEbiMY7gr.net]
fluxの概念を取り入れたらものすごく簡単に状態管理ができる!
って本にもキータにもみんな書いてるんだけど?

764 名前:デフォルトの名無しさん mailto:sage [2019/03/07(木) 23:23:24.15 ID:N/E4f3Caa.net]
>>741
私が管理したいのは見えるか見えないかという2つの純粋な状態なんです
ブーリアンで済むものをわざわざスタイルシートやらクラスなどといった迂遠な方法で管理したくないんです
それはまるで物体から投影された影に干渉して、もとの物体を操ろうとするような愚かなことです

765 名前:デフォルトの名無しさん [2019/03/07(木) 23:58:03.68 ID:tvHZX0HA0.net]
どっちも極端じゃないか?
バインディングならjQueryよりはVueやReact使った方がいいと思うけど、
表示非表示やアニメーションならcss側でやった方がいいと思う。

766 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 00:38:11.11 ID:kMybevyH0.net]
仮想DOMとJQueryの世代の重要な違いとして
セレクタやDOM操作を一切したくないという発想があるのではないだろうか
JSXでHTMLをそのまま書くのもセレクタを使いたくないからだろうし

767 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 00:47:24.38 ID:N66/0TP00.net]
実DOM では、IO 操作が遅い

仮想DOMでは、JavaScript内の操作だけだから、速い

768 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 01:03:32.93 ID:kMybevyH0.net]
それはHTMLFragmentがあれば事足りる話っしょ

769 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 10:15:11.65 ID:jbQifWXg0.net]
>>743
> ブーリアンで済むものをわざわざスタイルシートやらクラスなどといった迂遠な方法で管理したくないんです

だからセレクタのクラスはブーリアンなんだよ

ある要素に、flagクラスというブーリアン値が
立っているか、立っていないか

770 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 10:16:08.10 ID:jbQifWXg0.net]
>>746
仮想DOMを実DOMに反映させる所で
大幅に遅くなるんだよ

771 名前:デフォルトの名無しさん [2019/03/08(金) 11:13:41.54 ID:/TYC9ex30.net]
>>725
リアクティブだと一行で終わるよね。単に変数をfalseにするだけ。ミスしようがない。うーん、なんでjQueryやcssにそこまでこだわるかね。みんな散々苦労してきた末のスマートな解決方法が仮想domでありリアクティブなんだけどな。一度試してみたら?食わず嫌いしないでさ。



772 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 11:17:51.39 ID:jbQifWXg0.net]
> リアクティブだと一行で終わるよね。単に変数をfalseにするだけ。

終わらねーよw 変数みてデザインを変えるコードを書かないとだめだろ

773 名前:デフォルトの名無しさん [2019/03/08(金) 11:28:53.74 ID:/TYC9ex30.net]
>>751
そう、まさにそこがキモ。ロジックとuiが綺麗に分離されてる。
Falseになった結果どうなるかはuiの管轄でcssやdomとは本来無関係なんだよ。jQueryはそこが分離できない。

774 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 11:35:19.90 ID:jbQifWXg0.net]
> そう、まさにそこがキモ。ロジックとuiが綺麗に分離されてる。

別れてないよ。JavaScriptファイルを編集してもらわないといけない

CSSだと「プログラマの俺は、この要素のクラスを設定するだけです。
デザイナーさん、あとはかっこいいデザインを作ってください!」といえる

デザイナーはJavaScriptファイルを一切触らずに
デザインを作り込むことができる。

775 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 11:40:36.85 ID:jbQifWXg0.net]
jQueryで書く場合はこんな感じだね。

$('.my-component [name="switch"]').change(function() {
 $(this).closest('.my-component').toggleClass('active', this.checked);
});

コンポーネントの中にある名前がswitchのチェックボックスがONになれば
そのコンポーネントがactiveになって、
そのコンポーネント以下のデザインがactive用に変わる

DOMの構成がどうなっているか一切気にする必要がないんだよ。

776 名前:デフォルトの名無しさん [2019/03/08(金) 13:46:44.51 ID:/TYC9ex30.net]
>>753
デザイナはスクリプトをいじる必要全くない。例えば
<div v-if=“isShow”></div>
というテンプレに対してスクリプトでは、
isShow=false
とするだけ。これだけでリアクティブになる。どっちがミスが少ないか分かるだろう?

777 名前:デフォルトの名無しさん [2019/03/08(金) 13:50:05.53 ID:/TYC9ex30.net]
すまん途切れた。どっちがミスが少ないか、分業しやすいか分かると思うんだが、どうかね?

778 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 13:55:12.54 ID:jbQifWXg0.net]
> <div v-if=“isShow”></div>

すいませーん、デザイナーさーん。
今度から、v-ifってのを覚えてくださいー。

いままでCSSで表示切り替えしてたでしょー?
それ、今度からやめてくださいねー。

リ・ア・ク・ト。やり方覚えてくださいね。
やり方変えたんですよ。こっちのやり方にね。
え?他にも色々ありますよ。勉強してくださいー。

779 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 13:57:57.43 ID:kMybevyH0.net]
Javascript(Data/Model) - Javascript(UI/DOM) - HTML/CSS
デザイナーが真ん中の層を如何にやるのかという話だろう
HTML内にv-bindとか属性で埋め込むのもJQueryを書かせるのも同じこと
仮想DOMのフレームワークによって真ん中が無くなったとは言えないだろうし

780 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 14:02:22.95 ID:jbQifWXg0.net]
jQueryはプログラマが使って、
イベントに反応してクラスを変更するだけなんだよ。

あとはDOMの構造とかCSSとか完全にデザイナーに
任せることができる。

デザイナーはデザイナーの流儀でやれるし、
JavaScriptフレームワークの流儀を押し付けることもない

781 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 14:05:09.01 ID:jbQifWXg0.net]
>>758
HTMLのタグはDOMですか?
CSSで指定する色や配置はUIですか?



782 名前:デフォルトの名無しさん [2019/03/08(金) 14:11:29.15 ID:/TYC9ex30.net]
>>758
いや随分コード減るぞ。当然ミスも減る。デザイナも楽になる。
>>757
うむ、リアクティブの方が良い事は理解できたようだね。あとは君がデザイナや上司を説得するんだよ。そこは別問題。

783 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 14:12:44.22 ID:kMybevyH0.net]
jQueryはすべてデザイナーがやるべき
ボタンをクリックしたらどのタグの色が変わるのか、それを知っているのはデザイナーだけで良い

784 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 14:20:09.62 ID:jbQifWXg0.net]
>>761
> いや随分コード減るぞ。当然ミスも減る。デザイナも楽になる。

jQueryの方が少ないですね。

嘘だと思うならこれ同じことを実際に動くのに必要な分、書いてみてください。

[JavaScript]
$('.my-component [name="switch"]').change(function() {
 $(this).closest('.my-component').toggleClass('active', this.checked);
});

[HTML]
<div class="my-component">
 <input type="checkbox" name="switch">switch
</div>

[CSS]
.my-component.active {
color: red;
}

jQuery版の実際に動くコードですよ。
https://jsfiddle.net/eu2wm3tk/

785 名前:デフォルトの名無しさん [2019/03/08(金) 14:20:12.96 ID:mjBCJk3zr.net]
ほらほらだからこうなるって何度も言っただろ
フロントはフルスタックじゃないとこの程度ですら揉めるんだよ
もう一度言うぞ

デザインできないフロントエンジニアはクソ
エンジニアリングできないフロントデザイナーはクソ

お前ら言い争ってる時点で無能だと自覚しろ

786 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 14:20:13.82 ID:kMybevyH0.net]
>>761
>いや随分コード減るぞ。当然ミスも減る。デザイナも楽になる。
そう、デザイン側のJSコードは減る。

787 名前:それはたしかだし、データ側JSとの繋ぎかたもはっきりとするね
欠点はHTML内に変なのをたくさん突っ込むのはいかがなものかってことかな
[]
[ここ壊れてます]

788 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 14:20:59.66 ID:jbQifWXg0.net]
>>762
> jQueryはすべてデザイナーがやるべき
JavaScriptのライブラリなのにデザイナーって意味不明w

ボタンを押したら、ここのタグにこういうクラスがつきます。
って伝えるだけで、あとはそれぞれ作業ができる。

これが分業っていうんだよ。

789 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 14:28:57.63 ID:B/j0V0h2a.net]
>>757
どっちかというとその場合デザイナーに必要なのはv-showじゃなくてisShowだから
どういうモードの時変数の設定値を何にすべきかという一覧表があればいいだけじゃね?
てかその辺のコード化はデザイナーじゃなくてフロントエンジニアの仕事だろ

790 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 14:31:25.36 ID:jbQifWXg0.net]
> てかその辺のコード化はデザイナーじゃなくてフロントエンジニアの仕事だろ
フロントエンジニアがHTMLを書くから
分業できないってことなんですよ

791 名前:デフォルトの名無しさん [2019/03/08(金) 14:33:21.35 ID:mjBCJk3zr.net]
>>757
いや、お前がデザイン覚えろよwwww



792 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 14:36:15.92 ID:kMybevyH0.net]
>>766
プログラマーはcssに書かれたclassの名前まで知らなくていい
その方がデザイナーが変更してもプログラマーが対応しなくて済むだろ?

793 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 14:54:21.66 ID:B/j0V0h2a.net]
デザイナーはロジックレスな一枚ずつのhtmlと画像素材のcss作ってりゃそれでいいじゃん

794 名前:デフォルトの名無しさん [2019/03/08(金) 14:58:33.92 ID:kvsQt7Fnr.net]
UI・UXやインタラクションはエンジニアがやる分野
世界的にもその方向性になってきている
しかし世界中のエンジニアは無能だからまともにデザインできない
ごく簡単なUIすら理解できない

終わってんだろ

795 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 15:02:21.59 ID:B/j0V0h2a.net]
最低限のモダンっぽい見た目でいいならもうcssフレームワークのどれかでもいいだろ

796 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 15:07:22.44 ID:jbQifWXg0.net]
>>769
> いや、お前がデザイン覚えろよwwww

分業するんだよ

797 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 15:08:44.58 ID:jbQifWXg0.net]
>>770
分業っていうのは、完全に相手のことを知らないで
できるわけじゃないんだよ。

必要最小限、クラス名だけ。

jQuery使って、HTMLとCSSを正しく使うだけで
最小限の連絡で、それぞれが開発できるんだよ。

798 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 15:11:41.12 ID:jbQifWXg0.net]
>>771
> デザイナーはロジックレスな一枚ずつのhtmlと画像素材のcss作ってりゃそれでいいじゃん

コンポーネントには状態があるんだから、
少なくともその状態ごとのデザインは作ってもらわないと困る。

で、どうやるかというと、お互いで決めたルール
コンポーネントのここに、こういうクラスがつきますよー
というルールに基づいて

デザイナーは、HTMLのコンポーネントのタグに
classを変更するだけなんだよ。
最終的にはJavaScriptでクラスを変更することになるが
開発中は、手書きでクラスを変更するだけ

超簡単

799 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 15:13:04.69 ID:kMybevyH0.net]
>>772
いやUI・UXはデザイナーがやるべきだろ
そこで分離するからおかしなことになってる

800 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 15:15:10.57 ID:B/j0V0h2a.net]
デザイナーに求めるものなんて最低限なら画像データだっていい
html形式でブラウザで表示できるなら大助かり
期日が守れないヤツ多いから最低限期日までにどっちか出してくれればそれ以上に求める事なんてねぇんだが

801 名前:デフォルトの名無しさん [2019/03/08(金) 16:28:21.11 ID:/TYC9ex30.net]
>>763
くわー面倒だなあ。でもコード見ないと分からんか。

[JavaScript]
isActive=false

[HTML]
<div class="my-component" class=“{active:isActive}”>
<input type="checkbox” v-model=“isActive”>switch
</div>

[css]
変更なし

どう?君のコードより随分少ないだろ。特にscriptなんて変数一個で終わり。まだ分からない事あるなら聞いてみなよ。でもスマホ手打ちなんで面倒なのはやめてw



802 名前:デフォルトの名無しさん [2019/03/08(金) 16:38:37.56 ID:/TYC9ex30.net]
おっとミスった。スマホ手打ちなんですまんね。

[HTML]
<div class="my-component" class=“{active:isActive}”>
正しくは
<div class="my-component" :class=“{active:isActive}”>
:が抜けてたよ。

803 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 16:49:32.55 ID:oNzvowiX0.net]
>>779
あのさぁ、動かないコード書かないでくれないか?
scriptタグまでは書かなくていいよ。jQueryでも書いてないからさ、
でも動くコード書いてっていったよね?
せめてjsfiddleで動かしてから来てよ

804 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 16:54:12.44 ID:oNzvowiX0.net]
なんか動くって嘘つきそうだから
>>779では動かないという証拠として
>>779の内容を https://jsfiddle.net/b5xusp1d/ に書いておいたから

ほら動かないでしょ?
これを動くように修正してね。

jQuery版の実際に動くコードですよ。
https://jsfiddle.net/eu2wm3tk/

805 名前:デフォルトの名無しさん [2019/03/08(金) 16:55:22.77 ID:/TYC9ex30.net]
>>781
それは贅沢だなw。こっちはスマホだと言うのに。あ、そうか君はvue知らないから動作チェックできないのか。どうせなら入れてみたら?簡単だよ。
あとコードは短くなった訳だが感想はどうかね?

806 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 16:55:35.67 ID:oNzvowiX0.net]
ほんとなんですぐばれる嘘を作るんだろう?
理解できないな

807 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 16:56:30.27 ID:oNzvowiX0.net]
>>783
だから動かないって
証拠>>782にかいたからさ。
お前がスマホとか知らんわ

スマホだから動かなくてもいいでしょ?
嘘だけど、いいでしょとか。恥ずかしくないの?

808 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 16:58:49.01 ID:oNzvowiX0.net]
あ、ReactじゃなくてVueか。

はい、こっちにVue読み込んだの置いたからさ、
こっちも動かない。はぁ。動かない(笑)

https://jsfiddle.net/zvft0qo8/

809 名前:デフォルトの名無しさん [2019/03/08(金) 17:01:09.95 ID:/TYC9ex30.net]
>>786
書き方間違えてるぞ。vue初期からしなきゃ動かんよw

810 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 17:01:40.94 ID:oNzvowiX0.net]
あともう一つ教えといてあげるよ。

作ったのは.my-componentなんだ。コンポーネント。再利用可能。

つまりな、HTMLをこう書くだけで
同じ動きがするコンポーネント増やせるのよ。jQuery版は。
ここまでやってくれよ

<div class="my-component">
 <input type="checkbox" name="switch">switch1
</div>

<div class="my-component">
 <input type="checkbox" name="switch">switch2
</div>

<div class="my-component">
 <input type="checkbox" name="switch">switch3
</div>


https://jsfiddle.net/zygq0r56/

811 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 17:02:12.51 ID:oNzvowiX0.net]
>>787
書き方間違えてるって。
動くコード書いてないお前の落ち度じゃん



812 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 17:07:56.77 ID:oNzvowiX0.net]
vueは面倒だなーって思いながら、

vue初期からしなきゃ動かんよw

と指摘された点を
今書いてるのかな?w

813 名前:デフォルトの名無しさん [2019/03/08(金) 17:08:24.75 ID:/TYC9ex30.net]
>>789
おいおい、vue知らないのに勝手にアップして動かないと言うのは無しだろ。知らないなら知らないと言えば教えてあげるのに。初期化方法までは面倒みれんぞ。jQueryだってそうだろ?
まあいいよ、後で動作する奴を上げてあげるよ。

814 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 17:12:52.61 ID:oNzvowiX0.net]
> jQueryだってそうだろ

何言ってるんだ?
jsfiddleにはまさにこれだけのコードしか書いてないんだが?

$('.my-component [name="switch"]').change(function() {
 $(this).closest('.my-component').toggleClass('active', this.checked);
});

いやまさかそんなこと、ありえるなんて思いもしなかった!
レベルなのか?w

815 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 17:15:48.86 ID:oNzvowiX0.net]
ついでだからちょっと改造

$('.my-component [name="switch"]').change(function() {
 $(this).closest('.my-component').toggleClass('active', this.checked);
});

は .my-component が 2回でてきてDRYじゃないんで
1回で書く方法

$('.my-component').on('change', '[name="switch"]', function(event) {
 $(event.delegateTarget).toggleClass('active', this.checked);
});

https://jsfiddle.net/tk5yvs3g/

816 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 17:19:36.99 ID:oNzvowiX0.net]
>>791
> まあいいよ、後で動作する奴を上げてあげるよ。

じゃあHTML側はこれ相当でお願いね。
コンポーネントは3つ。

<div class="my-component">
 <input type="checkbox" name="switch">switch1
</div>

<div class="my-component">
 <input type="checkbox" name="switch">switch2
</div>

<div class="my-component">
 <input type="checkbox" name="switch">switch3
</div>

817 名前:デフォルトの名無しさん [2019/03/08(金) 17:59:49.58 ID:/TYC9ex30.net]
>>794
ふう、やっとPCの前に戻ってきた。というわけでちょっと上げてみた。ブラウザから5ch書き込むの久しぶりだわw。
https://codepen.io/hinoragi/pen/YgVQjK

簡単にテンプレート化してコンポーネント化もしといた。何か分からないことあるなら遠慮なく質問してよ。ちょっと用事あるから次は10時ぐらいにスレみる予定。

818 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 18:05:40.88 ID:oNzvowiX0.net]
[jQuery]
$('.my-component [name="switch"]').change(function() {
 $(this).closest('.my-component').toggleClass('active', this.checked);
});

[Vue]
Vue.component('my-component',{
template:`
<div class="my-component" :class="{active:isActive}">
<input type="checkbox" v-model="isActive">{{val}}
</div>
`,
data:function(){return{
isActive:false
}},
props:["val"]
})
new Vue({el: '#app'})


あ、デザイナーさん。HTMLはVueのコードに移動したんで
デザイン変えた

819 名前:ォゃVueの方いじってくださいねwww

やっぱりこうなるw
[]
[ここ壊れてます]

820 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 18:07:11.66 ID:oNzvowiX0.net]
[jQuery] 3行
$('.my-component [name="switch"]').change(function() {
 $(this).closest('.my-component').toggleClass('active', this.checked);
});

[Vue] 12行
Vue.component('my-component',{
 template:`
  <div class="my-component" :class="{active:isActive}">
  <input type="checkbox" v-model="isActive">{{val}}
  </div>
 `,
 data:function(){return{
  isActive:false
 }},
 props:["val"]
})
new Vue({el: '#app'})

あ、デザイナーさん。HTMLはVueのコードに移動したんで
デザイン変えたきゃVueの方いじってくださいねwww

やっぱりこうなるw


行数は増え、分業ができなくなる

821 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 18:11:58.57 ID:oNzvowiX0.net]
VueはコンポーネントとDOM構造が密接に結びついているから、
以下みたいに、デザイン上の都合などで変えた時の柔軟性がなくなってしまうんだよな。
jQueryならあくまで、my-componentは、中のname=switchがONになったらクラスを変えるってだけで
中身は自由にいろんなものに変更できるというコンポーネントなのに

<div class="my-component">
 <input type="checkbox" name="switch">switch1
 <p>ここはswitch1です</p>
</div>

<div class="my-component">
 <input type="checkbox" name="switch">switch2
 <select>
  <option>1</option>
  <option>2</option>
  <option>3</option>
 </select>
</div>

<div class="my-component">
 <input type="checkbox" name="switch">switch3
 <img src="かっこいい画像.gif">
</div>



822 名前:デフォルトの名無しさん [2019/03/08(金) 18:44:14.67 ID:/TYC9ex30.net]
>>797
気になって覗きに来たら案の定。。うーん、そこから先は話長くなるぞ。一番簡単なサンプルだし、5chでやる規模じゃない。
それより最初の話はどうした?vueの方が随分コード短いぞ。その質問に答える為にサンプル上げたんだが、答えるのが礼儀ってもんだぜ。

823 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 18:49:38.83 ID:oNzvowiX0.net]
>>799
> 気になって覗きに来たら案の定。。うーん、そこから先は話長くなるぞ

jQueryと同じことをするのに、話が長くなるんだへーw

ま結論な。jQueryが3行の所、Vueだと12行になが〜くなりました。
テンプレートのところを除いたとしても7行。jQueryの倍

[jQuery] 3行
$('.my-component [name="switch"]').change(function() {
 $(this).closest('.my-component').toggleClass('active', this.checked);
});

[Vue] 12行
Vue.component('my-component',{
 template:`
  <div class="my-component" :class="{active:isActive}">
  <input type="checkbox" v-model="isActive">{{val}}
  </div>
 `,
 data:function(){return{
  isActive:false
 }},
 props:["val"]
})
new Vue({el: '#app'})

824 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 18:52:05.37 ID:oNzvowiX0.net]
それに一番ひどいのは、やっぱりmy-componentのdivの中身を
デザイナがいじろうとしたら、JavaScriptファイルを修正しなければ
ならなくなるってところなんだよね。
DOMとコードが密接に結びついちゃってる。

825 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 18:56:00.97 ID:oNzvowiX0.net]
jQueryの場合、JavaScriptのコードとDOMの構造は結ぶていてなくて
結びついているのは、.my-componentというクラス名と
input name=switchだけ。だからDOMの構造をどんなに変えても
クラス名とそういう名前のinputがあればいい
コードとDOMの構造が分離されている

826 名前:デフォルトの名無しさん [2019/03/08(金) 19:11:44.53 ID:/TYC9ex30.net]
>>801
やっぱり全く理解できてないじゃん。最初の話に戻すぞ。
最初の例ならスクリプトは、
new vue({data:{isActive:false}})
これだけ。君が分からなくて動かん!!とか騒いでた奴。君のその3行のスクリプトと比べてみなよ。

次に、まあ君はvue知らんからしょうがないがテンプレートは実務では当然外部に持つ。単一ファイルコンポーネントでググれ。

これで聞かれた事は答えたって事で俺からも質問していいか?

さっきからコンポーネントと言ってるが、君のはコンポーネントじゃないだろ。単なるコピペでカプセル化も局所化も無い。サンプルである事を割り引いてもコンポーネントと呼べる内容じゃない、と思うんだが、マジでどう思ってるの?

827 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 19:14:42.43 ID:oNzvowiX0.net]
>>803
> new vue({data:{isActive:false}})

それだけだと、どれと結びついてるのか(=セレクタ)その情報がないだろ。
セレクタを省略して良いんだったら、jQueryだってこの一行だよ。
toggleClass('active', this.checked);

828 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 19:16:38.22 ID:oNzvowiX0.net]
いや、値を変えるコードすら無いかw
jQueryだとこれだなw Vueより断然短い
'active'

829 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 19:23:09.87 ID:oNzvowiX0.net]
> 最初の例ならスクリプトは、
> new vue({data:{isActive:false}})
> これだけ。

これだけで動く!(=動かない)

これなんて詐欺?w

830 名前:デフォルトの名無しさん [2019/03/08(金) 19:25:20.00 ID:/TYC9ex30.net]
>>804
がーん、ここまで書いても分からんか。それ動作せんだろ。。自分で言った様に動作するコードで比較しようぜ!!
それと、俺は君を責めてる訳じゃなんだぜ。長年jQueryには世話になったから、優秀なライブラリだとよく知ってる。でもここはvue react angularスレだろ。jQueryはややすれ違いなんだよ。でもまあお互いの長所短所を比較しつつ、まったり雑談しようや。

831 名前:デフォルトの名無しさん [2019/03/08(金) 19:26:43.19 ID:/TYC9ex30.net]
>>806
wwワザとか?vue本体ロードしなはれよ。



832 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 19:29:20.37 ID:oNzvowiX0.net]
>>808
はい。動かない証拠。vue本体は前の人がロードしてますよーw
https://codepen.io/anon/pen/MxmrjP

833 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 19:30:11.51 ID:oNzvowiX0.net]
>>807
だから動作しないコードを出して
これだけって嘘を付くのをやめろって言ってるんだが、

これだけって、どこまでごこれだけなんd?
動作しないコードまでがこれだけか。

834 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 19:30:33.50 ID:oNzvowiX0.net]
これだけって、どこまでがこれだけなんだ?
動作しないコードまでがこれだけか。

835 名前:デフォルトの名無しさん [2019/03/08(金) 19:35:01.38 ID:YjtKBzOFM.net]
はあ、、分かった分かった。最初の例で動く奴上げてやるよ。出先でだから1時間後な。

で、その間に俺の質問にも答えてくれ。君のコードは再利用できないし、コンポーネントではない。どう再利用するつもりなの?そのむき出しのmy-conponentで。

836 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 19:37:01.18 ID:oNzvowiX0.net]
見ての通りjQueryだと、HTMLがJavaScriptに全く汚染されていない。
JavaScriptの臭いがないクリーンなHTMLなんだよ。だから分業ができる。

<div class="my-component">
 <input type="checkbox" name="switch">switch1
</div>

Vue使ったら、HTMLが謎の汚染(HTML書いてる人には意味不明なもの)が発生し

1. :class="{active:isActive}"
2. v-model="isActive"

HTMLコードはJavaScriptファイルに移動してしまうし、
上のコードだけじゃ足りないから

 data:function(){
  return{
   isActive:false
  }
 },
 props:["val"]

というコードが追加で必要になるし。
もちろん .my-componentと結びつけるために
Vue.component('my-component',{
という一行が必要になるし、HTMLはmy-componentとかいうHTML書いてる人は知らないタグを使うように強制され
属性が名前になるんですよーとか、新たなルールを押し付けられることになってる。

837 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 19:39:05.43 ID:oNzvowiX0.net]
>>812
> で、その間に俺の質問にも答えてくれ。君のコードは再利用できないし、コンポーネントではない。どう再利用するつもりなの?そのむき出しのmy-conponentで。

普通に再利用できてるんだが?
そもそもjQueryのコードは状態を保持していない。

わかるか?jQueryのコードには状態がない。
状態は、HTMLのタグに存在している。

だからHTMLのタグの分だけインスタンスが存在しているようなもので、
普通に再利用できる。

838 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 19:43:49.07 ID:oNzvowiX0.net]
Vueの場合、コンポーネントが状態を持ってしまってる。
isActiveという変数のことな。

状態を持ったisActiveを共有することは出来ないから、
新た無いHTMLのタグを作らければいけなくなってしまっている。

そしてisActiveという事実上のローカル変数を参照するために、
JavaScript側でHTMLを書くしかなくなってしまっている

HTMLがガッツリJavaScriptと結びついてしまっているわけだ

839 名前:デフォルトの名無しさん [2019/03/08(金) 20:00:52.98 ID:YjtKBzOFM.net]
>>815
どこから突っ込めばいいんだ。。

> Vueの場合、コンポーネントが状態を持ってしまってる。
> isActiveという変数のことな。

コンポーネントは状態持つものだよ。いや認識の相違とかじゃなく普通に。そして隠蔽されるべきもの。

> 状態を持ったisActiveを共有することは出来ないから、

普通に参照できる。

> そしてisActiveという事実上のローカル変数を参照するために、
> JavaScript側でHTMLを書くしかなくなってしまっている

単一ファイルコンポーネント。

> HTMLがガッツリJavaScriptと結びついてしまっているわけだ

まさかと思うがサンプルのtemplate見て言ってる?結びつくの真意が分からんがjQueryも結びついてるだろ。

840 名前:デフォルトの名無しさん [2019/03/08(金) 20:09:37.29 ID:YjtKBzOFM.net]
いいよ、もう少し分かりやすい質問しよう。
コンポーネントの要素として、簡単に テンプレート、css、jsがあるとしよう。3つ合わせてコンポーネントね。これらは外部から容易に参照できてはいけないし、干渉されてはいけない、複製も容易でないとダメ。
君のやり方で、my-componentをどうコンポーネント化するのか例示して欲しい。

841 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 20:19:23.19 ID:QXTI5KI7a.net]
わかった

Delphi使え



842 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 20:35:47.91 ID:oNzvowiX0.net]
>>817
何が言いたいのかわからん。

CSSで div { color: red } って書いても
影響を受けないようになんて、Vueでもできないだろ

843 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 20:36:44.19 ID:oNzvowiX0.net]
>>816
> まさかと思うがサンプルのtemplate見て言ってる?結びつくの真意が分からんがjQueryも結びついてるだろ。

jQueryでは結びつかない。

<div class="my-component">
 <input type="checkbox" name="switch">switch1
</div>

↑どこにjQuery関連のものがあるか言ってみな

844 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 20:43:00.51 ID:oNzvowiX0.net]


845 名前:> Vueの場合、コンポーネントが状態を持ってしまってる。
> isActiveという変数のことな。

訂正

Vueの場合、JavaScriptのコードが状態を持ってしまってる。
isActiveという変数のことな。

だからDOMとJavaScriptのインスタンスを一対一で
紐付けなければならなくなってる。密接に結びついている。

jQueryの場合JavaScriptのコードでは状態を持たないから、
DOMが一つだろうと複数だろうが、処理を共有化できる。
[]
[ここ壊れてます]

846 名前:デフォルトの名無しさん [2019/03/08(金) 21:16:27.20 ID:kvsQt7Fnr.net]
デザインやUI・UX、インタラクションが実装できないクソエンジニアどもがギャーギャー騒いでる
お前ら自分の無能さを披露して恥ずかしくねえの?

フロントやるならデザイン込みでUIくらいやれや
クソみたいなUI作ってんじゃねえよ

847 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 21:19:25.25 ID:oNzvowiX0.net]
餅は餅屋

848 名前:デフォルトの名無しさん [2019/03/08(金) 21:31:02.59 ID:/TYC9ex30.net]
ただいまー。という訳で最初の質問の答えアップだよ。
https://codepen.io/hinoragi/pen/jJmzJG
なんの質問か忘れてるだろうから、君の763の質問引用するよ。

>jQueryの方が少ないですね。
>嘘だと思うならこれ同じことを実際に動くのに必要な分、書いてみてください。
>$('.my-component [name="switch"]').change(function() {
> $(this).closest('.my-component').toggleClass('active', this.checked);
>});
jsfiddle.net/tk5yvs3g/

で答えがこれね。

new Vue({
el: '#app',
data: {isActive:false},
})

どう?まあこんな短いサンプルで比較するのもどうやねんってのは分かるけど質問にはちゃんと答えたよ。
html含めても確実にvueの方が少ないよね。
あと少しはvueやreact勉強しようよ。こんな短いサンプルの初期化方法すら知らなかった訳で、知らないからって全力否定するのはどうなのって思うぞ。

849 名前:デフォルトの名無しさん [2019/03/08(金) 21:36:39.46 ID:kvsQt7Fnr.net]
デザインできてUIUXできるようになれば引く手数多だぞ
ほんとフルスタックはほとんどいないから
年収は最低でも1000万はいく

850 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 21:40:42.36 ID:NeLzfZqe0.net]
静的なWebページがあってそこにちょっと動きを付ける程度ならjQueryがお手軽。まぁそうだな。

851 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 22:04:03.93 ID:oNzvowiX0.net]
>>824
my-componentの外に、置いたinputでも動くし、
my-componentを複数置いたら、おかしくなるし、
お前馬鹿なの? 少しは書く前に頭使ったら?



852 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 22:19:01.08 ID:JZ/onRPtM.net]
行数連呼しといてそりゃねえだろ

853 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 22:29:51.19 ID:i92SBzwIa.net]
やっとReduxがちゃんと分かってきた

けどActionって関数にする必要ってなんのためなの?
constの定数でもいいような気もするんだけど

854 名前:デフォルトの名無しさん mailto:sage [2019/03/08(金) 23:22:07.35 ID:8MLFoUZt0.net]
まさか知らないで叩いてたとはなぁ

855 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 00:19:50.47 ID:/m10ZyJL0.net]
UIUXが複雑化すればデザインと密接になり、デザインがやるべきことになる
昔ながらのショッピングカートならそうでもないかもしれんがw

856 名前:デフォルトの名無しさん [2019/03/09(土) 00:31:16.43 ID:e9DsS9n/0.net]
>>827
> my-componentの外に、置いたinputでも動くし、
> my-componentを複数置いたら、おかしくなるし、
> お前馬鹿なの? 少しは書く前に頭使ったら?

君は本当成長ないね。過ちは認めようよ。俺は君の質問に的確に答えたよ。同じ動作をするより短いサンプルだろ。その返しがこれって、そんなに負けが認められんか。だから駄目なんだよなあ。。

あと批判するなら少しはvueやreact勉強してから述べような。俺もまさかど素人が批判してるとは思わなかった。当然ある程度は知ってて、それ故に批判すると思うじゃん常識的に考えてさ。そこはすまん。思い至らなかった。次からはスルーするよ。おやすみぃ。

857 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 00:48:24.43 ID:RYW8IiyE0.net]
同じ動作してないよね。
my-componentの外に、置いたinputでも動くし、
my-componentを複数置いたら、おかしくなるし、
お前馬鹿なの? 少しは書く前に頭使ったら?
そんなにjQueryよりもVueの方が長くなることが許せないの?
事実を受け入れようよw

858 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 00:53:19.31 ID:zxiwPMOw0.net]
なんでjQueryの動作を真似ることが前提なんだよ
言ってることめちゃくちゃじゃん

859 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 00:58:02.98 ID:RYW8IiyE0.net]
> なんでjQueryの動作を真似ることが前提なんだよ

お前言ってることがおかしい。

$('.my-component [name="switch"]').change(function() {
 $(this).closest('.my-component').toggleClass('active', this.checked);
});

これと同じことを実現するという話で、
これというのは、.my-component(クラスなのだから当然)中の [name="switch"]'からの
イベントで.my-component に active クラスを

860 名前:つけるというものなんだから、
最低限の条件を満たしてない
[]
[ここ壊れてます]

861 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 00:58:26.63 ID:RYW8IiyE0.net]
訂正

これというのは、.my-component(クラスなのだから当然複数ある)中の [name="switch"]'からの



862 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 01:00:24.50 ID:RYW8IiyE0.net]
.my-component(クラスなのだから当然)中の [name="switch"]'からの
イベントで.my-component に active クラスをつける
というお題で、複数対応していなければ突っ込まれるのは当たり前だし
お題を満たせばVueのコードはこんなに長くなる。

Vue.component('my-component',{
 template:`
  <div class="my-component" :class="{active:isActive}">
  <input type="checkbox" v-model="isActive">{{val}}
  </div>
 `,
 data:function(){
  return{
   isActive:false
  }
 },
 props:["val"]
})
new Vue({el: '#app'})

863 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 01:02:17.14 ID:RYW8IiyE0.net]
しかもこれ

  <div class="my-component" :class="{active:isActive}">
  <input type="checkbox" v-model="isActive">{{val}}
  </div>

という固定のDOM構造にしか使えないので
jQueryよりも劣っている

jQueryだとHTML(DOM構造)を自由に変更できる。
以下のどのように変更しようとも、JavaScriptのコードは変更の必要はない

<div class="my-component">
 <input type="checkbox" name="switch">switch1
 <p>ここはswitch1です</p>
</div>

<div class="my-component">
 <input type="checkbox" name="switch">switch2
 <select>
  <option>1</option>
  <option>2</option>
  <option>3</option>
 </select>
</div>

<div class="my-component">
 <input type="checkbox" name="switch">switch3
 <img src="かっこいい画像.gif">
</div>

864 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 01:02:49.95 ID:N2GlqC3/0.net]
こんなところにクソコードベタ貼りしてないでCodesandboxで動くソースでも書いてからリンク貼れよ

865 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 01:04:30.20 ID:RYW8IiyE0.net]
>>838の実際に動くコードはこちら

jsfiddle.net/rhp9dvya/

これと同じことをVueで実現するコードは
更に長くなる

866 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 01:11:28.76 ID:zxiwPMOw0.net]
はっきり言うけどさ
中のinputまで丸ごとコピペしないと動かないコンポーネントとかコンポーネントじゃねえよ
jQueryならDOM構造は気にしなくて良かったんじゃないのか

867 名前:デフォルトの名無しさん [2019/03/09(土) 01:36:21.59 ID:ovl4dn3WM.net]
最後にまとめて答えとくよ。

>>819
> 何が言いたいのかわからん。
> CSSで div { color: red } って書いても
> 影響を受けないようになんて、Vueでもできないだろ

できる。scopedでググるか、詳しくはvueの公式見よう。

>>820
> jQueryでは結びつかない。
> <div class="my-component">
>  <input type="checkbox" name="switch">switch1
> </div>
> ↑どこにjQuery関連のものがあるか言ってみな

そこは結びつかなきゃ困るんだよ。リアクティブなんだから。いちいちon changeイベントの記述なんぞしたくないもの。ねえ、このサンプルで言えばさ、nameがv-modelになるだけだよ?何がそんな嫌なのさ?

868 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 02:04:13.30 ID:MQBXPAS0M.net]
jQueryの人頑張ってるみたいだけど
jQ

869 名前:デフォルトの名無しさん [2019/03/09(土) 02:07:07.23 ID:ovl4dn3WM.net]
>>838

> という固定のDOM構造にしか使えないので
> jQueryよりも劣っている

これが大いなる勘違いなんだがもう説明しない。いいから学べ。

> jQueryだとHTML(DOM構造)を自由に変更できる。
> 以下のどのように変更しようとも、JavaScriptのコードは変更の必要はない

これアンチパターンで混乱の元。カプセル化できないコンポーネントなんぞ不安で使えたもんじゃない。セレクタの影響範囲が広すぎて便利なつもりになってるだけ。将来的なデスマーチが約束された最も最悪な例だと気いて欲しい。

870 名前:デフォルトの名無しさん [2019/03/09(土) 02:21:00.49 ID:ovl4dn3WM.net]
あとさ、いいからjQuery君はスレタイ読もうついでに空気もね。
ココはvue react angularスレだよ。公式のサンプル一つも試した事ないのバレてるのよ??なのにどうやって比較してるの?妄想じゃんそれ。
両方のコード見せて具体的に証明してよ。君の言うjQueryの優位性をさ。そしたら俺もキチンと答えるよ。間違ってたら謝るし。俺もjQueryは散々世話になったから嫌いじゃないのよ?

871 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 02:50:20.05 ID:Tm/Y9JxW0.net]
ただ単に覚えたくないんだよ
新しい言語を 
jQueryは



872 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 03:10:54.41 ID:n56g/PGg0.net]
女子更衣室に堂々とチン入してきて延々巨根自慢をする粗チンバカ

873 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 07:00:21.97 ID:RYW8IiyE0.net]
>>842
> できる。scopedでググるか、詳しくはvueの公式見よう。

scopedは、コンポーネントだけで使えるCSSであって
外部からの影響を受けないようにするものじゃないよ
素人かよw

> そこは結びつかなきゃ困るんだよ。リアクティブなんだから。
理由は?w

874 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 07:01:33.11 ID:RYW8IiyE0.net]
>>845
> 両方のコード見せて具体的に証明してよ。君の言うjQueryの優位性をさ。

jQueryの動くコード
jsfiddle.net/rhp9dvya/

Vueの動くコードはでてない。
my-componentの外に、置いたinputでも動くし、
my-componentを複数置いたら、おかしくなる
というクソコードしか出てない

875 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 07:05:56.25 ID:RYW8IiyE0.net]
リアクティブなんだから!(自分で言っていて意味わかっていない)


↑ぷぎゃーw

876 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 07:06:59.38 ID:RYW8IiyE0.net]
> nameがv-modelになるだけだよ?何がそんな嫌なのさ?

デザイナーの世界にないVue(JavaScript)専用の概念を
持ち込むことだね。

877 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 07:17:14 ]
[ここ壊れてます]

878 名前:.04 ID:zxiwPMOw0.net mailto: だからおかしくて当然なんだって
勝手にコンポーネントと名乗ってるだけでそれコンポーネントじゃないから
ただのjQuery特有の動作だから
[]
[ここ壊れてます]

879 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 07:18:18.22 ID:RYW8IiyE0.net]
Vueのコンポーネントだけが
正しいコンポーネントだとか
恥ずかしいよ?

880 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 07:22:27.20 ID:zxiwPMOw0.net]
でもあなたはjQueryの正しいコンポーネントが再現出来ないからクソコードって言うんでしょ
恥ずかしくないの?

881 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 07:26:00.83 ID:RYW8IiyE0.net]
jQueryの場合というか、コンポーネントというのは別にjQueryの用語ではなく
単にHTML(DOM)の構造によって形作られたものに過ぎない。
専門用語ではなく、単なる英語としてのコンポーネント

この場合のmy-componentというのは、my-componentというクラス名から始まり
内部にname="switch"があるというコンポーネント
my-componentの条件はこれだけだから、DOMの構造はHTMLを修正するだけで柔軟に変更できる。

デザイナはこの条件を守っている限りHTML(CSS)を変更し自由にデザインできるし、
プログラマもデザインが変わってもJavaScriptコードを変更する必要がなくなる。
デザイナの担当とプログラマの担当、つまり修正するファイルが明確に分かれているのも良い
どちらも自分の担当するファイルを自由に変更できるから分業することも容易になっている



882 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 07:29:39.24 ID:RYW8IiyE0.net]
>>854
いや、常識的な仕様を守ってないからクソコードって言ってるんだよw

new Vue({
el: '#app',
data: {isActive:false},
})

これだけでできると言ったくせに

<div id="app">
<div class="my-component" :class="{active:isActive}">
<input type="checkbox" v-model="isActive">abc
</div>
<input type="checkbox" v-model="isActive">abc ←ここを押しても反応する

<div class="my-component" :class="{active:isActive}">
<input type="checkbox" v-model="isActive">abc ←ここを押したら全部反応する
</div>
</div>

はい、Vue側のコード。これだけって言ったんだから、これだけでやってみせろやw
https://codepen.io/anon/pen/BbZNVM

883 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 07:45:09.02 ID:RYW8IiyE0.net]
ここで(HTML側を自由変更できないとはいえ)複数置いても問題ないコードを
書いてるから常識的な仕様ぐらい理解してると思うんだよねw
https://codepen.io/hinoragi/pen/YgVQjK

でもそれだとVueの方がjQueryよりも大幅に長くなっちゃったから
これだけでできる!(←まともに動かない)

と騙そうとしたんだろうね。
でもバレちゃったw

884 名前:デフォルトの名無しさん [2019/03/09(土) 08:07:35.93 ID:e9DsS9n/0.net]
>>848
アホはお前だろう。。もう少しよく読んで意図把握しよう。
あとやっぱり君はリアクティブ自体理解できてないのがよくわかる。だからもう少し公式読め。

885 名前:デフォルトの名無しさん [2019/03/09(土) 08:10:00.82 ID:e9DsS9n/0.net]
>>849
ほら
自分が書けないからそうやって逃げる。全く進歩しない。分からない事は否定するだけ。いいから自分で勉強証明しなって。見ててやるからさ。

886 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 08:10:39.68 ID:zxiwPMOw0.net]
提示された例がコンポーネントじゃないから当然なんだって
inputが中に2つあっても動いちゃうし無かったら役立たずのmy-componentが残るだけ
綺麗にコピペしないと動かないなんて常識的なコンポーネントの仕様を守ってないよね

887 名前:デフォルトの名無しさん [2019/03/09(土) 08:16:51.61 ID:e9DsS9n/0.net]
>>857
なあ自分で言ってて悲しくならない?
new Vueすら知らない事バレてるんよ君w。俺はもう説明しない。基本すら自学できない奴に教える価値無い。

888 名前:デフォルトの名無しさん [2019/03/09(土) 08:24:01.30 ID:e9DsS9n/0.net]
>>855

> jQueryの場合というか、コンポーネントというのは別にjQueryの用語ではなく
> 単にHTML(DOM)の構造によって形作られたものに過ぎない。
> 専門用語ではなく、単なる英語としてのコンポーネント

無知極まってるぞ。勝手に定義するな。マジで少し勉強して。そんな俺様定義だからあんな再利用できない紛いモノ書くんだよ。

889 名前:デフォルトの名無しさん [2019/03/09(土) 08:28:42.54 ID:e9DsS9n/0.net]
だああ、色々言いたいが出社だ。
いいかiQuery君。君はまずスレチだ。そこをまず理解しろ。
その上で書くならせめてjQueryとvue react angularのどれか、2つのコードを比較しながらjQueryの良さを語れ。
それがここに書き込む最低の礼儀じゃね?

890 名前:デフォルトの名無しさん [2019/03/09(土) 08:37:47.27 ID:e9DsS9n/0.net]
最後にもう一回言うぞ。
jQueryのコード置くだけで「だからvueだめなんだよ」コレ止めろ。
基礎だけでもVueを勉強してから発言するのが筋だぜ。でないと話が通じないから困るんだよ。ほらココvueのスレでもあるし。

891 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 09:14:15.58 ID:N2GlqC3/0.net]
>>849
かっこいい画像.gifくらいちゃんと用意しろよ



892 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 09:18:13.96 ID:izNw5U5za.net]
>>851
デザイナーは巣のhtmlだけ書いてくれりゃいいよ
実環境にコードをマージする作業はこっちでやるし

893 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 09:19:00.94 ID:zJdX2n9h0.net]
これは素晴らしい煽り合いだな
お互いコードでやりあうとか
勉強になります

894 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 09:20:39.95 ID:b+N//s300.net]
多分、「jQueryで十分」って主張してる人は、結局SPAの概念が習得出来なかった、あるいはする気のない人じゃない?

最新のフロントエンド開発について行けないから、新しい物の価値を否定して、
自分の相対価値が下がって行くのを阻止したいんじゃないかと。

今後SPAがどうなるかなんて分からないけど、少なくとも新しい事に挑戦もせず、勉強もせず、
自分が理解出来る古い技術にばかりすがるのは、正直エンジニアとしては失格だと思うよ。

そういった人が今すべき事は、不真面目な自分を戒めて勉強に励むか、
あるいはエンジニアとしての死を素直に受け入れて、別の道を模索するかのどっちかにしたらいいんじゃないかと。

895 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 09:22:15.82 ID:ezqy2TGU0.net]
スレチだし
ライブラリとフレームワークを比較する具合が香ばしさ

896 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 09:23:51.52 ID:N2GlqC3/0.net]
>>856
独立タグはちゃんと閉じろよ性格の雑さが出てるぞ
<input />

897 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 09:29:59.29 ID:OAlfgW/Ia.net]
jQueryはデザインの物理的な構造にプログラムが強く依存してしまうから生産性が低い
プログラムがデザインの物理的な構造に依存することを知ってるからデザインも安易に作れない(プログラムから扱えるようにするために物理的な制約が生まれる)

VueはVMを使ってロジックとデザインを明確に分離してるのでそういった不都合はかなり軽減される
全くないとは言わないがね

898 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 10:53:00.46 ID:RYW8IiyE0.net]
>>870
それが必要なのはXHTML。HTML5では、/>は許容されるが
タグを閉じるという意味はなく単に無視されるという扱い。

899 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 10:53:39.13 ID:RYW8IiyE0.net]
もう一回載せようか? はやくこれだけで作って欲しいんだが

>>854
いや、常識的な仕様を守ってないからクソコードって言ってるんだよw

new Vue({
el: '#app',
data: {isActive:false},
})

これだけでできると言ったくせに

<div id="app">
<div class="my-component" :class="{active:isActive}">
<input type="checkbox" v-model="isActive">abc
</div>
<input type="checkbox" v-model="isActive">abc ←ここを押しても反応する

<div class="my-component" :class="{active:isActive}">
<input type="checkbox" v-model="isActive">abc ←ここを押したら全部反応する
</div>
</div>

はい、Vue側のコード。これだけって言ったんだから、これだけでやってみせろやw
https://codepen.io/anon/pen/BbZNVM

900 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 11:15:35.75 ID:/2BHRI8Ma.net]
素人w

901 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 11:19:10.07 ID:OAlfgW/Ia.net]
Vue(というかMVVM)の素晴らしいところはjavascript側はhtml/css側がどうなってるのか知らなくてもいいところ
そしてhtml/css側はjavascript側がどうなっているか最小限の知識で済むこと

jQueryではお互いがお互いに対する知識を多く必要としているため結合が非常に強くなってしまう
これでは分業は難しい



902 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 11:30:18.17 ID:RYW8IiyE0.net]
>>875
嘘はいかんよ

Vue.component('my-component',{
 template:`
  <div class="my-component" :class="{active:isActive}">
  <input type="checkbox" v-model="isActive">{{val}}
  </div>
 `,
 data:function(){
  return{
   isActive:false
  }
 },
 props:["val"]
})
new Vue({el: '#app'})

VueのJavaScriptの中にHTMLが埋め込まれてしまってる

903 名前:デフォルトの名無しさん [2019/03/09(土) 11:43:48.95 ID:e9DsS9n/0.net]
>>873
馬鹿野郎。。。それは最初のv-bindとv-modelのサンプルだろうが。
コンポーネントはこっちだ。
https://codepen.io/hinoragi/pen/YgVQjK
何度も何度も行ったがhtmlは分離できるぞ。ちったー勉強しろよ。

んでさ、修正点があるなら自分で書けばいいじゃない。別に複雑なコードじゃない。たった数行だぜ?コードに異論があるならコードで示す。当たり前だと思うがjQuery君は違うのかな?
それすら出来ず、vueが分からないからオウム返しのようにクソ呼ばわりする。それただのバカって言うんだよ。いい加減自覚しろ。

君に少しでもプライドがあるなら、君の思ったとおりに動作するvueのコード上げてみな。時間はかかってもいいからさ。

904 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 11:45:53.12 ID:OAlfgW/Ia.net]
>>876
埋め込んだのだからそれは仕方ないでしょう

ちなみに私はVueの真の利点はMVVMによるViewとViewModelの分離であると考えています
世の人々はコンポーネント志向に興味を惹かれているようですがそれはオマケです
私はVueを使ったとしてもhtml/cssとjsを同居させることはありません

それにjQueryでもコンポーネント化しようとすればテンプレートの埋め込みになる筈です
埋め込みを拒否した場合はhtmlのコピペになるでしょう
その点についてはVueもjQueryも同じことです
なので問題はVueではなくコンポーネント志向の方にあることがわかります

905 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 11:47:01.74 ID:RYW8IiyE0.net]
> 何度も何度も行ったがhtmlは分離できるぞ。ちったー勉強しろよ。

だったら分離してくださいよ。
"分離できるぞ" と言ってるからには、今のコードは分離されてないってことでしょ
それをしないのは、分離すると余計に長くなるってことなんでしょ?

906 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 11:47:56.22 ID:GVs3bbIF0.net]
Vue, React は、コンポーネント指向。
デザイナー・プログラマーの分業体制

jQuery は、そういう観点ではない!

907 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 11:48:33.65 ID:RYW8IiyE0.net]
>>878
> それにjQueryでもコンポーネント化しようとすればテンプレートの埋め込みになる筈です

ならない。なんのためにHTMLにテンプレートタグ <template> が出来たと思ってるんだ?

908 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 11:49:39.85 ID:OAlfgW/Ia.net]
>>879
重要な点はVue(MVVM)はViewとViewModelが疎結合であり
jQueryはViewとLogicが密結合している事です
それに比べればコードの行数は大した問題にはなりません

909 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 11:53:02.83 ID:RYW8IiyE0.net]
>>882
これがjQueryのコードなんだが
どこが結びついてるの?

$('.my-component [name="switch"]').change(function() {
 $(this).closest('.my-component').toggleClass('active', this.checked);
});

910 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 11:53:04.50 ID:QoZVVHuY0.net]
ツマンネーよ

911 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 12:00:56.94 ID:OAlfgW/Ia.net]
>>881
それはテンプレートの置き場を変えただけです
テンプレートをjavascriptからhtmlへ追い出すだけならVueでも可能です

しかしコンポーネント志向場合はテンプレートをhtmlに追い出しても意味はありません
異なるページでコンポーネントを再利用する場合を考えればそれが無意味であることがわかります



912 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 12:03:54.96 ID:RYW8IiyE0.net]
>>885
> それはテンプレートの置き場を変えただけです

だからお前がjQueryだと埋め込むしか無いっていったから、
置き場を変えてやったんだろうが
置き場を変えることでデザイナが自由にHTMLを変更できるようになる
プログラマは、中身がどう変わろうが意識する必要がなくなる
これが分業だろうが

913 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 12:04:02.87 ID:N2GlqC3/0.net]
もう「jQuery vs Vue」みたいなスレでも立ててそっちでやれよ

914 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 12:05:41.67 ID:RYW8IiyE0.net]
>>885
> 異なるページでコンポーネントを再利用する場合を考えれば

お前まさか、デザイナがページのヘッダとかフッタを
共通化せずにページごとに全部書いてると思ってるのか?
失礼だろw

915 名前:デフォルトの名無しさん [2019/03/09(土) 12:06:04.85 ID:e9DsS9n/0.net]
>>879
君は本当に面白いな。俺には君の不満点が全部見えない。当たり前だよな他人だし。だから修正したコードを君自身が書くことに意味がある訳さ。勉強にもなる。それに君は俺が何を書いても文句を言うだろう。後付で色々言われるのは面倒だ。
だったら、君の素晴らしいコードと、俺の糞コードを比較すればいいじゃん?君の正当性はコードでしか証明できないんだぞ。

たった数行の修正だし簡単だからトライしてみなって。それを見て意見出し合おうや。

916 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 12:07:36.71 ID:flOfKdeWM.net]
>>883
そのコードと<div>の中身がべったり対応してるじゃん
my-component以外に正確にコピペしてもらわないと動かない時点でコンポーネントじゃない

917 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 12:07:52.12 ID:RYW8IiyE0.net]
>>889
> たった数行の修正だし簡単だからトライしてみなって。それを見て意見出し合おうや。

えとさ、なんでお前の利益になることを俺がしないといけないの?w

918 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 12:08:40.26 ID:RYW8IiyE0.net]
>>890
> そのコードと<div>の中身がべったり対応してるじゃん

<div>の中身がべったりってどういうこと?

divの中身はいろいろ変えられるんだけど?
そもそもdivである必要すらない

919 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 12:12:57.48 ID:OAlfgW/Ia.net]
>>883
>>882
>これがjQueryのコードなんだが
>どこが結びついてるの?

>$('.my-component [name="switch"]').change(function() {
> $(this).closest('.my-component').toggleClass('active', this.checked);
>});

・適応対象のname属性がswitchでありクラス名がmy-componentの要素の子孫であること
・適応対象がchangeイベントをサポートしていること
・適応対象の直近のクラス名がmy-componentの要素がactiveクラスをサポートしていること

少なくともこの3つの物理的な条件をjsプログラマが知ってなければなりません
さらにhtml/cssデザイナはjsプログラマがこれらの条件を期待していることを知っていなければなりません

Vue(MVVM)ならばそのような仮定は全く必要ありません
Viewとは独立してただ単にViewModelの属性のブール値を切り替えるだけです

920 名前:デフォルトの名無しさん [2019/03/09(土) 12:14:08.39 ID:e9DsS9n/0.net]
>>883
なんで分からんの?まさにそれも密結合と言うんだぞ。クラス名やセレクタ使ってるだろ?
スクリプトからはdomのクラスやセレクタなぞ、可能な限り知る必要はないってこと理解できない?

921 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 12:17:29.40 ID:RYW8IiyE0.net]
>>893

Vue(MVVM)ならばそのような仮定は全く必要ありません
代わりにHTMLを直接書き換えるからです。
HTMLにコードがべったり結合してしまっています



922 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 12:17:40.62 ID:flOfKdeWM.net]
>>892
jQプログラマ「my-componentを置いてくだだい」
デザイナ「<div class="my-component"></div>」
これで分業なんて出来るかよ

923 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 12:18:35.13 ID:RYW8IiyE0.net]
>>894
> スクリプトからはdomのクラスやセレクタなぞ、可能な限り知る必要はないってこと理解できない?

DOMのクラスやセレクタを使わないでやるなら
HTMLに直接React用のコードを埋め込むしか無いやんw

924 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 12:18:44.76 ID:OAlfgW/Ia.net]
>>886
デザイナは自由ではありません
jQueryコードを理解してプログラムを破壊しないように作業しなければなりません
プログラムを破壊しないための条件は明確にはなっていません

そもそもあなたはコンポーネントの意味を理解していないようです
template tagを使用しても別の画面では再利用できません
それはコンポーネントではありません
コンポーネントはテンプレートとロジックが1つのブロックとして再利用可能な形態になっている必要があります

925 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 12:21:48.66 ID:OAlfgW/Ia.net]
>>888
それは補助的な方法論です
補助的な方法を使用していいならVueのコンポーネントからテンプレート分離することも容易に可能です
あなたの最初の主張は完全に理を失いました

926 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 12:23:08.25 ID:RYW8IiyE0.net]
>>896
jQueryプログラマ「この動きがほしい所に my-componentというクラス名をつけてください」
デザイナ「はいわかりました。昔からあるLightBoxみたいなやつですよね。
aタグに特定の属性をつけるだけで画像のポップアップができて簡単ですよね」

927 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 12:24:33.39 ID:RYW8IiyE0.net]
>>899
> あなたの最初の主張は完全に理を失いました

意味わからん。逆だろ

お前がjQueryでもコードの中にHTMLを埋め込むしか無い!って
jQueryを貶めようとしたから、それは間違いって言ってるんだが。

俺がいつjQueryの理だといったよw
マッピポンプしてるんじゃねーよ

928 名前:デフォルトの名無しさん [2019/03/09(土) 12:24:59.58 ID:e9DsS9n/0.net]
>>891
うわあ。。性格ネジ曲がりすぎだろ。すっごく君のためを考えて言ったんだがなあ。
俺が書いてもvueを何も知らない君がどう評価するの?まさか文字数カウントして終わりか?

君の言ってるのはこういう事。
vueしりませーん、よめませーん。かきませーん。おぼえませーん。でもvueクソだわ!!
通用するわけねーだろ。どあほう。

929 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 12:26:05.91 ID:RYW8IiyE0.net]
>>902
評価してやるからグダグダ言ってないでかけや

930 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 12:28:51.73 ID:OAlfgW/Ia.net]
>>895
完全に依存性がなくなったわけではありませんがべったり依存していません

Vue(MVVM)ではViewは明確に定義されたViewModelのインターフェースのみに依存します
ViewModelの実装からは完全に隔離されます
ViewModelのインターフェースがViewとViewModelの疎結合を保証する境界になっています

逆にjQueryではjs側がどのような実装を行っているか厳密に理解していなければViewを定義できません

ViewとLogicを隔てる境界はありません

931 名前:デフォルトの名無しさん [2019/03/09(土) 12:31:29.70 ID:e9DsS9n/0.net]
>>897
いいから無理にvueやreactの知識だすなってw。ボロでてるから。
コード埋め込みじゃなくてバインディング。
どうせ何が違うのか分からんだろ?いいから勉強してくれ。



932 名前:デフォルトの名無しさん [2019/03/09(土) 12:33:31.50 ID:e9DsS9n/0.net]
>>903
書けやじゃねーよw
俺は答えた。それについて文句があるならまず自分でやるのが当たり前じゃん。
君は社会人じゃないのかね?俺は君のお守りしてるわけじゃないぞ?

933 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 12:36:22.72 ID:flOfKdeWM.net]
>>900
それのどこがコンポーネントなんだよ
「この動き」と言った瞬間同じDOM構造が思い浮かんで初めて成立する会話
てかこの動きってなに?長々と説明する位ならコード見せた方が早いよね

934 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 12:38:01.89 ID:OAlfgW/Ia.net]
>>901
Vueでコンポーネントを実装するとhtml/cssとjsが1箇所に記述されるため強い結合が生じるというのがあなたの最初の主張です
ここには暗黙的に1つの前提がありました
html/cssを別のファイルに定義しないという前提です

しかしあなたは続く投稿でその前提を自ら覆しました
あなたはtemplate tagを提示してhtml/cssを別のファイルに記述する手段があるならしてもよいとしてしまいました
前提が崩れたためあなたの最初の主張の理もまた失われたのです

935 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 12:38:30.60 ID:izNw5U5za.net]
>>904
お前ももうそいつを説得しようとかバカなマネするのやめろ
論破と謂われようが勝利宣言されようが我慢しろ
無駄だし邪魔

936 名前:デフォルトの名無しさん [2019/03/09(土) 12:44:02.36 ID:e9DsS9n/0.net]
>>900
あーそうだ、jQuery君に肝心な事聞き忘れてた。
君がmy-componentをコンポーネントと言うなら答えられるはず。
1、そのコンポーネントのインターフェイスは?
2、再利用は?
3、内部をどう隠蔽して部品化する?
これコンポーネントの最低条件だから。本当はもっとある。
一つでも満たさない場合少なくとも仕事でコンポーネントと言ってはだめよ。
まあ保守するのが君一人ならオレオレコンポーネントでもいいんだけど。

937 名前:デフォルトの名無しさん [2019/03/09(土) 13:16:35.03 ID:e9DsS9n/0.net]
>>897
>DOMのクラスやセレクタを使わないでやるなら
>HTMLに直接React用のコードを埋め込むしか無いやんw

やっぱりここにjQuery君の根本的な勘違いがあるな。
jQueryってのは基本密結合なんだよ。密結合ってのは、相手を明確に知ってないといけないという事。端的に言えばセレクタが元凶。密結合が好ましくないってことは知ってるよね。

んでさ、また君の不得意なvueですまんけどさ、疎結合ってのはこういう事。
<div v-show="isShow"><div>
script側は変数isShowを切り替えるのみ。
違い分かるかな?スクリプト側からはdomを知らない&触れてない事。

メリットがとてつもなく大きな事も分かってるはず。いや分かれ。だったらデザイナに教えるなり、君が骨組み作ればいいだけ。。。いやそれができればこんな話になってないかああ。スレも残り少ないのに不毛だぜ。。

938 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 13:25:46.15 ID:GVs3bbIF0.net]
コンポーネントは、HTML/CSS/JS を、1つの .vue ファイルにまとめる。
そして、header 用、footer 用などとして、再利用する。
各コンポーネントには、data-v-aaaaaa などのユニークな属性が付くので、区別できる(Scoped CSS)

さらに、JSX 記法を使うと、JS 関数内に、HTML も書けるから、可読性が高い

new Vue({
el: '#app',
render: function(h) {
return <div>Foo</div>;
},
});

return <div>Foo</div>;
の部分が、以下の関数に変換される。
return h('div', null, 'Foo');

939 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 13:28:20.83 ID:RYW8IiyE0.net]
まだVue側のコードは出てないのか

940 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 14:01:33.87 ID:JGH8xftfM.net]
コンポーネントを理解できてないってことだよな

941 名前:デフォルトの名無しさん [2019/03/09(土) 14:19:02.54 ID:47IMMy0/r.net]
デザイナー兼プログラマーの俺様なら全て解決する問題だな
jquery使うのはWordPressのみ
Webアプリ系はvueかReactで作る

てかデザイナーとフロント分けたほうが効率いいとかいう輩どもはこれでわかったんじゃねえの
まったく解決できてねえじゃん
むしろ悪化してる



942 名前:デフォルトの名無しさん [2019/03/09(土) 14:22:14.84 ID:e9DsS9n/0.net]
>>913
この機会にvue react覚えればいいのに。
5chの不毛な論争でもそういう気持ちが芽生えれてくれれば無駄じゃない。100%君のプラスになる話だよ。俺は1円も得しないマジでw

943 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 14:22:18.32 ID:RYW8IiyE0.net]
>>915
あれほどVueは密結合になってないといいはっていながら、
最後は密結合にしたほうがいいっていうんだから面白いよなw

944 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 14:22:58.79 ID:RYW8IiyE0.net]
>>916
すでにVueもReactもマスターした上で言ってんだよw
VueもReactも密結合になるだけでメンテナンスしづらくなり
コードの量も増えるって。

945 名前:デフォルトの名無しさん [2019/03/09(土) 14:35:46.09 ID:e9DsS9n/0.net]
>>918
ほう昨日はnew Vue()すら知らなかった君が、たった一日でマスターしたのか。しかもreactも。って冗談でも笑えねえぞこら。

あとまあ、、一応聞いとくか、、
> VueもReactも密結合になるだけでメンテナンスしづらくなり
どのへんが密結合なんでしょうvue reactマスターさん?
まだまだ私も勉強中なので参考までに教えてください。
まずは密結合の意味からお願いします。

946 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 14:37:44.00 ID:RYW8IiyE0.net]
>>919
見た目(デザイン)を変更しようと思った時にJavaScriptのコードを
変更しなければいけないのが密結合です。

947 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 14:39:02.01 ID:RYW8IiyE0.net]
もう少しわかりやすく言えば、

見た目(デザイン)を変更しようと思った時に、JavaScriptを全く知らない人に
担当させられないのが密結合の証拠です。

948 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 14:46:41.07 ID:aSIxwjYia.net]
コンポーネントぶち殺すマン

949 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 14:50:50.25 ID:RYW8IiyE0.net]
>>922
コンポーネントと見た目(デザイン)は別の概念です。

VueやReactを使うとコンポーネントに見た目(デザイン)が蜜に結合してしまって
再利用しづらいコンポーネントになってしまうと自白しているようなもんですね。

同じコンポーネントでも見た目(デザイン)は別のものに変更できるようになってないと
いけません。テーマとかスキンという言葉を使えば理解できますか?

950 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 14:55:21.16 ID:izNw5U5za.net]
正直行数が少ない方が正義って思う人はjQuery使ってていいんじゃないかと思うよ

951 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 14:57:22.21 ID:RYW8IiyE0.net]
行数よりも、HTMLとCSSとJavaScriptが
明確に分離できてるのがjQueryの強みですけどね



952 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 15:16:00.82 ID:RYW8IiyE0.net]
というかVueの方が行数が長くなると認めたレスなのかw

953 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 15:19:43.98 ID:/2BHRI8Ma.net]
動的にタグの数が変わるようなものはjqueryでどう書くのでしょうか?

954 名前:デフォルトの名無しさん [2019/03/09(土) 15:22:05.65 ID:47IMMy0/r.net]
ほんとエンジニアって使えねえなあ
行数ごときで争ってるバカどもw

WebアプリなんだからUIUXもシステムで作るんだから右脳左脳両方使って効率よく作り出せよ

デザインセンスゼロだから行数で言い合うしかねえんだろ
お絵描き教室からはじめろ

955 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 15:25:37.25 ID:flOfKdeWM.net]
>>723の「こんな程度」のUIをJS
知らないデザイナーと>>900みたいな会話で分業して作ってるんなら
色んな意味で尊敬するわ
俺なんて地獄しか見えないもん

956 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 15:33:47.36 ID:/2BHRI8Ma.net]
動的にタグの数が変わるものはjqueryでどう書くのでしょうか?
タグをjsに書いたりしないですよね

957 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 15:44:26.89 ID:RYW8IiyE0.net]
> タグをjsに書いたりしないですよね
当たり前だろ。そんな事したらJavaScriptの中に
タグが埋め込まれてしまってデザインが用意に変更しづらくなるだろ

958 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 15:48:30.46 ID:/2BHRI8Ma.net< ]
[ここ壊れてます]

959 名前:> >>931
それは知っていますよ。どう書くのでしょうか?
[]
[ここ壊れてます]

960 名前:デフォルトの名無しさん [2019/03/09(土) 15:55:06.21 ID:e9DsS9n/0.net]
>>919
まあ予想してたと思うけど、、ちょっと長いよ。2つに分ける。

>見た目(デザイン)を変更しようと思った時にJavaScriptのコードを変更しなければいけないのが密結合です。

違います。
Javascriptのコードと言うからややこしくなるんです。データ駆動という言葉を知っていますか?
例えばform。form全体の状態を保持するjsonAがあるとしましょう。この

961 名前:鼾、formの"見た目"はjsonAの鏡となっていなければなりません。リアクティブは鏡に例えてよく説明されますよね。
で次にjsonA.isActive=trueなら、対応するUIはそれが"どんな要素であれtrueの状態である”という事です。鏡ですからね。
逆に<input type="checkbox" v-model="isActive">をクリックすれば、jsonA.isActiveも自動的に変更され従って他の要素も自動的に反映されます。
データ駆動ではこの様に、直接触れない(疎結合な)鏡の相手に対して、無意識に、自動的に(鏡の様に)反映されます。

でもね、もしかしたら君は今でもこう思ってるでしょう。
v-model="isActive" <<< 密結合じゃねえの?
違うのですよ。domはisActiveが何者か知らないのです。isActiveという名前の何か、なんです。name="isActive"じゃないんですよ。
ただただ自分の状態を反映する鏡の相手を指定しているだけなんです。この違い、わかりますか?

逆に密結合というのは、
<input type="checkbox" name="checkbox">
これです。自分をname=checkboxだと宣言し、それに対してアクセスするよう指示しています。アクセスするのはjQueryそしてセレクタですが。

先程の例で言えば、isActiveを変更したい場合、domのnameを知らないと何もできません。
この状態というか処理系を、密に結合している、というのです。つまりjQueryを使う限り大部分は密結合なんですよ。驚きですね!!

さてこれが本当の意味の、疎結合、密結合です。少なくともWEB業界ではそうです。
それにしてもコンポーネントといい、君は本当に勝手な解釈をしますね。もっと勉強しましょう。
[]
[ここ壊れてます]



962 名前:デフォルトの名無しさん [2019/03/09(土) 15:55:34.80 ID:e9DsS9n/0.net]
>>919
> 見た目(デザイン)を変更しようと思った時に、JavaScriptを全く知らない人に担当させられないのが密結合の証拠です。

もちろん違います。
name="checkbox"がv-model="checkbox"になるだけです。スクリプトの要素はありません。
テキストのバインディグも {{name}} とするだけです。スクリプトの要素はありません。他にもありますが、デザイナが新たに覚える文法は多くないです。
デザイナの教育、指示はむしろエンジニアの腕の見せ所ですよ。負担となるかは大部分が君次第。フレームワークだけのせいにしないように。

詳しくはvue公式を読みましょう。とてもわかり易くておすすめです。


>>923
ところで、君はコンポーネントの質問に答えてないですよね?
君の示したコンポーネント、<div class="my-component">のインターフェイス、再利用、隠蔽について答えてください。
言ってる意味さえ分からないかもしれませんが。。それなら質問しましょうね。

963 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 15:57:33.29 ID:RYW8IiyE0.net]
>>932
https://jsfiddle.net/v34njaes/

964 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 15:58:48.05 ID:RYW8IiyE0.net]
>>933
見当違いすぎてワロタw

HTML/CSSの世界に、Reactのものが含まれてるから
密結合だって言ってんだろ

965 名前:デフォルトの名無しさん [2019/03/09(土) 16:02:36.25 ID:e9DsS9n/0.net]
>>936
>HTML/CSSの世界に、Reactのものが含まれてるから、密結合だって言ってんだろ。

だからそれは密結合じゃないの。君の変な定義はどうでもよろしい。
相変わらず間違いを認めないヤツだなあ。。ググってみなよ。すぐ分かる事からさ。

966 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 16:03:36.34 ID:RYW8IiyE0.net]
>>934
> 君の示したコンポーネント、<div class="my-component">のインターフェイス、再利用、隠蔽について答えてください。

インターフェース? 何が聞きたいのかわからんが、
my-componentの中に特定のイベントを送る。my-componentの中ではそのイベントに反応する。
インターフェースはイベントによって疎結合な状態で作ることが可能。それだけだろ。

再利用? >>838でも書いてるだろ。以下のどんなDOMの構造であっても、
jQueryのコードは再利用できてる

<div class="my-component">
 <input type="checkbox" name="switch">switch1
 <p>ここはswitch1です</p>
</div>

<div class="my-component">
 <input type="checkbox" name="switch">switch2
 <select>
  <option>1</option>
  <option>2</option>
  <option>3</option>
 </select>
</div>

<div class="my-component">
 <input type="checkbox" name="switch">switch3
 <img src="かっこいい画像.gif">
</div>

何から何を隠蔽するしたいのかわからん。jQueryのコードは状態を持ってないので
隠蔽するものはなにもない。無名関数使ってるので関数名すら隠蔽された状態だし
単にクラス名がかぶらないようにしたいってだけならプリフィックスでもつければおしまい

967 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 16:04:07.64 ID:RYW8IiyE0.net]
>>937
ぐぐったけど、間違いないですねw

968 名前:デフォルトの名無しさん [2019/03/09(土) 16:05:45.02 ID:e9DsS9n/0.net]
>>936
んでさ、vue reactマスターの君はコンポーネントが全くわかってない。何も質問に何も答えられない。どうなのよマスターさん。
いろんな意味で恥ずかしいと思わんの?よくそんな妙な知識で仕事できるなあ。
同僚とか上司とかいたら注意されない?まあいれば、だけどさ。

969 名前:デフォルトの名無しさん [2019/03/09(土) 16:06:58.43 ID:e9DsS9n/0.net]
>>939
はい、ソースだしなさいねー。嘘ついてもすぐわかりますよー。

970 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 16:08:25.60 ID:RYW8IiyE0.net]
どうやら>>938には反論できないから
レスするのすっ飛ばしたようだなw

971 名前:デフォルトの名無しさん [2019/03/09(土) 16:14:51.37 ID:e9DsS9n/0.net]
>>938
やっと書いたか。本当に待ちくたびれたわい。

>インターフェース? 何が聞きたいのかわからんが、
どあほ。。。まじで言ってる??コンポーネントのインターフェイスが分からん?
よく堂々と白状できるな。。俺なら到底言えないわ。

あとさ、君のコードは再利用できてない。
それは単に、コ ピ ペ と言うの。

>何から何を隠蔽するしたいのかわからん。jQueryのコードは状態を持ってないので隠蔽するものはなにもない
もう、、、、なにを言っていいのやら。
あのね、例えばさ、外部からさ、直接 $("div.my-component input")とか、コンポーネント内部にダイレクトにアクセスできちゃ駄目なのよ。

これってコンポーネントの最低条件なんだけど、、君はどうやって勉強したんだ。
いいからこれもググってみなよ。。。うーん、だれか突っ込んであげてください。私はもう疲れました。



972 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 16:16:33.74 ID:RYW8IiyE0.net]
>>943
> どあほ。。。まじで言ってる??コンポーネントのインターフェイスが分からん?

じゃあ、VueからReactのコンポーネントのインターフェース書いてみろよw

973 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 16:17:00.95 ID:RYW8IiyE0.net]
>>943
> あのね、例えばさ、外部からさ、直接 $("div.my-component input")とか、コンポーネント内部にダイレクトにアクセスできちゃ駄目なのよ。

VueやReactでもダイレクトにアクセスできますが?

974 名前:デフォルトの名無しさん [2019/03/09(土) 16:19:28.37 ID:e9DsS9n/0.net]
>>945
おいおいおいおいー、どこがvueマスターなの?
直接アクセスできません。インターフェイスを介してアクセスします。
わかった?OK?

975 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 16:21:26.12 ID:RYW8IiyE0.net]
はい、Vueでコンポーネント内部にダイレクトにアクセスできちゃいましたw

https://codepen.io/anon/pen/ywXVOW

976 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 16:24:13.68 ID:RYW8IiyE0.net]
確か上の方で、scopedを使えば、こういうCSSからコンポーネントを
守ることができる。コンポーネントは影響を受けないってのたまわっていたね?
やってみて

div { //CSS ダイレクトアクセス
background-color: red;
}

977 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 16:26:40.96 ID:zxiwPMOw0.net]
さすがに呆れたというかコメントできない…

978 名前:デフォルトの名無しさん [2019/03/09(土) 16:27:02.65 ID:e9DsS9n/0.net]
>>947
笑いが止まらんぞおいっっっw
今日一番だわ!!!
本当に君には驚かされるな!!!
どこまで発想がjQueryなのよ。そりゃvueと共存できるよ。注意すればね。
いやすまん、ニヤニヤが止まらんから後でちゃんと返事する。

979 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 16:33:17.69 ID:RYW8IiyE0.net]
結局Vueのコンポーネントは隠蔽化されてるとか言うのは
技術的にそうなってるんじゃなくて、単にフレームワークの決まりとして
外部から触らないようにしましょうと文書で書かれているだけ

それを言ったら、jQueryでは情報のやり取りには
(カスタム)イベントを使用しましょう。コンポーネントの担当者以外が
直接内部をいじってはいけません。と文書でかけば終わるわけだよ。

980 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 16:42:10.68 ID:RYW8IiyE0.net]
少し訂正

それを言ったら、jQueryでは "コンポーネント間" の情報のやり取りには
(カスタム)イベントを使用しましょう。コンポーネントの担当者以外が

981 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 17:55:48.33 ID:GVs3bbIF0.net]
header.vue 内の、header コンポーネントには、そのコンポーネントだけに適用される、HTML/CSS/JS を含み、
ユニークな属性、data-v-aaaaaa が付いている

footer.vue 内の、footer コンポーネントには、そのコンポーネントだけに適用される、HTML/CSS/JS を含み、
ユニークな属性、data-v-bbbbbb が付いている

各コンポーネントには、ユニークな属性が付いているため、お互いに影響を与えることはない(Scoped CSS)
各コンポーネントは疎結合!

従来のやり方では、3つのHTMLファイル・4つのCSSファイル・5つのJSファイルがあれば、
3 * 4 * 5 = 60通りの中から、適用される組み合わせを探すのに、時間が掛かりすぎるため破たんした!



982 名前:デフォルトの名無しさん [2019/03/09(土) 17:57:51.41 ID:e9DsS9n/0.net]
>>952
いやすまん、ちょっと笑いすぎた。失礼しました。
ってー君もめげないなあ。。。その不屈の精神があればvue reactなんてすぐ習得できると思うぞ本当に。

>結局Vueのコンポーネントは隠蔽化されてるとか言うのは技術的にそうなってるんじゃなくて、単にフレームワークの決まりとして外部から触らないようにしましょうと文書で書かれているだけ
文章で書かれてるだけww、全然ちがうし、大体そんな事書かれてないし!
vueはフレームワークなの。jQueryと違うの。vue使ってる限りはきちんとコンポーネント化できてるよ。もし直接アクセスできたらバグだよ。

>それを言ったら、jQueryでは "コンポーネント間" の情報のやり取りには(カスタム)イベントを使用しましょう。 コンポーネントの担当者以外が直接内部をいじってはいけません。と文書でかけば終わるわけだよ。
はい気をつけまーす。でも人間は間違えるし忘れるよねぇ。うっかりアクセスする事も十分あり得るよね。
ただうっかりdocument.getElementsByClassNameなんて発行しないよなあ。そもそもdocument自体使わんし。どんなミスだそれ。

認めようよ。君のコンポーネントは不十分というか君の理解不足とスキル不足だよ。そしてvueは基準を満たす。
流石にこれは擁護できんし見逃せんわ。認めるまで議論は進まない。まあどうせスレも終わるし最後にありがとう、面白かった。

983 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 18:00:05.54 ID:RYW8IiyE0.net]
>>953
> 従来のやり方では、3つのHTMLファイル・4つのCSSファイル・5つのJSファイルがあれば、
> 3 * 4 * 5 = 60通りの中から、適用される組み合わせを探すのに、時間が掛かりすぎるため破たんした!

とりあえずお前はブラウザの開発者ツールを使えるようになろう。
あとはgrepも便利だぞ

そしたら今度はコンポーネントごとにグループ分けしてディレクトリ管理して
webpackやsassも使えるようになろう

984 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 18:00:22.08 ID:RYW8IiyE0.net]
> ってー君もめげないなあ。。。その不屈の精神があればvue reactなんてすぐ習得できると思うぞ本当に。

だから習得してるってw

985 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 18:00:41.76 ID:RYW8IiyE0.net]
> vueはフレームワークなの。jQueryと違うの。vue使ってる限りはきちんとコンポーネント化できてるよ。もし直接アクセスできたらバグだよ。

はい、Vueでコンポーネント内部にダイレクトにアクセスできちゃいましたw

https://codepen.io/anon/pen/ywXVOW

986 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 18:01:53.35 ID:RYW8IiyE0.net]
>>953
> 各コンポーネントには、ユニークな属性が付いているため、お互いに影響を与えることはない(Scoped CSS)

だからユニークな属性をつければいいと思いますよ?

987 名前:953 mailto:sage [2019/03/09(土) 18:05:06.61 ID:GVs3bbIF0.net]
従来のやり方では、3つのHTMLファイル・4つのCSSファイル・5つのJSファイルがあれば、
3 * 4 * 5 = 60通りの中から、適用される組み合わせを探すのに、時間が掛かりすぎるため破たんした!

これが密結合!

どこかを修正すると、別のどこかがおかしくなるため、無限に修正を繰り返すことになる!

今までの日本車のすり合わせ技術と同じ。
どこかを修正すると、別のどこかがおかしくなるため、外人よりも日本人に有利だった

これを部品ごとに疎結合にすることで、ある部品の修正が、他の部品に影響を与えないため、
すり合わせ技術がなくなり、外人でも同じ車が作れるようになった

すり合わせがあると、単独で部品が作れない・単独で働けないから、
常に全員が相談・残業して働く、日本人が有利だった

988 名前:デフォルトの名無しさん [2019/03/09(土) 18:09:10.56 ID:e9DsS9n/0.net]
>>957
もういい。休んでいいんだ。十分スレを楽ませてもらった。
君がいいと言うならいい。常識破りのまま、そのまま突っ走ってくれ。

989 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 18:10:12.37 ID:RYW8IiyE0.net]
次スレ立てました


Vue vs React vs Angular その2
https://mevius.5ch.net/test/read.cgi/tech/1552122580/

990 名前:953 mailto:sage [2019/03/09(土) 18:17:05.53 ID:GVs3bbIF0.net]
すり合わせは、金メダルのスピードスケート女子パシュートもそう。
常に全員が相談・残業して練習する、日本人が有利

外人は思想・人種・性格もバラバラで、長時間一緒に居れない

しかも草食動物の日本人とは違い、外人は肉食動物で自己主張が強いから、
異なる思想・人種・性格の奴とは、殴り合いのケンカになる!

外人は、日本人みたいに従順で、すぐに従ったりしないから

991 名前:953 mailto:sage [2019/03/09(土) 18:26:31.50 ID:GVs3bbIF0.net]
>>958
>だからユニークな属性をつければいいと思いますよ?
従来のやり方では、無理

属性を付けても、それを訂正してはずす時には、
また、3 * 4 * 5 = 60通りの中から、正しいかどうかを確かめないといけないから、時間が掛かりすぎる

密結合・すり合わせは、どこかを修正すると、別のどこかがおかしくなるため、
無限に修正を繰り返すことになる

だから、部品やプログラミングは、疎結合でないとダメ!



992 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 18:32:31.91 ID:RYW8IiyE0.net]
>>963
その計算になんの根拠もねーわw

コンポーネント毎にCSS定義してるから
何を探すと言ってるのかさっぱりわからない。

.my-compnent {
 [name="switch"] { }
 sonota-1 { }
 sonota-2 { }
}

JavaScriptファイルも my-compnent に関するものは
my-compnent.js に全部収められているし、

あ、なるほど、jQueryがだめと言ってる根拠は
自分がまともな管理できてないからだってことかw

993 名前:953 mailto:sage [2019/03/09(土) 18:35:08.58 ID:GVs3bbIF0.net]
従来のやり方では、3つのHTMLファイル・4つのCSSファイル・5つのJSファイルがあれば、
3 * 4 * 5 = 60通りの中から、適用される組み合わせを探すのに、時間が掛かりすぎるため破たんした!

さらに、これの悪い所は、3 + 4 + 5 = 12 の足し算じゃなく、掛け算になるのが最悪!
考えることが加速度的に増える

ここを修正したら、別の場所がおかしくなりましたとか、こればっかりやってる。
延々と、適用される組み合わせを探してる!

994 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 18:36:52.78 ID:RYW8IiyE0.net]
根拠言えないから、必死に嘘を言いまくるのねw
どっかの国の人と行動がおなじになってるよw

995 名前:953 mailto:sage [2019/03/09(土) 18:46:21.76 ID:GVs3bbIF0.net]
自分で属性を付けても、またそれを修正したり、訂正してはずす時には、
また、3 * 4 * 5 = 60通りの中から、正しいかどうかを確かめないといけないから、時間が掛かりすぎる

だから、各コンポーネントを別々のファイルに書くだけで、
ユニークな属性を自動的に付けてくれる、フレームワークが良い

996 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 18:51:07.24 ID:pp+gnfPcM.net]
>>961
荒らし行為
問答無用で出て行け

997 名前:デフォルトの名無しさん [2019/03/09(土) 18:55:36.80 ID:e9DsS9n/0.net]
>>961
そんなに悔しかったの?次スレってwほんと滲み出てるw
まあ頑張れよ自称vueマスターさんw。ほらテンプレに書かなきゃ。vueでdocument直接いじっちゃダメよー。逸材。

998 名前:デフォルトの名無しさん [2019/03/09(土) 18:56:19.05 ID:jSVYUNoJp.net]
jQueryおじさんネトウヨだったのかw
年齢も高そうだしな...

999 名前:デフォルトの名無しさん [2019/03/09(土) 19:30:08.07 ID:e9DsS9n/0.net]
jQuery君なあ。。ここまでの逸材なら色々拗らせた年齢不詳の40代かなあ。
つーか、ここまで vue react嫌うって何があったんだろ。そのくせ自称vue reactマスターなんだぜw。何その劣等感。しかもマスターならvueでもdom直接いじれるんだぜ。それでコンポーネントの垣根も超えられるって自慢するんだぜ。でも文書化で禁止すればokなんだぜ。
これで納得できるのが本当凄え。

1000 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 19:42:14.57 ID:fCQTKW9ua.net]
jQueryおじさん、スレチなんで次スレは来ないでね

1001 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 19:46:22.67 ID:C6v7oEvsM.net]
>>961
これ通報じゃね?



1002 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 19:52:05.13 ID:izNw5U5za.net]
ReactはReactNativeとセットにして一スレ立ててもいいんじゃない?

1003 名前:デフォルトの名無しさん [2019/03/09(土) 20:20:05.00 ID:47IMMy0/r.net]
密結合だろうが疎結合だろうが俺の場合は右脳と左脳が同時に判断すらから何も問題がない
本当のフルスタックとはそういうものだ

しかし左脳しか機能していないお前らは、理解不能で恐ろしい存在であるデザインのためにくだらない争いをしているわけだ

レベルが低すぎてアプリ開発なんか無理だろ

1004 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 20:20:35.21 ID:GVs3bbIF0.net]
テンプレを勝手に改変する、いつもの荒らしだろ

テンプレに、Ruby 禁止とか、jQuery・Lodash 禁止とか、
自分がわからない技術を禁止して、色々なスレを立てている奴

あちこちに、死ねとか書き込んでいる奴だろ

1005 名前:デフォルトの名無しさん [2019/03/09(土) 20:36:11.59 ID:e9DsS9n/0.net]
jQuery君は最後っ屁していったのか。次から色々スルーするわ。

1006 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 20:37:03.42 ID:OAlfgW/Ia.net]
>>975
疎結合のほうが理解しやすいことは確かですが理解のしやすさためだけに疎結合を目指すわけではありません
疎結合なシステムは個々のモジュールを独立にメンテナンス可能であるという点が最も重要なのです

1007 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 20:53:08.50 ID:RYW8IiyE0.net]
例えば、HTML、CSS、JavaScript。
個々のモジュールが独立してメンテナンス可能であるということです。

1008 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 20:59:34.50 ID:RYW8IiyE0.net]
例えばデザインですが、同じ機能を持ったコンポーネントでも
別のアプリだと違うデザインにしますよね?
そういった時にデザインのみ独立してメンテナンスします。

1009 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 2 ]
[ここ壊れてます]

1010 名前:1:01:14.05 ID:RYW8IiyE0.net mailto: 見た目をちょっと変えるだけで、別のコンポーネントとして
管理するのは馬鹿げているわけです。
[]
[ここ壊れてます]

1011 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 21:07:26.91 ID:izNw5U5za.net]
渡すpropsで切り替えればいいんじゃない?



1012 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 21:08:16.18 ID:RYW8IiyE0.net]
時代はこの先Web Componentsの時代になり、
高度なコンポーネントが増えますが、
再利用可能であるということは、別のデザインを持ったサイトでも
使えるコンポーネントでなければなりません。

機能はコンポーネントに閉じてよいですが、
デザインはコンポーネントに閉じてはだめなのです。
デザインはサイト全体で横断的に適用するものなのですから

1013 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 21:09:18.57 ID:Uscl0PAlM.net]
荒らしは出て行け

1014 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 21:10:57.82 ID:izNw5U5za.net]
>>975
React専用スレ立ててよ

1015 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 21:11:12.56 ID:RYW8IiyE0.net]
>>985
了解

1016 名前:デフォルトの名無しさん [2019/03/09(土) 21:14:19.58 ID:47IMMy0/r.net]
>>978
そういうこと言ってんじゃねえよ

1017 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 21:16:41.18 ID:izNw5U5za.net]
>>925
どうせならここじゃなくてQiitaで「jQueryの方がVueよりも優れてる理由」とかいう記事かけば誰かがお望みの回答をしてくれるんじゃないかと思うんだけどね

1018 名前:デフォルトの名無しさん [2019/03/09(土) 21:20:38.74 ID:jx9iLAiD0.net]
> Javascript はweb制作管理板、CGI はWEBプログラミング板へ。

1019 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 21:22:22.46 ID:izNw5U5za.net]
>>989
正直過疎板立てても仕方ないよ経験上

1020 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 21:23:34.06 ID:nmSMFs2da.net]
Qiitaとかスレチとか、お前ら、jQueryおじさんが周りの言うこと聞くわけないだろ
エホバみたいなもんやぞ

1021 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 21:30:52.53 ID:AJ6jPa0v0.net]
>>985
立てたぞ。>>974がセットにしてって言ってたからセットにした

React と React Native のスレ
https://mevius.5ch.net/test/read.cgi/tech/1552134567/



1022 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 21:49:36.92 ID:7ubvtRZR0.net]
>>988
書くならもっと別物にするな
メンテナンスしやすいコーディングスタイルとか

jQueryがだめに見られてるのは、DOM要素を追加したり消したりすることであって
クラス属性を書き換えるなどして、DOM要素にかんしてはCSSで制御するようにすれば
メンテナンス性が高いことは明らかだからね

1023 名前:デフォルトの名無しさん [2019/03/09(土) 22:03:28.92 ID:47IMMy0/r.net]
Vue vs React vs Angular Part.2
mevius.5ch.net/test/read.cgi/tech/1552136553/

本スレPart2建てた
こっちはjQueryの話禁止にした

1024 名前:デフォルトの名無しさん mailto:sage [2019/03/09(土) 22:05:43.66 ID:KVQbeC9/0.net]
>>994


1025 名前:デフォルトの名無しさん [2019/03/10(日) 09:10:34.18 ID:q7odbdCi0.net]
jQueryは悪くない。ただスレチ。
次スレが有意義でありますように。

1026 名前:デフォルトの名無しさん mailto:sage [2019/03/10(日) 09:50:49.25 ID:5/+zyaBC0.net]
>>976
死ね

1027 名前:デフォルトの名無しさん mailto:sage [2019/03/10(日) 10:51:49.09 ID:KLmR+9gsM.net]
結局主張のごり押しなだけで時間とスレの無駄だったな

1028 名前:デフォルトの名無しさん mailto:sage [2019/03/10(日) 10:55:35.81 ID:9XIrDo2La.net]
5chではいつもの光景

1029 名前:デフォルトの名無しさん mailto:sage [2019/03/10(日) 10:59:45.81 ID:5/+zyaBC0.net]
次スレ
Vue vs React vs Angular Part.2
mevius.5ch.net/test/read.cgi/tech/1552136553/

1030 名前:1001 [Over 1000 Thread.net]
このスレッドは1000を超えました。
新しいスレッドを立ててください。
life time: 78日 13時間 22分 9秒

1031 名前:過去ログ ★ [[過去ログ]]
■ このスレッドは過去ログ倉庫に格納されています








[ 新着レスの取得/表示 (agate) ] / [ 携帯版 ]

前100 次100 最新50 [ このスレをブックマーク! 携帯に送る ] 2chのread.cgiへ
[+板 最近立ったスレ&熱いスレ一覧 : +板 最近立ったスレ/記者別一覧](;´∀`)<306KB

read.cgi ver5.27 [feat.BBS2 +1.6] / e.0.2 (02/09/03) / eucaly.net products.
担当:undef