Vue vs React vs Angular

レス数が1000を超えています。これ以上書き込みはできません。
2018/12/21(金) 21:37:36.86ID:NZqrEm960

実際どうなん？
Vue
https://jp.vuejs.org/
React
https://reactjs.org/
Angular
https://angular.io/
VIPQ2_EXTDAT: default:vvvvv:1000:512:----: EXT was configured
2018/12/21(金) 23:26:47.42ID:nfjSFXej0
使いやすさのVue
先進性のReact
引くに引けない人とIonic派だけが使うAngular
2018/12/23(日) 12:03:12.00ID:+uWc+j3R0
Reactってそんなに先進的かねぇ
考え方的にはVueの単一ファイルコンポーネントと同じようなものだと思うけど
2018/12/23(日) 13:17:39.70ID:Yh8wj7M50
覚えてしまえば
どれも似たようなもん
2018/12/25(火) 02:20:03.84ID:s7ZrHKl7d
vueとかネットで騒がれてる
わりには、文法が難しくて取っ掛かりに
時間がかかるんだが！！！個人でVSコードの
デバッグやwebpackの
設定をやるとなると、手間が掛かりすぎるのも原因の
一つかな。色々とファイルを配置するのに、時間とpcのスペックを
費やすから手軽さにかける。
simple & bestの虎の巻きでもあればいいけど
個人がこの言語を公にすればいいのに、趣味や趣向が入りすぎて
「誰も特しない言語」になってる
2018/12/25(火) 02:45:09.52ID:5rbjhw110
なってない。vueは言語じゃないから。
2018/12/25(火) 03:00:18.04ID:HMsNHpQO0
>>5
翻訳すると、「わたしバカですー」ってことか
2018/12/25(火) 08:32:26.72ID:PIPHFfMH0
Laravelで使うかLaravel-Mixを移植して使うのがベターだと思う
9デフォルトの名無しさん (ﾜｯﾁｮｲ 7bbb-0DM2)
垢版 |
2019/01/06(日) 15:35:53.68ID:epzbPzEd0
Nuxtのおベンベン始めたけど、メンドクサー
PHPのゴミのようなフレームワークと一緒で、学習コストかかりすぎ

Reactはどうなん？
Vueやめよっかなー
2019/01/06(日) 16:38:24.93ID:r6TnJvb+0
2018年 は 脱React の年だった。 オワコン React
https://mevius.5ch.net/test/read.cgi/hp/1545879649/
2019/01/06(日) 17:37:40.72ID:lH/u0twK0
>>9
nuxtはreactとangularに比べるとシンプルで分かりやすいほうだぞ
これダメなら他やってもダメだろな
2019/01/06(日) 19:41:14.19ID:UmvfIbmh0
vue自体を学ぶのは、Vue CLI 3でプロジェクトを作成した状態から始めちゃうほうが、コンポーネントとか理解しやすいなと思った。
2019/01/06(日) 19:41:17.02ID:yTtuCMTo0
Reactってなれないうちは一番面倒くさいんじゃないかと思うよ
vueならv-modelでできる簡易な事も結構大掛かりだし
2019/01/06(日) 19:47:26.76ID:r6TnJvb+0
そのVueよりも普通にHTML書いたほうが早いってなｗ

<span>Hello HTML</span>

ほらなｗ
15デフォルトの名無しさん (ﾜｯﾁｮｲ 8901-ikDe)
垢版 |
2019/01/06(日) 20:21:22.55ID:q7b7d/XL0
SSRと思いついた時点で、シングルページじゃなかったことに気付いてほしかった。
2019/01/06(日) 20:23:37.89ID:r6TnJvb+0
SSRってレアなん？
2019/01/06(日) 20:35:42.46ID:8Nv8H8lo0
ここでは Vue.js 対 JQuery の議論は御法度？
2019/01/06(日) 21:04:56.83ID:G5jNBVk70
SPAってかっこいい単語だけど昔からはびこってるものと何ら変わらんのだよな
ASPやJSPやPHPでJSなりCSSなりイメージなり使わなければSPAなんだし
2019/01/06(日) 21:06:39.87ID:F8VfTYJHr
jQueryカスは来るな
2019/01/06(日) 21:20:17.42ID:r6TnJvb+0
来るなと言われましても、すでに捕捉済みですしｗ
2019/01/07(月) 12:23:00.42ID:lmbNEshB0
基礎から学ぶ Vue.js、mio、2018/5/29

Nuxt.jsビギナーズガイド―Vue.js ベースのフレームワークによるシングルページアプリケーション開発、
花谷 拓磨、2018/10/17

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

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


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

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

初めてのJavaScript 第3版 ――ES2015以降の最新ウェブ開発、オライリー、2017
2019/01/07(月) 21:22:16.57ID:JhkvYBnb0
いまどきのJSプログラマーのための Node.jsとReactアプリケーション開発テクニック／クジラ飛行机
Reactの本として見るとReduxとか不足してて微妙だけどNode.jsとかWebpackの本としてはそこそこ良かったと思う

React入門 React・Reduxの導入からサーバサイドレンダリングによるUXの向上まで (NEXT ONE)／穴井宏幸、石井直矢、柴田 和祈、三宮 肇
Reduxに関してはこれが一番詳しく載ってたかな
2019/01/07(月) 22:52:40.87ID:yWpn5GHb0
Nuxt.jsビギナーズガイド

これ半分くらい読んだけど、PHPのフレームワークが
次々出てきてはゴミになってるけど、同じ道を辿るだけだと思ったよ

実際のサイト制作は規約でガチガチだとソースがカオスになって重くなるだけ
24デフォルトの名無しさん (ﾜｯﾁｮｲ 8b2c-otaJ)
垢版 |
2019/01/08(火) 00:00:24.62ID:6hha5q+W0
Vue.js, Nuxt.js, React, Electron, Android アプリなどの、
ライフサイクルメソッドは、どのアプリでも普遍的

これを時間的に進む方向を、一方向だけに限定したルールは、使いやすい

Rails と同じ。
全員が同じ規約に従った方が、作りやすいし、わかりやすい

異なったやり方・各個人独自のやり方は、わかりにくい
2019/01/08(火) 01:27:03.29ID:A0I3q7Ng0
jsはフレームワークがどれだけ出てきても
フレームワークの介入の無いほうが汎用的に作れるようになるよ
パフォーマンスという観点だとその辺に溢れかえってるフレームワークはゴミにしかならんし
2019/01/08(火) 01:42:51.56ID:9BQB1mJH0
>>23
nuxtとかゆるゆるやんけ
2019/01/09(水) 23:44:12.50ID:qKlgI5Mn0
>>25
結局便利で手軽で簡単な jQuery に回帰するという事なのかな。
2019/01/09(水) 23:53:33.90ID:1OkzU/m20
jQueryもフレームワークだし
やれることはwebに動きつけるぐらいじゃん
2019/01/10(木) 00:13:35.42ID:L0zbm/dr0
jQueryもなくなりそうな勢いだしね
2019/01/10(木) 02:31:19.28ID:tiRAneNG0
いやフレームワークではないだろ…
色々余計な機能付いてるが（そして最近は減らしていっているが）自称の通りDOM操作ライブラリだろ良くも悪くも。
怪力でノンサポートのハンドル自力で切っといてこれがパワーステアリングだ！と言ってるようなもん
2019/01/10(木) 08:03:29.07ID:L0zbm/dr0
>>30
jQueryはJavaScriptのフレームワークだよ
2019/01/10(木) 09:23:23.97ID:PTw2yQ8aa
コーディングスタイルを縛るもんじゃないからどちらかと言えばクラスライブラリじゃない？

その点で行くと.NETもフレームワークと言うよりはクラスライブラリに近いけど
2019/01/10(木) 10:43:55.03ID:IwuSaukmd
>>32
いや、.NETはランタイムも含んでるから
2019/01/10(木) 12:27:58.40ID:DS8wsvUQ0
>>31
フレームワークっていうのは呼び出し側のことなので
jQueryはフレームワークに当たらない
あえて言うならブラウザそのものがフレームワーク
ブラウザがイベントを発行し、jQueryはその中を書くだけ
2019/01/10(木) 12:40:25.11ID:IwuSaukmd
>>34
ｗｗｗ
2019/01/10(木) 12:46:26.66ID:L0zbm/dr0
>>34
呼び出し方を同じ言語で簡素化してるのがフレームワークなのだからjQueryは間違いなくフレームワークだなw
2019/01/10(木) 13:14:35.21ID:DS8wsvUQ0
誰も簡素化の有無を焦点にしてないんだが？

全てのライブラリは簡素化するものです。
簡素化だけを条件にしてしまったら
ライブラリ全てがフレームワークってことになってしまう

フレームワークは利用者が何も書くことなく、
このような形で呼び出されるから、こういうものを用意しなさいと
決まってしまうもの。

jQueryはそんなものは決めないので、フレームワークにはならない
2019/01/10(木) 13:17:48.14ID:lMztlpGar
ここはjQueryスレじゃねえんだから出ていけ！！！！！
2019/01/10(木) 13:26:35.33ID:L0zbm/dr0
>>37
お前の言葉そのまんまだと
フレームワークは呼び出し側のことなのでjQueryはフレームワークに当たる
VueやreactやAngularも同じ
2019/01/10(木) 13:30:56.10ID:DS8wsvUQ0
> フレームワークは呼び出し側のことなのでjQueryはフレームワークに当たる

え？jQueryの何処が呼び出し側に見えるの？
フレームワークは呼び出し側のことというならば、
その根拠があるはずだよね。言ってみて
2019/01/10(木) 13:33:05.15ID:K9hnzqi6M
jqueryがフレームワークじゃないってやばい
2019/01/10(木) 13:34:39.06ID:DS8wsvUQ0
理由は言えないけど、やばいって言っておけば
勝てるだろう。やばいやばいやばい。どやぁ。

> 声闘(ソント)とは朝鮮人の古くからの風習で声の大きさで相手の言論を封じること。
> 人と議論をするとき、議論の内容は関係なく、ただ大声で早口で居丈高に話し、
> 相手が何も言い返せなくなれば勝ち、というしきたり。

みたいなことは止めてねｗ
2019/01/10(木) 13:36:25.95ID:lMztlpGar
jQueryバカは他でやれ！！！
2019/01/10(木) 13:36:49.62ID:DS8wsvUQ0
http://jquery.com/

> What is jQuery?
> jQuery is a fast, small, and feature-rich JavaScript library.

公式サイトで、ライブラリって書かれてるのに
それを覆えそうとする勇気に敬服する（皮肉）
2019/01/10(木) 14:55:31.43ID:Q3mhk3sMM
>>36
呼び出し方を同じ言語で簡素化してるのがライブラリなのだからjQueryは間違いなくライブラリだなw
2019/01/10(木) 19:39:06.48ID:3bI8C07ma
オブジェクトモデルでいうなら
フレームワーク→ベースとなるクラスを継承してメソッドをオーバーライドするスタイル
クラスライブラリ→自作のクラスのメンバーなどにライブラリのクラスを導入していくスタイル
2019/01/10(木) 19:55:11.88ID:3bI8C07ma
あと勘違いしないで欲しいのは別にフレームワークだから凄いとかフレームワークじゃないからヘボいとかそういうわけではないということ
2019/01/10(木) 20:06:37.94ID:lMztlpGar
だからなんでこのスレでjQueryの話してんだよボケ！！！！
テメーらクズどもは巣に帰れ！！！！！
2019/01/10(木) 20:29:46.35ID:Hgkpvvuo0
ライフサイクルっていう概念が結構重要だよね
2019/01/11(金) 02:19:07.88ID:YPYEBq870
>>48
jQueryもフレームワークだって言ってる人がいる
ここで話しても良いのでは？（皮肉）
2019/01/11(金) 06:45:46.69ID:5HJIvfws0
一部の部品として容易に組み込めるのだから公式が言っている通りライブラリだろう
導入のしやすさ、構成への制限の少なさはフレームワークよりライブラリの方が優れている
2019/01/11(金) 08:42:34.80ID:YAW8qxGHa
htmlフレンドリーなMVCフレームワーク(spring, asp.net, etc...) + vue(static js)

この組み合わせが最も簡単で理解しやすくトラブルも少なかった
node+npmを使ってビルドまでやると対応できる作業者が急激に減る
2019/01/11(金) 13:31:42.21ID:xSHHm11dr
npm対応できない業者ってどんだけ低レベルなんだよ
2019/01/11(金) 15:37:40.91ID:FoKSg4eqa
WordPressしかやらないところとかじゃない？
2019/01/11(金) 19:26:51.78ID:4DG2ONcv0
そんな会社ないと思うじゃん？
あるんだなコレが
2019/01/11(金) 20:35:38.23ID:8AAi5hAka
>>53
業務系の派遣さんはほぼ全滅
node知らない人も少なくない
2019/01/11(金) 20:55:12.43ID:xSHHm11dr
業務系の派遣がnode使うわけないじゃん
javaパーだろ
2019/01/11(金) 21:01:33.49ID:3i4YWAld0
npmでインストールする類のcliは中々いい本ないもんね
市販されてる本だと大体型落ちだったりするし
webpackとかbabelとか

だからといって旧世代のバージョンに合わせてからやるんじゃ折角新しい技術を覚えようという目的に本末転倒になってしまう
結局わりと頼りになるのがQiitaっていうオチ
まぁQiitaに固着し過ぎるとQiita以外なら簡単に見つかるものを見落とすって事もあるけど
2019/01/11(金) 21:54:53.84ID:8AAi5hAka
モダンなツールなら英語の公式ドキュメント読めばOK
昔と比較して本にかける金が激減してありがたい
2019/01/11(金) 22:16:12.14ID:9gdwCulq0
>>56
nodeとnpmを覚えるとすごく楽になるのにな
git使ってると余計にね
2019/01/12(土) 10:15:42.54ID:8njw2BgMr
>>58
公式とgithubのissue見る
キータも古いのが多いからいつの間に非推奨になってるライブラリもけっこうある
2019/01/12(土) 10:28:32.12ID:aqVeN9pj0
そういやgithubもたまに入ってるexampleがちゃんと動かないヤツとかあるよね
2019/01/12(土) 11:11:54.70ID:8njw2BgMr
「2018年最新のReact構築法」みたいなの参考にしてみたが内容がすでに古いのと書き方間違ってたり
公式が変わったのにそれに対応されていなかったりってのが多かった
ライブラリ使う場合は公式だけでは足りないから、ライブラリの公式みたり
とにかくどこか一つにまとまってるのはない
あるのは俺のPC内だけ笑
2019/01/12(土) 11:20:23.24ID:aqVeN9pj0
正攻法に関しては確かにGithubなんだろうだけどビルド時とかに依存関係で謎のエラーが出た場合とかね
2019/01/12(土) 11:29:15.66ID:ypUPEAJO0
>>58
npmに本なんか要らないだろ
ガイジかよ
2019/01/12(土) 11:32:26.60ID:aqVeN9pj0
>>65
だからnpm自体じゃなくてそれ経由でインストールするwebpackとかbabelとかって書いてるじゃん
2019/01/12(土) 11:38:52.80ID:ypUPEAJO0
>>66
それも要らんだろ
npmで自作パッケージをインストールできるようにするにも本なんか要らない
初級エンジニア程度のレベルなら誰でも簡単に使える
mavenやgradleに本なんか居るか？
それと同じだわ
2019/01/12(土) 12:01:11.28ID:9uXG7I1A0
フロントエンドは特に変化も早めだしネット上で情報漁れんとな
というか本よりまず公式のドキュメント読めよって思う
2019/01/12(土) 12:42:39.33ID:aqVeN9pj0
あと自分ができるできないの話じゃなくて
>>53,55,56
の状況に対しての話ね

だから結局フロントエンドフレームは多数はにはならずｊQueryはフレームワークだって言い張る輩も居なくならないって話
2019/01/12(土) 12:44:21.72ID:pXyjR2hh0
公式のドキュメント読んだってわからないこといっぱいあるよ
2019/01/12(土) 12:48:07.24ID:ypUPEAJO0
>>70
公式ドキュメントってリファレンスも兼ねてるのにそれで理解できないって逆にヤバい
エンジニアとしてよりも人間としてな
2019/01/12(土) 12:52:38.30ID:pXyjR2hh0
フロントエンドのwebpackの設定なんか、ケースバイケースで、
プラグインの組み合わせとかいろいろあるわけだし、
人それぞれなものを公式サイトが書いてあるわけないじゃん
2019/01/12(土) 13:41:23.02ID:MxRDiHRs0
>>72
具体的に
2019/01/12(土) 13:57:08.64ID:9uXG7I1A0
上に話のようにインストールやら基本なら
まず公式、エラーや組み合わせ等なら他を漁ればいい

漁っても無いものはリファレンス見て自分で書くことになると思うが
2019/01/12(土) 14:04:13.31ID:8njw2BgMr
公式見ればいいだけなのに公式すら見ずに文句言う奴らはなんなんだ？
2019/01/12(土) 14:08:28.63ID:YkNbG8KFd
>>75
ただの妄想
2019/01/12(土) 14:10:46.67ID:pXyjR2hh0
公式見ればいいだけなんて言ってるやつこそが公式を全然読んでないやつだと思う
2019/01/12(土) 14:27:49.84ID:8njw2BgMr
なんで俺ができてお前ができないの？
2019/01/12(土) 14:40:43.40ID:SJzF8qh90
誰もまともに本書かないから、未だにnpm install --saveとか書いてるやついるし
時代遅れの情報がいつまでも残っちゃってる
2019/01/12(土) 14:45:36.99ID:aqVeN9pj0
>>78
でYouは具体的に何を使っててどれくらいのものが作れるのさ？
2019/01/12(土) 15:00:31.05ID:8njw2BgMr
>>80
基本的にReact使ってるサイト
state管理にreduxは使ってる
その他axiosとかルーティング管理用のライブラリとか
そもそも必要であればライブラリはなんでも使えるけど
どのくらいのものが作れるかって、仕様と時間と金があればなんでも作る
2019/01/12(土) 15:10:52.84ID:SJzF8qh90
今はtypescriptが当たり前になってきているから、typescriptを絡めることで本を作りやすそうなのになあ
2019/01/12(土) 15:27:32.61ID:ypUPEAJO0
typescript推しはIE信奉者でMS狂信者しかいないと思ってる
2019/01/12(土) 16:00:54.42ID:8njw2BgMr
で？キミらはどのくらいのことができてどのくらいのものが作れるの？
2019/01/12(土) 16:02:39.14ID:D3aZHimQa
>>83
AngularはGoogleだけどな
2019/01/12(土) 16:09:24.96ID:ypUPEAJO0
>>85
angularはjavascriptで書かれたオープンソースのフロントエンドWebアプリケーションフレームワークなんだよな
2019/01/12(土) 16:10:27.90ID:XyP+e9Fi0
べつにGoogleがIE信奉者でもいいじゃない。
2019/01/12(土) 16:28:07.25ID:D3aZHimQa
>>86
えっ？
2019/01/12(土) 16:39:28.40ID:9/u5urH+0
はは、結局お前らフレームワークに振り回されてるだけじゃん

jQueryの過去の資産を大事にする方針を
見習ったほうが良いぞ
2019/01/12(土) 16:53:03.46ID:LpBvI9Bh0
es6+バベルでええやんけ
91デフォルトの名無しさん (ﾜｯﾁｮｲ dd01-RNo8)
垢版 |
2019/01/12(土) 18:22:17.27ID:wCIe4SB10
フロントですでにエンディングかよっていう。
2019/01/12(土) 18:39:06.27ID:8njw2BgMr
スルーするな
キミらはどのくらいのことができてどのくらいのものが作れるの？
2019/01/12(土) 19:56:59.99ID:aqVeN9pj0
>>92
ああスマンスマン

バックにLaravel置いてVue(Vuex、vue-router、axios、Bootstrap-Vue)とReact(Redux、react-router、SuperAgent、React-Bootstrap)入れた二種類のセット
それぞれ一通り機能確認するデモサイトをローカルに作ってみたって程度だよ実戦投入するのはこれから

あとNuxtとAngularはcliからプロジェクト生成してどこに何を書いて機能追加していけばいいか分かったって程度
Angularとかはコンポーネントの数多すぎて細かいところは全然

フロントエンドフレームワーク去年の後半から始めたばかりだから流石にまだまだ>>81みたいなんでもできるとは言わないよ

公式って結構公平だからサード製のモジュールに関してはこれ使えみたいな事あんま言わないじゃん
その辺に関してはやっぱ新ジャンルに手を出すなら書籍１〜２冊読んだ方が効率いいと思うんだよね
2019/01/12(土) 20:06:10.80ID:aqVeN9pj0
>>89
jQueryを使い続けるとしても設計指針としては参考になる事柄は相当あったと思うよ
何もやらなきゃいずれは時代遅れな挙動のサイトしか作れないって事になる

せめてHTML5のAPI集くらはちゃんと読んでおいた方がいいと思うよ
2019/01/12(土) 20:16:53.72ID:8njw2BgMr
>>93
React-Bootstrapってv3だよ？
今さら使う意味なくね？

そしてReactstrapはまだまだ開発中

俺としてはBootstrap Nativeをオススメするなあ
自分でコンポーネント作ることにはなるけど、むしろ使う部分だけコンポーネントにするから余計なstateないしスッキリ
2019/01/12(土) 20:37:44.48ID:aqVeN9pj0
>>95
npm install react-bootstrap@next bootstrap
@nextって付ければv4でいけるけど
https://react-bootstrap.netlify.com/getting-started/introduction

ありがとうBootstrap Nativeはちょっと調べてみるよ


ところでReduxとreact-router連携するのって何使うのがベターなの？
パっと調べた範囲で
react-router-redux
redux-first-router
connected-react-router
くらいがあるけど選定するための基準がなんとも
2019/01/12(土) 20:39:31.18ID:XyP+e9Fi0
別にv3で困らなきゃそれでいいじゃん。
2019/01/12(土) 20:48:45.48ID:aqVeN9pj0
Bootstrap Nativeってパッケージはなかったけど
これの事？
↓
Native JavaScript for Bootstrap

ReactNativeのNativeじゃなてNativeなJavaScriptって意味のNativeか

>>97
V4はV4で何かと機能増えてていいもんだよ
2019/01/12(土) 21:54:24.59ID:8njw2BgMr
>>96
v4はまだ開発中だしね…

あとrouterはconnected-react-routerがいい
react-router-reduxは非推奨になったから
https://github.com/reactjs/react-router-redux
>Project Deprecated

書籍ではreact-router-reduxを推してるから注意だね

>>98
そうNative JavaScript for Bootstrapのこと
どのコンポーネントライブラリも中途半端で開発中だしissueみたらバグ多いからまだ使うべきではないと思う
100デフォルトの名無しさん (ﾜｯﾁｮｲ a5ff-oMO0)
垢版 |
2019/01/13(日) 19:44:59.95ID:xL0iC1+O0
それより儂のチンポをしゃぶってくれんかのー
2019/01/14(月) 12:22:51.73ID:9Cudnq1q0
今は、npm よりも、yarn を使うことが多い
2019/01/14(月) 14:45:57.65ID:WA0+I2lc0
npmのバージョンアップにより
yarnのメリットはなくなったんじゃないの？
2019/01/14(月) 14:50:30.91ID:WRAeIDjcr
世界では圧倒的にnmp優勢だよな
2019/01/14(月) 15:36:20.49ID:Crew0ArO0
とりあえず
npm, react, babel あたり使って開発してみたらいいんじゃないかね。
それらの使い方やドキュメントの漁り方になれれば他に移るのもやりやすいでしょ。
105デフォルトの名無しさん (ﾗｸｯﾍﾟ MMb5-Qqgv)
垢版 |
2019/01/14(月) 15:45:29.95ID:LJi/fTqnM
Ionic+Angler使い続けてるけど
そろそろ乗り換えるべきか悩みますね
2019/01/14(月) 15:55:50.43ID:WA0+I2lc0
乗り換えに理由がない時点で何使っても駄目なんじゃね？
2019/01/14(月) 16:19:44.81ID:SwIKR08Ap
>>106
釣られたな
Anglerだけに
なんちって
2019/01/14(月) 21:10:29.94ID:Aet3LFfrd
vueはマジで独学は難しい。
あたかもjQueryより手軽で簡単みたいな事を謡い文句に
なってるけど絶対そんなことないと思うわ。アルゴリズムと
データ構造をカジッてないと
細々とした機能が何のためにあるのか、どうやって
道具として使われるのかが判らん。多分これはReactやAngularでも
いえることなんだろうけど。
2019/01/14(月) 21:28:32.97ID:SFheLbXb0
宣言型のjQueryとは考え方が違うからね。
CSSも宣言型なので、宣言型ベースで考えてると
オブジェクト指向のvueが使いにくく感じるのは当然
2019/01/14(月) 22:22:46.51ID:1O/ahtUv0
>>108
まぁjQueryの様には行かないわな

他のフレームワークよりも導入しやすい点を挙げるとするなら
制御対象のDOMを<div id="app">〜</div>で囲めば元のhtmlを活かしたまま使えるって事くらい
ReactやAngularの場合はイニシャル掛けた時点でその内側のDOMはフレームワークに定義したルートコンポーネントに差し替わってしまうからね
2019/01/14(月) 22:34:13.69ID:1mtAS7cX0
　 　∩＿＿＿∩　　 　　　　　　｜
　　 | ノ＼　　　　 ヽ　 　　　　　　|
　　/　　●゛　　● |　　　　 　　　|
　 |　∪　　( _●_)　ミ　 　　　　　j
　彡､　　　|∪|　　 |　　　 　　　 Ｊ
/　　　　 ∩ノ ⊃　 ヽ
(　 ＼　／ ＿ノ　|　 |
.＼　“　　／＿＿|　 |
　　＼ ／＿＿＿ ／

オブジェクト指向？
2019/01/14(月) 22:49:24.44ID:1O/ahtUv0
Vueをオブジェクト指向だって言うのは別におかしくないよ
2019/01/15(火) 00:22:41.85ID:550SdJeqr
vueが難しいならこれからウェブアプリの標準的な実装方法になるReactはもっと難しいことになる

しかもjQueryより楽と言われているから脳みその思考の仕方が違うんじゃねえの
2019/01/15(火) 00:37:29.32ID:KwWrmD9Ia
思考の仕方が違うってのはあると思う

手続き型でめちゃくちゃ複雑なスパゲティプログラムを間違いなく書けるほど高度な情報処理能力を持ってるのにオブジェクト指向、関数型、宣言的プログラムはからっきしダメという人
逆にそれらを使いこなして洗練されたコードをかけるけど、手続き型のスパゲティプログラムを処理しきれない人

どっちが賢いとかではなく
たぶん脳の基本構造が違うのだと思う
2019/01/15(火) 03:59:59.44ID:IdgIyeQx0
フレームワークだとDOM APIと違う方法を使うことになるので
新たに覚えることが多い

jQueryが楽なのはライブラリでフレームワークとしてはDOM APIと
同じだから標準を知っている人は単にAPIを置き換えただけ（と感じる）

とはいってもjQueryは宣言型なので、それを活かした書き方をしなければ
本領は発揮できない。具体的にはCSS（セレクタ）でHTMLの構造を定義して
（CSSの）クラスベースで設計する。

だけどそんなことは構わずDOM APIを置き換えただけとしても使えてしまうので
そういう人ほどjQueryは不要って言ってしまう。

まあ要するにフレームワークだと最初に覚えることが多いから敷居が高いが
やり方が強制されるのでよく理解してない人でもそれなりのコードになる。
jQueryだと（DOM API標準を知ってる人なら）APIの置き換えから入れるから
敷居は低いが、効率いい書き方にしようと思えば、宣言型であることを理解して
自分でCSSのクラスベースで設計しなければいけないということ
2019/01/15(火) 09:38:46.25ID:BDOH82+M0
いつまでjqueryの話ししてるの？
2019/01/15(火) 12:33:39.45ID:gjsoO4+v0
Vue では、単一ファイルコンポーネント(SFC)と言う、独自フォーマットがあるので、
HTML, CSS, JavaScript(JS) を、1つの.vue ファイルにまとめられるから、
この3つの組み合わせを探す手間がなくなる

普通だと、各HTML, CSS, JS ファイルから、該当する組み合わせを探すのが、ものすごい手間

スコープ付き(Scoped)CSS で、他のファイル・コンポーネントと被らない、ユニークなdata属性が付く

<span class="title" data-v-aaaaaa>あ</span>

span.title[data-v-aaaaaa] { color: red; }
2019/01/15(火) 13:39:47.30ID:rPuafK9sa
>>116
違いがイマイチ分からんってヤツに違いを教えるのもこのスレとしては優位意だと思うがな
2019/01/15(火) 13:59:21.68ID:mPhRZK6cd
結 論

中 規 模 開 発 を 謡 っ と き な が ら

中 規 模 開 発 の 本 も サ イ ト も な い。

あることにはあるが

細々としたシステムは説明されてるが

実際に使ってみると対外「チンパン」する
2019/01/15(火) 15:26:52.62ID:HqY59N8D0
>>117
> HTML, CSS, JavaScript(JS) を、1つの.vue ファイルにまとめられるから、
> この3つの組み合わせを探す手間がなくなる
まとめたほうが本当に便利かというとそうとは限らない。

サイトのデザインを変更する時は一箇所だけじゃなくて全体を変更する必要がある
例えばお正月用デザインとかクリスマス用デザインとか。
コンポーネント一つを変えれば良いわけじゃない
それに対して標準的なやり方をしていれば1ファイルだけ変えれば良くなる

ブログサイトのように、サイトごとにデザインが変わる場合は、コンポーネント側で
デザインを矯正できないから、結局CSSはコンポーネントの外に出す必要がある。
HTMLに関しても、コンテンツすべてをSFCに入れられるわけじゃない。
というかコンポーネントとは汎用的なものだからコンテンツはSFCの中に入れない。
1つの.vue ファイルにまとめられるが、1つの.vue ファイルにまとるわけじゃない
まとめる場合と、まとめない場合が混在する。

そもそもCSSであっても適切に（CSSの）クラス設計をして
クラスごとにファイルに分ければ、探す手間なんていらない
このコンポーネントは、このファイルと決めるわけだからすぐに見つかる。
だけどそのためには設計能力が必要になる。

ただ>>115でも書いたが、そんなことは構わずに使うことも出来る。
だから最初の敷居は低い。ただし適切なやり方をしなければ本領は発揮できない。
それに対してフレームワークだと最初に覚えることが多く敷居は高いが、
やり方が強制されるのでよく理解してない人でもそれなりのコードになる。
2019/01/15(火) 15:57:27.31ID:XHhYs/N9M
長い。３行で頼む。
2019/01/15(火) 18:25:56.14ID:gjsoO4+v0
普通、SCSS は、10個ぐらいのフォルダに、種類ごとに分けて入れる

サイト全体のデザインなら、sight とか、
ページ固有のデザインなら、pages とか

components と、全体のデザインは、分けないといけない
2019/01/16(水) 09:51:29.53ID:+OCCLcxar
scssをフォルダ別けするかね普通
scssフォルダ一つでいいじゃん
2019/01/16(水) 12:06:14.30ID:vG26s5l3a
>>123
その辺の派閥でVue派とReact,Angular派に分かれるんだと思う
2019/01/16(水) 12:28:49.87ID:qfBMRYbTM
>>124
でも会社で使うなら、派閥起こしてる場合じゃなくね？
2019/01/16(水) 22:42:48.72ID:t0cjBe1r0
会社ならそれこそ会社で何使うか方針決めるんじゃない？
2019/01/16(水) 23:13:02.72ID:Xh3PQjx50
>>126
それは上が決めること
2019/01/17(木) 14:53:18.25ID:SGpR1rMEa
だから会社で方針が決まれば別に会社内部で派閥が分かれる事はないだろ？
それでいいじゃん何に対して突っかかってんの？
2019/01/17(木) 15:29:34.40ID:UwMlXiCx0
フレームワーク使いたいって言ってるのに
上に今までのやり方（jQuery）でいいやろ？って言われて
理解してくれないって突っかかってるんじゃねーの？

やるべきことはここで愚痴を垂れるんじゃなくて
「これからはフレームワークの時代なんです！」
以外のまともな理由を言うってことだよ
2019/01/17(木) 15:55:27.16ID:SGpR1rMEa
フロンエンドフレームワークの導入しやすさってバックエンド何使ってるかにも依るよね
2019/01/17(木) 16:08:31.53ID:UwMlXiCx0
どのサーバーサイドフレームワークでもREST対応、JSON対応してるんだから
バックエンドがアプリケーションサーバーならどれでも大差ないだろ。

ただ単なるウェブサーバーだと、クライアントでフレームワーク導入する必要はないだろうな
2019/01/17(木) 18:52:05.06ID:rJrV68JMr
>>130
はあ？それはねーだろ
お前は無能晒して恥ずかしくねえの？
2019/01/17(木) 19:17:46.19ID:zQ8cL02fa
フロントフレームワーク使うことが即座にバックエンドがREST ONLYに繋がるわけではない
MVCとVueの組み合わせはかなりいい感じにまとまる
でもJSPやWebFormsでは全くミスマッチだろう
2019/01/17(木) 19:39:00.55ID:SGpR1rMEa
>>131
データのやり取り以前に初期導入時の敷居の違いの話
2019/01/17(木) 19:41:40.36ID:rJrV68JMr
>>134
そもそもバックエンドなくてもフロント作れるのがフロントフレームワークなのだが？
2019/01/17(木) 20:07:34.50ID:SGpR1rMEa
>>135
そんなシステムとして完結してないモノを見せて凄いでしょ？とか言うヤツばっかりだからjQueryのシェアが強いまんまなんだよ
XSSやらずにバックエンドのDBとどうやり取りすればいいかとか説明できんだろ？
2019/01/17(木) 20:28:06.33ID:rJrV68JMr
>>136
説明できんだろ？とかテメェ何様なんだよ？
XSSごときで偉そうなカス野郎www
2019/01/17(木) 20:47:57.11ID:SGpR1rMEa
>>137
話の主題はXSSじゃなくてデータベースの読み書きについてだが
>>135の言い分だとproxy設定とかロクに書いたことないだろ？
2019/01/17(木) 20:48:56.11ID:/uGhZ0I9d
ぷろきしｗｗｗ
2019/01/17(木) 21:03:54.46ID:9dtdj8/p0
フロントのスレだしリバースプロキシまで書かないと意味伝わんないんじゃないかな
2019/01/17(木) 21:34:00.77ID:Kv6gfvjN0
分からない人にはリバースプロクシって言ってもやっぱ分からないんじゃないかと思うけど
入門ならそんな事しなくてもいいLaravel-Mixが楽でいいと思う
2019/01/19(土) 11:35:33.75ID:/UsDDQKM0
いやそこの分離は本質だろ。
2019/01/19(土) 12:20:44.34ID:yV3NTFxEa
最終的には分離開発するにしても導入検討時から分離を強制してちゃ検討も進まないから結局導入されない
2019/01/20(日) 09:24:17.87ID:IfY+qP5bd
vueのテンプレート作成
ジェネレーターみたいなモノはないよな。(๑´ڡ`๑)
簡単な文法からVueライクなHtmlタグ入りのソリューションを提示してくれるような奴
2019/01/20(日) 11:30:01.35ID:DSIw24dXr
いくらでもありそう
2019/01/20(日) 15:22:05.46ID:NUl3GMJ00
>>144
vue template generator
でググったらそれっぽいのあったよ
2019/01/21(月) 16:34:43.42ID:hL7e9xxHd
それらしきモノって「ieoman」のことかな？
windowsの解説サイトが無くてフォルダーは手動で構築したけど
なんか半分ぐらい動く感じになった。文法は簡素な感じだけどGroovyやってる感覚になる。

yo mcs:component

ポチッとやたけど、成功パターンがそんなに
判らんので、実用的か、どうかも判らん
148デフォルトの名無しさん (ｱｳｱｳｸｰ MM9d-SlsV)
垢版 |
2019/01/21(月) 21:01:03.39ID:RUoLo0z1M
yeomanだろWwwWwWw
2019/01/21(月) 21:27:33.85ID:UOzXXkDMM
なんて読むの
150デフォルトの名無しさん (ﾜｯﾁｮｲ 132f-SlsV)
垢版 |
2019/01/21(月) 22:29:18.49ID:63LMimZ70
>>149
https://dictionary.cambridge.org/ja/pronunciation/english/yeoman
2019/01/22(火) 11:19:28.91ID:un/UAVV90
宇宙兄弟かな
152デフォルトの名無しさん (ｻｻｸｯﾃﾛﾙ Sp1d-oaXK)
垢版 |
2019/01/23(水) 22:47:18.07ID:QZsSw4x7p
今のプロジェクトでangular使ってるけどvue使ってみたかった
まだangularの事全然知らないけど、コンポーネントがts,html,cssでそれぞれ別れてるせいでファイル数膨大になるのが嫌だ
2019/01/24(木) 02:03:59.48ID:i2cda/I3M
Vueは小規模、Angularは中規模以上
という感じがしたな。手間的にも。
Angularの方がアプリ的な作りとして
しっかりしててわかりやすいかな
ただちょっとしたことですぐに動かなくなる
Vueもちゃんとルール決めして作れば
短期間で作れるしよいね
Reactはやってないからわからん…教えて
2019/01/24(木) 07:41:20.08ID:b/q9eM/c0
Angularを開発しているGoogleチームの敵は
別のGoogleチームかもしれない

Google、FlutterアプリをWebアプリへ変換する「Hummingbird」発表
https://www.publickey1.jp/blog/18/googleflutterwebhummingbirdwebdartflutter_live_18.html
2019/01/31(木) 19:03:37.44ID:cDCUatpE0
Reactで静的サイト作るならGatsbyが素晴らしいよ
モダンなSSR、Webpack、GraphQL対応してるし
かっこいいサイトのテンプレートも充実してる
Reactの勉強用として使い始めたけどGatsbyハマったわ
2019/01/31(木) 21:00:28.63ID:+v5hiY8Ya
SPAフレームワークでSSRってなんか目的を見失ってませんか？
従来のMVCフレームワークでいいじゃないですか
2019/01/31(木) 21:12:30.75ID:6KX5syxR0
イエス。サーバーサイドフレームワークとjQueryで十分
2019/01/31(木) 21:20:31.38ID:JEItRzDdM
お前ら例に漏れずgatsbyの「SSR」を勘違いしてトンチンカンなこと言っててワロタｗｗｗｗｗ
ヒント： gatsbyは「静的」サイトジェネレータ
2019/01/31(木) 21:26:46.94ID:CYJz288f0
もうflutterでええやん。
2019/02/01(金) 06:19:45.77ID:mVBo/SPW0
>>155
サイトのテンプレートって
デモサイトどこかにある？
2019/02/01(金) 07:11:27.78ID:yx2noT3I0
Markdown方式（超簡単）で記事かけたりとまじGatsbyいいよ
>>160
https://www.gatsbyjs.org/starters/?v=2
2019/02/01(金) 07:13:47.87ID:mVBo/SPW0
>>161
ありがと
トップページからだと
ここまでたどりつけんかった
2019/02/01(金) 09:13:31.45ID:hKW0Cv4Va
今大手サイトのフレームワーク利用状況ってどうなんだっけ？

ニコニコ、pixiv、Amazon辺りがReact使ってた気はするけど
2019/02/01(金) 09:20:37.92ID:Bt0WWmH6M
Netflix。サービスページほぼすべてに採用。
一部ランディングページから軽量化のためにlodashなどとともに取り除かれた際はアンチから「NetflixがReactやめたｗ」とデマ流されるほど。
あとTwitter。
https://www.infoq.com/jp/news/2017/02/twitter-react-mobile-stack
あと当然Facebook。
2019/02/01(金) 11:19:03.16ID:hKW0Cv4Va
そのサイトで使ってるかどうかはfirefoxのプラグインとかで分かるけどたしかにトップページにはないみたい
利用規約では検知した
2019/02/01(金) 12:44:24.16ID:V8zRexTTM
任天堂SwitchのeShopがReact
ZOZOがVue
という記事を読んだことある
2019/02/01(金) 15:34:39.74ID:1OLKpSdz0
大手サイトじゃなくて、大手企業のフレームワーク利用状況を知りたい
特に自社で何かしらのサービスを提供してない会社の


ほぼゼロであることはわかっていってますがなにか？ｗ
2019/02/01(金) 17:53:53.62ID:h+AyUO7aa
JSF使ってます
SPAはオモチャみたいなアプリにしか使えないから大手企業は採用しないと思います
2019/02/01(金) 18:25:03.74ID:Bt0WWmH6M
twitterはともかくfacebookおもちゃかあれ？
すごいアプリ製作してるんだね。
2019/02/02(土) 01:22:26.04ID:Oj61oPwf0
Amazonって欲しいものリストの部分だけReact入ってるみたいだね
2019/02/02(土) 04:16:46.09ID:W7PHwOVUM
WappalyzerっていうChrome拡張入れるといいよ
サイトでReact使ってたら素晴らしいしReact+Gatsby使ってたらナカマだし、違った見方でネットブラウジングできる
jqueryのみだとダサってなる（実際サイトの用途にはよるし使ってる人ごめんなさい）
他にも使ってるサーバーとかDBとかWordPressだ〜とかわかるよ
172デフォルトの名無しさん (ﾜｯﾁｮｲ 7fbb-FVje)
垢版 |
2019/02/03(日) 19:47:52.31ID:1rPAmYno0
vuetify使ってる人いない？

公式のマニュアルが説明不足で全然わからんのだけど、
どこで情報仕入れてる？

formのresetボタンすら動作しない
もっと見やすくてわかりやすいUIはないものか
173デフォルトの名無しさん (ﾜｯﾁｮｲ ff8f-ZJEL)
垢版 |
2019/02/03(日) 22:23:42.35ID:WjHZzJrh0
vuexに依存しないvueコンポーネントってどうやって作ってる？
頑張ってpropで渡すか、コンポーネントextendsしてメソッドオーバーライドするしか
思いつかないんだけどみんなもっと上手いことやってるの？
2019/02/04(月) 00:48:04.11ID:QWfNHn9SM
てかなぜvuex使わないのか
2019/02/04(月) 08:07:14.34ID:G7sMcdiQ0
全般的にUIコンポーネントって部品の説明不足だよな
176デフォルトの名無しさん (ﾜﾝﾄﾝｷﾝ MMdf-ZJEL)
垢版 |
2019/02/04(月) 08:32:32.96ID:+iZnVKUhM
>>174
書き方が悪かったかも知れん。現状でもvuexは使ってる。

例えばvuexにstore/user/flowerFlag:boolean がある
flowerFlag === trueなら ボタンコンポーネントの色を花っぽくにするって時にどうしてる？

1.propでflowerFlagを渡す
2.コンポーネント内にgetColoer()メソッド作って個別にextend/overwriteする

この2つの方法以外にももっといいやり方あるんかな？
177デフォルトの名無しさん (ｵｯﾍﾟｹ Srb3-xOdf)
垢版 |
2019/02/04(月) 09:29:22.24ID:Qx+SAuX0r
UIコンポーネントは自作すればいい
178デフォルトの名無しさん (ｱｳｱｳｸｰ MMb3-OKxR)
垢版 |
2019/02/04(月) 09:42:43.98ID:wHc+gudyM
flowerFlagって名前が気に入らない
何をするフラグなのかさっぱり分からない
useFlowerTheme: boolean とかにしろや
179デフォルトの名無しさん (ﾜｯﾁｮｲ 5f68-UaAB)
垢版 |
2019/02/04(月) 12:27:23.88ID:jZQr0rin0
shoriKbnFlg
2019/02/04(月) 14:15:30.10ID:d7fkSk13p
makeBrainFlower === true
181デフォルトの名無しさん (ｱｳｱｳｸｰ MMb3-OKxR)
垢版 |
2019/02/04(月) 19:55:50.85ID:ssiW6pqzM
havingDirtyFireworks = true;
https://www.urbandictionary.com/define.php?term=Dirty%20Firework
2019/02/06(水) 17:54:16.50ID:cXGNS95ra
SPAフレームワークでSSRが醸し出す、一周回ってMVCフレームワークに戻ってきた感が笑える
2019/02/06(水) 18:43:12.38ID:259i/glJ0
そう思いたくて必死なのが笑えるｗｗｗ
そうやって得た安心は妄想だぞｗｗｗｗ

Rendertronを使ったダイナミック レンダリングの実装手順をGoogleが解説
https://www.suzukikenichi.com/blog/google-explains-how-to-implement-dynamic-rendering-with-rendertron/
2019/02/08(金) 18:47:35.85ID:J+/qVGg10
Reduxってムズイよな
185デフォルトの名無しさん (ｵｯﾍﾟｹ Srd1-da9w)
垢版 |
2019/02/08(金) 20:58:46.78ID:Waqd0NNdr
どのへんが？
2019/02/09(土) 08:15:58.88ID:RdduHrOP0
Vueに乗り換えます
じゃあな
2019/02/09(土) 08:16:45.44ID:RdduHrOP0
めっちゃIDがReduxっぽいけど
188デフォルトの名無しさん (ｵｯﾍﾟｹ Srd1-da9w)
垢版 |
2019/02/09(土) 08:29:03.30ID:6iVlgEPUr
ここvueスレでもあるけどよくわからんがさよなら
2019/02/09(土) 13:36:35.69ID:R3UI++NJ0
スレタイのやつ3つとも触ったことないままAureliaってやつを採用しようと思ってるんだが、お前らの評価はどんな感じ？
採用の理由としてはVueが選ばれるのと同じだと思う
2019/02/09(土) 14:04:19.59ID:F2V9krnu0
調べてみたら3年くらい前にちょっと流行ったみたいだけど
未だに話題になってないって事はそういう事なんじゃない？
191デフォルトの名無しさん (ﾜｯﾁｮｲ 022f-dNG/)
垢版 |
2019/02/09(土) 18:48:21.70ID:JM+D9hMz0
流行り廃れでフレームワークを選ぶんじゃねえ！
自分に一番合ったフレームワークを選ぶんだ！
2019/02/09(土) 21:03:07.28ID:OJ6TU+cc0
そうするとjQueryでいいということになる
2019/02/09(土) 22:38:36.16ID:+053I9atM
https://jquery.com
jQuery: The Write Less, Do More, JavaScript "L i b r a r y".

ライブラリであることに負い目でもあるのかな？ｗ
フレームワークの流儀を押し付けられず、どこでも好きなように自由に使えるのがライブラリの強みだと言うのに。
2019/02/09(土) 23:21:06.75ID:OJ6TU+cc0
どこ見て負い目があると感じたんだ？
ライブラリだからライブラリって書いてあるだけだろう
2019/02/09(土) 23:22:07.95ID:YyhK9/uE0
angularはwebエンジニア以外の血が流れてるんじゃないのか？ゲームエンジニアでhtmlもjavascriptも経験がなかったときの俺には非常に使いやすかった。
web関連の経験値がたまってきた今となっては大がかりに感じちゃってあえて使おうという気はでないが…
2019/02/09(土) 23:54:11.39ID:w7h73/LU0
フレームワークと言われるのがウゼーから強調してると思うが
Reactもライブラリって名乗ってるな
2019/02/10(日) 00:23:54.54ID:0+1G/wKUa
結局MVC+jQueryが一番バランスとれてんだよな
SPAなんて作る側にも使う側にも画面遷移が超早いぐらいしかメリットねえもん
198デフォルトの名無しさん (ﾜｯﾁｮｲ 022f-dNG/)
垢版 |
2019/02/10(日) 01:13:27.71ID:Ewu7Fccw0
>>197
それは流石にSPA作った事無いやつの暴論
199デフォルトの名無しさん (ﾜｯﾁｮｲ f901-bFSf)
垢版 |
2019/02/10(日) 02:19:44.57ID:EmtOscou0
jQueryの功績は確かに大きい。その次の世代として仮想domありきのvueやreactなんだから、jQueryとの比較は意味が無い思う。
2019/02/10(日) 02:53:41.79ID:rzMRhZmV0
大雑把にいうとライフサイクルメソッドみたいなイベントとか状態管理などの枠組み含むものがフレームワークで
枠組は使用者が作って機能を呼び出すのがライブラリだろ
2019/02/10(日) 13:00:31.92ID:h0ljrL+B0
>>199
> 仮想domありきのvueやreactなんだから、

仮想DOMはメリットじゃないよ

フレームワークの設計上どうしても遅くなるという問題を
回避するための手段でしか無い
遅くなければ仮想DOMなんて無いほうが良い
2019/02/10(日) 15:30:08.63ID:rzMRhZmV0
そういやスタイル側のフレームワークって何がいいの？
基本はBootstrapなんだろうけど
2019/02/11(月) 18:23:39.83ID:33lwyeb6d
やりこめば
やるこむほど
思うけど、vueは簡単じゃあないと思う。
204デフォルトの名無しさん (ｵｯﾍﾟｹ Srd1-da9w)
垢版 |
2019/02/11(月) 19:34:12.30ID:s7yVsu1/r
reactとvueどっちがむずいのかね
2019/02/11(月) 20:28:50.21ID:HASh9YeP0
よう分からんけど、日本じゃ wasm は話題にならないね。
情報が遅れてるんだろうか？
2019/02/11(月) 21:18:49.40ID:34Z/DRMs0
javascriptが十分に速いから
2019/02/11(月) 21:40:45.56ID:9qVoQSgPM
wasm盛り上げたいgoogleもjs速くし過ぎたと後悔してることだろう
2019/02/11(月) 21:46:24.07ID:wrnl7DNU0
wasmが必要となるようなものは、
ウェブじゃなくてアプリにするから
2019/02/12(火) 08:51:23.06ID:dWGWBM0h0
なるほど、日本では、「JavaScript を高速にしたもの」と思われている段階なんだね。
アメリカではパラダイムシフトが起きると思われているらしく、色々と恐れられて
いたりもするらしい。
2019/02/12(火) 10:58:51.22ID:qsQxhdCu0
ﾜｯﾁｮｲがVueやんけ
2019/02/12(火) 12:14:49.91ID:3leffBPz0
>>209
パラダイムシフトと言っても所詮
ウェブがアプリに追いつくぐらいの意味でしか無いから
2019/02/12(火) 12:37:49.91ID:06lg1M4xa
C#がクライアントで使えるようになるだけでもかなり有り難い
Microsoftなら開発者に優しいエコシステムを提供してくれる
2019/02/12(火) 13:41:43.16ID:KSl1FEVj0
あんなもの昔の時代へのパラダイムシフトでしかないだろ
負の遺産を再び抱え込むだけだよ
2019/02/12(火) 14:02:56.84ID:dWGWBM0h0
>>212
wasmでは、C#は使えるようにならないはず、一生。
215デフォルトの名無しさん (ｻｻｸｯﾃﾛﾙ Spd1-PGOX)
垢版 |
2019/02/12(火) 14:38:31.80ID:poZCG/I0p
NaClが出始めの頃や、なんならActionScriptやSilverlightのRIAでもパラダイムシフトだのなんだの言われてたな。
2019/02/12(火) 15:14:29.49ID:dWGWBM0h0
>>214
すまん。既に使えるらしい。
.Net 仮想マシンを、wasm に移植したのかな。
2019/02/12(火) 15:24:18.10ID:dWGWBM0h0
WinForm か WPF か知らないけど、そういう標準的な作り方をしたC#が
ブラウザでそのまま動くということではなくて、Razorを使って専用に
作らないといけないらしいね。
2019/02/12(火) 15:50:17.94ID:dWGWBM0h0
JavaのGUIの場合、Swingは、完全にJavaで書かれていて、OSに
依存せずに全部自前で書かれているので、Java仮想マシンさえ動けばどんなOS
でも完全にGUIアプリが動く。
でも、C#の場合はライブラリがWin32 APIなどを呼び出しているから、そうは
行かないみたいだね。よく知らないけど。
2019/02/12(火) 17:33:20.32ID:tia7IyO5M
razorてメチャメチャ容量大きくなっちゃってまだまだ使い物にならないんでしょ？モバイル用にでも使えるくらい小さいの吐いてくれないかなぁ…
2019/02/12(火) 19:00:48.09ID:1MzWJDZPd
webの技術にパラダイムシフトって言われるような変化起こすにはjavascriptの標準仕様が劇的に変わるか、革命的なブラウザが出てきてとんでもないシェアを握るってパターンしかないという理解だわ。
2019/02/12(火) 19:36:10.46ID:1aNudvIBa
無理して既存の資産をwasmに移植するメリットはないと思うね
最初はへんな抽象化せずにDOMによく馴染むHTMLフレンドリーなライブラリをC#で実装してくれればいい
なんならjQuery.Netみたいなパクりでもかまわない
手を出しやすい土台を作って欲しい
2019/02/12(火) 20:54:50.86ID:3leffBPz0
wasmって既存の資産を移植するためのものだよ？
最初から作れるのならJavaScriptを使えば良いわけだし
2019/02/12(火) 21:13:01.75ID:II9d+pHTd
>>219
Blazorな
2019/02/12(火) 22:15:31.30ID:zazJl4ej0
HTML5によってFlashなどのプラグインが死んでいったり
JavaScriptからカメラやマイクにアクセス出来るようになったりとそれなりに影響があった
WebAssemblyはそれらをさらに強化する

JavaScriptでは限度があった動画/音声データのリアルタイム解析なども可能になる
プラグインが死んだUnityも今はWebGL+WebAssemblyで動く

プラグインでバラバラ対処してたことが標準化されたって感じかね
劇的に変わる、と言うのはちょっと違う気もするが
2019/02/12(火) 22:37:43.88ID:Jl2Y8iQt0
HTML+CSS+javascriptでの開発って他の分野に比べると独特だから実は参入障壁高いんだよね。使いこなせないだけなのに技術そのものがショボいと言いだす。
だからwebフロントエンド以外の開発者がwebフロントエンドの開発したくなったときにいろんな手法を見つけて何とかしようとするんだけど、なれてくると別にHTML+CSS+javascriptでいいやってなる。
そんなイメージ。
2019/02/12(火) 22:51:06.28ID:Lzw+Arvw0
メモリの扱いというかデータの受け渡しがだるいから、TypedArrayに対して高速に計算するだけの何かを導入してくれたほうがマシだった
2019/02/12(火) 23:16:46.90ID:qsQxhdCu0
wasmってiOSとAndroidに対応してる(する)の？
2019/02/12(火) 23:20:52.48ID:tia7IyO5M
>>226
これ。
2019/02/12(火) 23:49:27.70ID:mBIHBqGr0
>>227
もちろん
Web標準やで？
230デフォルトの名無しさん (ﾜｯﾁｮｲ f901-bFSf)
垢版 |
2019/02/13(水) 00:50:15.15ID:wb3NGc0D0
んなことよりpush通知実装しろ。iOS safariテメーのことだ。
2019/02/13(水) 00:55:06.05ID:GHq8zte20
>>225
JVM の代わりとなる仮想マシンと考えた場合、C++ で書けることは重要なんだ。
C++は型があるので、ミスをコンパイラが発見してくれる事が多いから。
例えば、JSだと関数の引数が多くても少なくてもエラーにならない場合がある
と思うけど、C++では敢えて分かっていてそうする場合以外は必ずエラーになる。
C++ では整数型を受け取るつもりの仮引数に浮動小数点型の実引数を渡すだけでも
エラーになる。ところが、JavaScript ではエラーにならない。

このようなことがあるので、JavaScirpt は大規模アプリをC/C++で組んだことの
有るプログラマからは嫌われている。特にアメリカで。
2019/02/13(水) 00:56:36.75ID:dfUEINu60
TypeScript使えばいいだけじゃね？
2019/02/13(水) 01:03:22.46ID:GHq8zte20
JavaScript だと、プロパティーには文字列と数値、Objectのどれでも入れられるので
単に書き間違えているだけなのに、エラーにならないので原因不明の不具合が直らずに
困る可能性がある。例えば、1,2,3 の 3つの数値を用いて、何か3種類を区別する
目的でプロパティー aaa を作ったとしよう。
aaa = 1;
aaa = 2;
aaa = 3;
と書くことをプログラマは想定している。ところが間違って、
aaa = "x";
と文字列型を入れてしまった場合、どこかで不具合が起きるだろうが、ソースが何10万行も有る
プログラムの場合、この間違えて書いてしまった行を探し出すのに苦労することになる。

こういう間違いが、C++ では、魔法のようにコンパイラが発見してくれる。だからC++は
安全で安定性が高いために人気がある。
2019/02/13(水) 01:06:00.32ID:dfUEINu60
テスト書くんだからすぐ見つかるでしょ？
2019/02/13(水) 01:06:08.06ID:GHq8zte20
>>232
その言語を多くの人は知らない。ずっと古くからC言語があり、とても人気があって、
その後継にC++があって今でも続いている。アメリカではC/C++経験をつんだ
プログラマが日本よりも沢山いるためか(?)、C/C++ で wasm が使えることで
game changer, pardigm shift などと喝采が起きているらしい。
2019/02/13(水) 01:06:59.54ID:GHq8zte20
>>234
なぜ、C/C++ が型を書いているかは、言語が古いからではなく、まさに
エラーチェックのためなんだよ。
2019/02/13(水) 01:12:36.84ID:WxTmz2dr0
typescriptはもう半数が使ってるくらいの感じでしょ
2019/02/13(水) 01:14:25.09ID:GHq8zte20
>>234
テストで結果が異常であると分かっても、どこに原因があるかが分からないことがある。
だから、細かく実験していく必要があり、それには時間がかかる。
型の間違いをコンパイラが見つけてくれるだけでもミスが判明することが
かなり多くあり、開発時間の節約・短縮に大幅に貢献することになる。

ミスったときには、型や引数の個数まで間違っている確率は意外と高いので、
それだけでも8割くらいの単純ミスは発見できてしまう。
2019/02/13(水) 01:15:17.87ID:GHq8zte20
>>237
Webプログラマから入った人にはそう思えるかもしれないが、昔からの
普通のデスクトップアプリを作ってきた人はそうではない。
2019/02/13(水) 01:16:31.85ID:5ssU2x9I0
C++ソース（型がある）→コンパイル（型情報に基づきエラー）→バイナリ（型はない）→ネイティブ実行

Type Script（型がある）→トランスパイル（型情報に基づきエラー）→JS（型はない）→ブラウザ実行

あんま変わらん。
wasmが出てきてから聞かなくなったけどJSはWebのアセンブラとは言い得て妙だったな。
2019/02/13(水) 01:17:39.67ID:dfUEINu60
>>235
> その言語を多くの人は知らない。

大丈夫。TypeScriptはJavaScript＋αだから
α（型）の部分を除けばJavaScriptそのもの
2019/02/13(水) 01:18:26.87ID:dfUEINu60
>>238
> テストで結果が異常であると分かっても、どこに原因があるかが分からないことがある。

十分にモジュール化されてればすぐに分かるよ
2019/02/13(水) 01:19:20.67ID:GHq8zte20
>>240
TypeScript という言語自体を今までの大部分のプログラマは知らない。
言語はなるべく1種類を学ぶだけの方が楽だから、C/C++ という事になる。
2019/02/13(水) 01:19:47.09ID:WxTmz2dr0
逆だな。javascriptをすごく理解してるWebプログラマのほうがjavascriptで粘ってて、
javascript理解しがたいと思ってる人らがtypescriptに救いを求めて移行した感じがある
2019/02/13(水) 01:22:34.41ID:GHq8zte20
>>241
そこまで頑くなに　C/C++ を拒絶する理由がない。
C/C++ を1つ覚えるだけで組み込みから何から何まで作れるようになり、
速度も現存する高級言語の中でTOPな上に、エラーも少なく、安全。
過去からの資産も多い。例えば、画像処理、AI、音声解析、文字認識、
3D描画、物理計算、何から何まで C/C++ は存在している。
敢えて後から出てきた言語を覚えるの無駄。
2019/02/13(水) 01:24:05.31ID:GHq8zte20
>>244
でも、ハイレベルなプログラマはそうは思ってないと思うよ。
実際に作った作品で勝負したら C/C++ の圧勝だと思う。
機能面でも速度面でも安定性も品質も。
2019/02/13(水) 01:25:16.64ID:5ssU2x9I0
>>243
js抜きにしてもtypescriptの型システムは良くできててC系文法の型システムとはこうあるべしといったお手本みたいだけどな。
c++の型システムは継ぎ足しキメラの失敗作だけど今さらどうしようもできねえしな…
2019/02/13(水) 01:36:11.82ID:GHq8zte20
>>247
仮に TypeScript に色々良いところがあったとしても、今迄から高い定評の有る
C/C++をまず、覚えてしまうほうがずっと将来性がある。
だから、人々はC/C++を覚えようとしてきたし、少なくともアメリカのプログラマ
はそうしてきた。いったんC/C++を習得すると、それだけでほとんどあらゆることが
簡単にできて、成果物の効率や速度もとても高く、エラーも少ないものが出来る。

その状態で敢えて、TypeScriptを覚えるのは非効率。だから、C/C++ が
ブラウザで動くのはすごく魅力的な話という事になる。
2019/02/13(水) 01:37:20.24ID:vNuAntxeM
S： もうかなり時間がたったしね、C++ が時間の無駄だということにはほとんどの人が気がついたとは思うけど、でも当初予想していたよりはずいぶん時間がかかったな。

I： 具体的に何をどうやったのかな。

S： 最初はほんの冗談のつもりでね、みんながあの本を真に受けるとは思ってもみなかったんだ。脳みそが半分でもあれば、オブジェクト指向プログラミングが非直感的で、非論理的で、非効率なことくらいはわかるよね。

I： え？

S： それに「コードの再利用性」ときたら…。どこかの会社がコードを再利用したなんて話を聞いたことがある？

I： いや、実はないんだけども、でも…。
2019/02/13(水) 01:40:07.00ID:dfUEINu60
>>245
> そこまで頑くなに　C/C++ を拒絶する理由がない。

C/C++は開発効率が悪いから。
ポインタを使うのに、std::auto_ptrを使わないといけない
そして世界が混沌としていて、ポインタという基本的なものでさえ
時代が変われば使い方がガラッと変わってしまう（皮肉）
2019/02/13(水) 01:41:57.50ID:SgfrIpbp0
>>250
>ポインタを使うのに、std::auto_ptrを使わないといけない

5ch/2ch の言うことを真に受けるとそうなるが、普通に、

BYTE *ptr;
TYPE *ptr;

で済む。昔から、C++ といえばこのスタイルで、auto_ptr 自体はずっと後発で、
C++ ではないといっても過言ではない。
2019/02/13(水) 01:42:17.61ID:dfUEINu60
>>248
> だから、C/C++ がブラウザで動くのはすごく魅力的な話という事になる。

既存のC/C++の資産をJavaScriptから使うのに便利だよね〜
2019/02/13(水) 01:42:56.75ID:dfUEINu60
>>251
今どきそんなコード書かないよ？
既存のライブラリのソースコード見ろよ
2019/02/13(水) 01:43:28.32ID:GHq8zte20
>>250
>C/C++は開発効率が悪いから。

そんなことはない。メモリリークのことを気にしているなら、デストラクタの
中で解放するように1行書くだけで、ほとんどの場合はリークしないし、
危険なこともない。
2019/02/13(水) 01:44:23.63ID:GHq8zte20
>>253
ネットはおかしい情報が多い。
ちゃんと本を見たほうがいいよ。
2019/02/13(水) 01:45:15.56ID:dfUEINu60
>>254
デストラクタの中で解放する1行を書き忘れた場合、それでも動くから
どこかで不具合が起きるだろうが、ソースが何10万行も有る
プログラムの場合、この間違えて書いてしまった行を探し出すのに苦労することになる。
2019/02/13(水) 01:45:52.84ID:dfUEINu60
ミスったｗ

デストラクタの中で解放する1行を書き忘れた場合、それでも動くから
どこかで不具合が起きるだろうが、ソースが何10万行も有る
プログラムの場合、この間違えて書き忘れた行を探し出すのに苦労することになる。
2019/02/13(水) 01:46:57.29ID:GHq8zte20
>>253
std や auto_ptr を使うから難しく感じるんだよ。
何度も言うが、それは C++ ではない。これはマジ。
今の std:: 系のライブラリはSmalltalk の信者が作ったものらしい。
C++ の標準化委員会がおかしなことになっていて、もはや、本来のC++
ではなくなってきており、だから、C++が難しいと感じる人が増えている
気がする。
2019/02/13(水) 01:47:47.99ID:dfUEINu60
>>258
え？お前C++使いこなせないの？
2019/02/13(水) 01:48:20.38ID:GHq8zte20
>>257
クラスが 100種類の場合、デストラクタは 100 個しかない。
だから、ソースが数10万行あっても、100箇所を調べるだけで済むよ。
2019/02/13(水) 01:49:31.69ID:dfUEINu60
>>260
調べる箇所が100箇所でも
何を解放し忘れたかを確認するのは大変
2019/02/13(水) 01:49:40.75ID:GHq8zte20
>>259
日本だと auto_ptr みたいなのが C++ だと思ってる人がいるけど、
勘違いだよ。
2019/02/13(水) 01:51:15.37ID:dfUEINu60
stdなんちゃらを使わなかったら
バッファオーバーランで脆弱性になるし
それでも動くから
どこかで不具合が起きるだろうが、ソースが何10万行も有る
プログラムの場合、この間違えた行を探し出すのに苦労することになる。
2019/02/13(水) 01:51:20.27ID:GHq8zte20
>>261
だから新しい言語を次々に覚えて C/C++ だけは覚えないで過ごしてきたのかな、
あなたは？
数十の言語を覚えるより、C/C++ を1つ覚えるだけが良いと思うよ。徹底的に
それだけを学んだほうが良い。
2019/02/13(水) 01:51:48.19ID:dfUEINu60
>>262
勘違いとかそうでも良いわｗ
auto_ptrが使えて、実際にauto_ptrが使われるがC++だから
2019/02/13(水) 01:53:24.20ID:dfUEINu60
>>264
はいそうですね。C/C++は数十の言語を覚えるのと同じぐらい苦労しますもんね
いろんな言語の機能をキメラのように組み合わせた言語ですから
人によって書き方がぜんぜん違う

auto_ptrを使ってるだって！？これC＋＋じゃないよ！
って言う人がいるぐらいだから

だから開発効率が悪い
2019/02/13(水) 01:54:19.14ID:5ssU2x9I0
さもTypeScriptが競合であるかのように突っかかってきてるが全く的外れ。

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

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

もちろんナマのJSはWeb界のグルー言語として残り続けるよ。
シェルスクリプトが性能を理由に消えないようにね。
2019/02/13(水) 01:54:36.76ID:GHq8zte20
>>263
そうならないように、C から C++ に進化してきたんだ。
そのために、コンストラクタ、デストラクタの概念が導入された。
それだけでも十分に安全で簡単に書ける。
逆に、std ライブラリは構造が理解しにくいので難しく感じるんだろう。
auto_ptr とか使おうとすると、C++ は一気に煩雑で嫌いになってしまうと思う。

だから、auto_ptr も std:: 系ライブ来も SmallTalk 信者が作ったものであって、
C++ の流儀とは全く異なる異質なもの。C++ で SmallTalk をやろうとするので
めちゃくちゃ複雑になってしまっている。
2019/02/13(水) 02:22:49.78ID:GHq8zte20
>>266
>はいそうですね。C/C++は数十の言語を覚えるのと同じぐらい苦労しますもんね
C++98 まで覚えれば大体C++の基本は習得できていて、それはそんなに大変
ではない。

・auto_ptr 系は、uniq, smart など沢山ありすぎるので、初心者には難しく、
　下手に使うと、生ポインタより危険かも知れない。これらはかなり後発のものなので、
　最初は覚える必要はない。
・std:: 系ライブラリは後から習得すればよい。
2019/02/13(水) 03:28:22.27ID:NEY8ay330
>>229
マジで？！
だって公式のデモはiPhoneだと動かへんで？
2019/02/13(水) 04:23:45.97ID:VGvE+KfY0
>>270
まさかSafariとか使ってないよね？
2019/02/13(水) 08:13:08.13ID:a9PctXZid
C/C++は使うべき場面が決まってるから他の言語と揉めたりしないと思ってたんだが。
2019/02/13(水) 09:05:05.03ID:yk1KGOSba
なんかSafariだけで動くwasmの代替品独自に作ってなかったっけ？
2019/02/13(水) 09:40:07.95ID:SgfrIpbp0
>>271
SafariもWasmはサポートしてると読んだけど、確か。
2019/02/13(水) 09:53:24.60ID:GHq8zte20
TypeScript って、MSの独自言語なんだよね、知らないけど。
2019/02/13(水) 10:06:57.83ID:GHq8zte20
>>261
例えば、VS の VC++ で C++ ソースをデバッグモードでビルドして、できたバイナリを
デバッガで実行すると、そのアプリの終了時に、メモリーリークが起きているか
どうかがIDEの Output Pane に出力されるようになっていて、その際、どのソースの
何行目で new TYPEしたオブジェクトが解放し忘れているかが、ずらずらと一覧表示される。

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

例外として、複数のポインタから同じオブジェクトを参照していて、かつ、そのポインタ
が永続的にグローバル変数や、何らかのクラスのメンバ変数に格納されている場合には、そこまで
単純には行かない。その場合は、プログラマが頭で考える必要がある。
2019/02/13(水) 10:21:08.64ID:uBt5bsN50
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に絡むとはいえスレチ気味で
しかも古いやり方の話を何レスしてるんだか・・・
2019/02/13(水) 12:08:13.64ID:ARXdU5axd
>>274
カバーしてる範囲が他のブラウザーに比べてかなり狭い
2019/02/13(水) 12:29:26.16ID:PdBWBPPzd
このスレ的にはわざわざC++使うんじゃなくてTS→wasmじゃないの
2019/02/13(水) 13:09:58.06ID:cmhWA5saM
tsnativeかts.net来ないとwasmにはコンパイル出来ないだろ。
せっかくAltJS戦争に勝ってブラウザのjsに対する忖度パワーをすべて手に入れたのにわざわざwasm戦争に参入する必要はないだろ。
c++の構文が古くさすぎ冗長すぎで嫌、rustの構文はキモすぎて嫌と言うならkotlinかc#にすれば。
2019/02/13(水) 18:53:44.11ID:Wb2hS8BD0
>>249
C++ はひどい言語だ。これは、多くの平均以下のプログラマーが使ってるために
さらに輪をかけてゲロゲロになっていて、どうしようもないゴミが
簡単に生産されるようになってる。正直いって、C を選ぶ理由が C++ プログラマーを
追っぱらうため *だけ* だったとしても、それ自体、C を使う強力な理由になりうる。

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

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

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

言いかえれば、唯一まともで、効率がよくて、システムレベルで使えて、移植性がある
C++ ってのは、基本的に C で使える機能だけに限ったときなんだ。そして C だけに
限定するってことは、他の人がそれをめちゃくちゃにしないってことで、
ついでに沢山のプログラマが実際に低水準の問題を理解することができて、アホらしい
「オブジェクト・モデル」のたわごとを持ちこまないってことだ。
2019/02/13(水) 20:56:27.69ID:kDMwAzYp0
VuexとReduxってどっちがムズイの？
2019/02/13(水) 20:56:51.46ID:kDMwAzYp0
もしかして考え方同じ感じ？
2019/02/13(水) 21:10:22.40ID:tuDfzjia0
Angularってwikipediaには「フロントエンドWebアプリケーションフレームワーク」って書かれてるけどまさにその通りだよな。javascriptのフレームワークって感じではないわ。
HTMLとCSSとjavascriptの技術を採用したwebサイト開発フレームワークって感じ。
285デフォルトの名無しさん (ｵｯﾍﾟｹ Srd1-da9w)
垢版 |
2019/02/13(水) 21:18:15.13ID:sgtLrhrBr
Reduxのほうがムズいけど、これからやるならReduxがいい
2019/02/13(水) 21:20:44.51ID:dfUEINu60
>>284
JavaScriptのフレームワークって感じではないって意味がわからんぞ。

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

別の言語なら、〇〇（言語）のフレームワークなんてものが存在するのか？
2019/02/13(水) 21:31:05.74ID:kDMwAzYp0
angularとReact、Reduxってどっちが簡単？
2019/02/13(水) 21:51:18.70ID:jwc/pNVH0
学生時代、英単語の暗記が得意だったやつはangular、数学が得意だったやつはreact
2019/02/13(水) 22:24:48.70ID:tuDfzjia0
>>286
なるほど。
ピュアjavascripで書いたら大変な記述をちゃちゃってやってくれるからスレタイの3つとかjqueryとかはjavascript(の)フレームワークって呼ばれてると思ってたんだがとんだ勘違いだったのね。
2019/02/13(水) 22:28:21.60ID:tuDfzjia0
冷静に考えれば>>289はライブラリか。
2019/02/13(水) 22:33:40.93ID:cHKWNBlR0
jqueryとreactは自称ライブラリ、vueとangularは自称フレームワーク
公式サイトのトップを見た限り
2019/02/13(水) 23:20:38.84ID:dfUEINu60
>>289
それを言ったら、jQueryで使うのはピュアJavaScriptだし
Angularで使うTypeScriptやReactで使うJSXは
ピュアJavaScriptではないけどさ
2019/02/13(水) 23:44:57.61ID:D91GFqhb0
react捨てるにしてもreduxの考え方は学んどいて損はないよ。
2019/02/13(水) 23:51:17.06ID:jwc/pNVH0
hook apiとcontext apiデフォで使えるようになるから個人ユースの規模ならredux必要なくなるよ。
2019/02/14(木) 08:50:15.44ID:4Gf71Z9ua
>>284
Angularと比べるならVueとよりもNuxtと比べる方が合理的だな
2019/02/14(木) 08:51:45.88ID:4Gf71Z9ua
>>286
コーディングはすべてTypeScriptだけどね
2019/02/14(木) 09:00:56.39ID:kPGufiyx0
ものは試し
初心者だがAngular勉強してみるわ
298デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/14(木) 11:29:40.87ID:MlsuSDTjr
reactにしとけ
2019/02/14(木) 12:15:57.21ID:nZj2/pMr0
React勉強したがやっぱりウェブサイトの殆どには適用できない技術だな
例えばニュースサイトにReactを導入するメリットはないだろう
2019/02/14(木) 12:30:22.33ID:mbps9XCNa
融通が利くのはVue
2019/02/14(木) 12:39:53.13ID:HVhxRx5Ma
MVC+Vueが世界最強
2019/02/14(木) 12:43:26.84ID:QUGQ3bvOr
>>299
画面遷移がなくなるからメリットはありだろ
2019/02/14(木) 13:14:13.76ID:kPGufiyx0
Reactにした
Angularバージョンで詰みそうになる感じだし
学習リソース少ないし
2019/02/14(木) 13:22:31.29ID:MhXZGfUyd
潰しの効かなさを除けばAngularが一番いいと思う。ガッチリした設計な分だけ迷わずに使えるしプロジェクト管理もしやすい。
ただ習得してもキャリア的なメリットが薄そうだから自分で選択する気になれん。
2019/02/14(木) 13:27:23.06ID:DBAMfZpK0
当分は問題ないだろうけどAngularは将来的にはどうなるんだろうな
同じくGoogle製でしかも競合となるFlutter/Hummingbirdのリリース準備が進んでるみたいだし
306デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/14(木) 14:07:13.01ID:MlsuSDTjr
世の中的にはReactが主流
2019/02/14(木) 14:42:13.00ID:nZj2/pMr0
>>302
画面遷移をなくせなんて誰からも要望来てないんだが？
2019/02/14(木) 14:43:08.15ID:nZj2/pMr0
VueもReactもAngularも将来性はないよ

近い将来にWebComponentに
置き換わることが決定している
2019/02/14(木) 14:51:21.14ID:kPGufiyx0
>>308
逆って聞いたけど
2019/02/14(木) 15:15:15.70ID:nZj2/pMr0
逆って今WebComponentがないのに
今WebComponentを使ってるわけ無いだろ
311デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/14(木) 15:35:58.92ID:MlsuSDTjr
>>307
お前バカだろ？
だいぶバカだな
2019/02/14(木) 18:38:55.70ID:MhXZGfUyd
結局ピュアjavascriptを真面目に身につければOK？
2019/02/14(木) 18:54:26.61ID:nZj2/pMr0
ピュアJavaScript + jQueryだな

https://w3techs.com/technologies/history_overview/javascript_library/all
73.8%に増加。今でもjQueryのシェアは圧倒的で伸び続けている。
2019/02/14(木) 18:58:38.20ID:pR+IykPzM
どうせwpだろｗｗｗ
railsが使われてるからrubyが死にきれないのと似たようなもんｗｗｗ
2019/02/14(木) 19:03:26.19ID:nZj2/pMr0
だから「本当にやりたいこと＝WordPressでできる範囲のこと」なんだから
フレームワークもいらんし、どうせjQuery使われてるからjQueryでいいってことなんだよ
2019/02/14(木) 19:04:04.42ID:nZj2/pMr0
需要と供給

いくらすごいことができるようになっても
求められてないんだよ。
2019/02/14(木) 19:07:18.73ID:pR+IykPzM
間違ってないと思うがなぜwpのスレに籠らずこんなスレ来て啓蒙活動してるのかｗ
他人が勉強するのが不安で怖いんだろ？ｗｗ
そんな女の腐ったようなセコい性格だからいつまでたっても童貞なんだよｗｗｗ
2019/02/14(木) 19:08:13.46ID:nZj2/pMr0
wpを持ち出してきたのお前じゃん？
頭大丈夫か？
2019/02/14(木) 19:14:23.47ID:pR+IykPzM
論理に破綻はないが？wp圧倒してるの事実だし。現状に安穏としたいならしてれば？俺らは勉強するから、ってこと。図星刺されて恥ずかしくなっちゃったのかなｗ
お前のやってることってテストの前に勉強してるやつをガリ勉・ダサいとレッテルはって集団でみんなで堕落しようとセコい行動する女みたいなんだよｗ
男でそれじゃダメだよ。
2019/02/14(木) 19:14:29.36ID:fSoz/vTj0
angularは勧めんな。railsもそうだがああいう丸ごと全部なものになれると
それ以外なんもできなくなる。
321デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/14(木) 19:17:17.50ID:MlsuSDTjr
wpしか使えない底辺カスは死ぬまでjquery使ってろ
2019/02/14(木) 19:20:32.23ID:nZj2/pMr0
>>319
> 論理に破綻はないが？wp圧倒してるの事実だし。

wp圧倒してるの事実である根拠は？
事実だとしてそれがjQueryにどれだけ影響してるの？
wpのシェアなんてウェブ全体からすればたいしたことないじゃない
2019/02/14(木) 19:21:17.93ID:DfU+cSuaa
新しいフロントフレームワークが出た時に丸ごとすげ替えれるならなんでもいいよ
俺はMVCがベストバランスの正解だと思うがね
2019/02/14(木) 19:22:01.34ID:nZj2/pMr0
backboneを勉強した人は無駄になった。
Angularも1系を勉強した人は無駄になった。
jQueryは登場してから13年使われ続けている。

これが現実やで
325デフォルトの名無しさん (ﾜｯﾁｮｲ c701-+o2P)
垢版 |
2019/02/14(木) 19:25:35.68ID:OfZpiUzn0
wpの保守死ぬほど大変だけどな。てかフレームワークとwpは全く別物だろうよ。ブログのフレームワークと言えない事も無いが。
2019/02/14(木) 19:38:24.66ID:pR+IykPzM
>>322
ビルトインされてるよ。テーマによってはwpビルトイン版と競合を避けるため他のバージョンを別に導入する場合もある。
そしてwpのシェアはcms中では60%、全Web中では33%
だからwp除くならjQueryは40%程度だなｗ
2019/02/14(木) 19:43:27.31ID:nZj2/pMr0
> だからwp除くならjQueryは40%程度だなｗ

圧倒的シェアじゃないか！
2019/02/14(木) 19:50:59.92ID:pR+IykPzM
最初からシェア小さいとは言ってないだろｗ
増加してるのはwpのシェア増につられてだろうと予測しただけ。
おそらく合ってるなｗ
jQueryバカが威張るのは滑稽。
329デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/14(木) 20:14:34.64ID:MlsuSDTjr
jqueryしか使えないバカが多い
バカのくせにバカを賛美している
2019/02/14(木) 20:27:26.21ID:nZj2/pMr0
所で仮想DOMのアプローチって本当に速いのかな？

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

そんな事しないで、CSS使って要素を隠したり表示したほうが速いない？
jQueryはDOM操作が得意なわけだけど、DOMを作ったり削除したりするんじゃなくて
classを変更して見た目を変えることで擬似的にDOMが表示されたり消えたりするって
いうのがベストプラクティスだと思ってる。この場合はDOMの構築をやらないので
仮想DOMのアプローチよりも速いんじゃない？
2019/02/14(木) 20:30:52.74ID:RyxU72PZ0
cssのが早いのは当たり前だろ…
お前、こういうスレ来るのは10年早いよ。
真摯に勉強しろやマジで。スレタイ読まずに荒らしてないでさぁ
2019/02/14(木) 21:08:57.94ID:kPGufiyx0
VuexとReduxって難易度変わらない？
2019/02/14(木) 21:10:34.79ID:nZj2/pMr0
どちらも単に面倒くさいだけじゃないの？
2019/02/14(木) 21:11:54.44ID:nZj2/pMr0
正直Reduxとか使うよりも、カスタムイベントを使ったほうが楽だと思う
335デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/14(木) 21:25:16.30ID:MlsuSDTjr
マジでお前来るなよ
スレチクソキチガイが
テメーの妄想なんかどうでもいいんだよ
勝手にjqueryスレ立ててそっちでやれバーカ
2019/02/14(木) 21:53:19.44ID:nZj2/pMr0
だが断る
2019/02/15(金) 07:48:37.76ID:ayjwUPM20
>>304
そういう観点ならNuxtでもいいと思う
2019/02/15(金) 08:12:30.75ID:+Jrl5jTr0
Vueが最強なんじゃね？
仕事ならReact
2019/02/15(金) 08:39:56.97ID:5wBlw8GS0
仕事でもnuxtつこてるわ
angularとreactは敷居が高め
他のメンバーが嫌がるのよ
2019/02/15(金) 08:56:20.31ID:EFNDTiKGa
そういやVueでもjsx使えるとかVueの和書の一番厚い本に書いてあったな
2019/02/15(金) 09:54:44.63ID:Nwwq6bubM
reactのために作ったってだけである種類の関数の入れ子をxml風に記述できるというだけの独立した仕組みだからreact関係なく使えるよ。
2019/02/15(金) 13:09:17.41ID:YF3F5Mzod
>>337
そうなのか。興味湧いてきたのでちょっとNuxt試してみます。
343デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/15(金) 19:10:03.96ID:s9lB6bHor
ReactやVueやる奴らは当たり前だがフロントデザインやUXできるんだよな？
344デフォルトの名無しさん (ﾜｯﾁｮｲ c701-+o2P)
垢版 |
2019/02/15(金) 19:14:19.75ID:uyGcnsGR0
>>330
仮想domのメリットは最終的にはリアクティブ。その例で言えばjQueryは要素を消すのに.hide()して直接domを操作するが、リアクティブでは単に変数をfalseするだけになる。
複雑な入力フォームも恐ろしく作りやすくなるから、一度vueの公式見るといい。
2019/02/15(金) 19:47:12.24ID:fQG3bb7RM
勉強しなくていい言い訳探しに来てる奴に何言ってもムダ
2019/02/15(金) 21:10:18.28ID:Tr9ixmy70
>>344
> その例で言えばjQueryは要素を消すのに.hide()して直接domを操作するが、
あー、それがお前の根本的な間違いなんだよ。
お前っていうか、世間一般？使い方間違えてるんだよね。
そういうDOM操作なんてしません。

jQueryでは単にHTMLのclassの（例えば）activeをdeactiveにするだけになる。
複雑な入力フォームも作れるし、classを変えるだけで全く違った表示にすることができる
そのフォームを使ってる間JavaScriptは全く使用しない。
デザイナが自由に好きなデザインで作ることができる。
そしてjQueryではclassの値を変えるだけになる。
2019/02/15(金) 21:28:10.41ID:LmytZ3o2d
>>343
むしろそっちのが専門や
2019/02/15(金) 21:31:08.33ID:fQG3bb7RM
jQueryのhideはdisplay: noneだろ。
active、deactive（笑）に至っては意味不明。
jQueryではそういうときはactiveクラスをtoggleClassで付けたりはずしたりするんであって、active外してdeactive（笑）つける、deactive（笑）外してactive付ける、なんてマヌケなことはしません。
やっぱりね、自分が勉強したくないもんだから他人の足を引っ張ろうとするような女の腐ったような童貞は自分が上げてるライブラリもまともに使いこなせないｗｗミジメ過ぎｗｗｗｗｗ
2019/02/15(金) 21:33:20.85ID:kkRd+/gL0
jQueryからreactならそこまで乗り換えコストかからんと思うけどな。
350デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/15(金) 21:46:27.22ID:s9lB6bHor
>>347
合格
2019/02/15(金) 21:48:11.36ID:Tr9ixmy70
>>348
ん？お前俺が言ったことと大差ないよな？

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

でそれが>>330で書いたことにつながるんだよ。
仮想DOMは最終的にDOM操作をするから遅くなるが、
jQueryではCSSによって見た目を切り替えるだけだから速いってこと
2019/02/15(金) 21:51:50.27ID:zC296ldL0
いやDOM APIを通じて操作するんでしょ
2019/02/15(金) 22:06:11.07ID:Tr9ixmy70
>>352
そりゃVueやReactだって最終的にはDOM APIを通じて操作するよ
ただしその操作の内容を、DOM要素の削除や追加じゃなくて
クラス名を変えて表示を切り替えるだけにすると速いってこと
2019/02/15(金) 22:07:28.91ID:NXuVhChr0
Angularの方が難しいの？　Reactの方が自由に構成決めたりコーディングしたり出来る分、
自分で決めなきゃいけない事が多くなって逆に難易度高いって聞いたけど。

Angularの方が環境構築も規約も全部世話してくれるから楽だって聞いたからAngularから入ったんだけど。もしかして騙された？
2019/02/15(金) 22:10:09.24ID:I8iEDAq80
>>354
英語などの単語の暗記が得意だったならangular
数学が得意だったならreact
2019/02/15(金) 22:14:49.66ID:fQG3bb7RM
さすがjQueryバカ。伊達に名前にバカって付いてないな。
クラスの付け外しも厳然たるDOM操作。
そんなことも分からないとは…使われるjQueryもかわいそうだ。
2019/02/15(金) 22:20:03.31ID:I8iEDAq80
そもそもjQueryのコア機能はDOM操作なんだが…
DOM操作しないならjQuery要らねーよ。
贔屓のライブラリの存在理由否定してどうする。
2019/02/15(金) 22:22:45.45ID:Tr9ixmy70
>>357
DOM操作のうち、class属性を変えるだけにするということ
そしてCSSでブラウザにネイティブ処理させるから速いんだよ
要素の追加や削除は必要最小限にするのが鉄則
2019/02/15(金) 22:29:21.05ID:Tr9ixmy70
>>354
自分がやりたいことと、フレームワークが提供してくれる機能とのバランスだよ

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

更に言うならウェブサイトみたいなものはjQueryで十分ってこと
2019/02/15(金) 22:30:21.14ID:fQG3bb7RM
> ネイティブ処理させるから速いんだよ

だったらネイティブのDOM API使うわｗ
You Don't Need jQuery!
https://blog.garstasio.com/you-dont-need-jquery/dom-manipulation/
2019/02/15(金) 22:33:24.44ID:Tr9ixmy70
>>360
それもバランスの問題だな。
そこ見ても分かるだろ？いずれの例もjQueryの方が短く書けている
開発効率の高さがあるからjQueryのほうが良い訳
2019/02/15(金) 22:34:33.79ID:fQG3bb7RM
せっかくだから日本語版
jQueryは必要ない（You Don't Need jQuery）
https://github.com/nefe/You-Dont-Need-jQuery/blob/master/README-ja.md
2019/02/15(金) 22:37:44.38ID:Tr9ixmy70
フレームワークの欠点は単純なウェブサイトでは
生産性を落とすという大きな問題があるってこと
364デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/15(金) 22:38:05.96ID:s9lB6bHor
https://i.imgur.com/obAeeP9.png
2019/02/15(金) 22:38:49.90ID:Tr9ixmy70
ついでだから、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';
}
2019/02/15(金) 22:41:31.02ID:fQG3bb7RM
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
367デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/15(金) 22:43:21.30ID:s9lB6bHor
DOMにノードを追加すると、DOM APIと直接対話するVanillaを1回呼び出すだけで済みますが、jQueryは多くの操作を実行します（スタックが長すぎて画像に収まりません）。違いは明らかです。

Vanilla：4ミリ秒
jQuery：95.3ミリ秒
Vanilla Javascriptは、追加時のjQueryよりも約25倍高速です。
2019/02/15(金) 22:44:41.61ID:Tr9ixmy70
>>367
いや、だからそんなことをしないで、クラスの書き換えだけを
やることで高速化できるって言ってるんだよ
話ついてきてね
2019/02/15(金) 22:48:19.07ID:zC296ldL0
>>359
使い分けって言いながらフレームワーク要らないって言うから意味不明になるんだよ
「自分の仕事では」要らないって話だろ？
370デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/15(金) 22:51:08.66ID:s9lB6bHor
>>368
class追加するだけでもjqueryより10倍速いんですが？
https://i.imgur.com/nEJCnHz.png
2019/02/15(金) 22:51:38.93ID:7RVZ/4z70
削除はともかく、追加がクラスの書き換えだけの訳ないわな。その書き換える対象がまだ無いんだから。
2019/02/15(金) 22:51:58.45ID:fQG3bb7RM
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倍もコード容量かけて何やってんのｗｗｗｗｗ
2019/02/15(金) 22:54:11.02ID:I8iEDAq80
ボコボコでワロタｗ
我が物顔でスレチ荒らしするからこうなるｗｗ
2019/02/15(金) 22:54:50.30ID:Tr9ixmy70
>>372
じゃあnano使えば良いんじゃないですか？
フレームワークよりも大幅に小さいし
2019/02/15(金) 22:56:00.99ID:Tr9ixmy70
ウェブサイトではフレームワークは重すぎで生産性を下げるという
大きな問題があるが、jQueryやnanoはDOM APIの冗長性を省くだけだから
生産性は上がるしか無いというのが大きなメリットなんだよ
2019/02/15(金) 22:59:32.27ID:fQG3bb7RM
まあjQueryがいらないのは確かだね。
要素のstyle操作程度ならなおさらね。
「DOM操作しない方がいい」って言ってたし、じゃあDOM操作ライブラリのjQueryはいらないねｗ
え、やっぱりDOM操作したい？そして短く書きたいって？
100倍軽いnanoがあるよｗ
2019/02/15(金) 23:04:02.60ID:Tr9ixmy70
nano信者か・・・
2019/02/15(金) 23:05:15.16ID:Tr9ixmy70
そういやzeptoとかもあったけど、
今までの経験上、軽いだけの代替ライブラリは
結局本家を超えることって無いんだよな
nanoが普及すると良いね
2019/02/15(金) 23:09:04.09ID:ca0WBun30
すまん、ガチで話についていけてないんだが、>>351でjQueryは速いって書いてあるからjQueryは速いのか！って思ってたんだけど結局遅いの？
2019/02/15(金) 23:11:01.96ID:zC296ldL0
何をもって速いとするかに依る
2019/02/15(金) 23:11:48.08ID:ca0WBun30
>>380
速さを求めるときに使うもの？
2019/02/15(金) 23:12:36.21ID:fQG3bb7RM
GitHubがjQuery辞めたので https://ushirock.hateblo.jp/entry/2018/07/28/013507

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

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

やっぱり jQuery といえば Sizzle でのセレクタ解析が遅いとか（querySelectorが使える場合優先されるらしい）ネイティブへの置き換えとかに目が行きがちだけどもこういう深い話でのデメリットもあるんだなと
2019/02/15(金) 23:14:27.13ID:Tr9ixmy70
>>379
jQueryが速いなんて言ってないんだが？
ファイルサイズではフレームワークよりも小さいから
初回ダウンロードは速いだろうけど。

速いって言う話はDOM操作で要素を消したり作ったりするよりも
classを変更するだけにしてCSSで表示したり見えなくしたりするほうが
速いだろうってこと。
2019/02/15(金) 23:15:42.26ID:fQG3bb7RM
jQuery。それは、

・遅い

・重い

・アンセキュア

なDOM操作ライブラリ。
2019/02/15(金) 23:16:58.62ID:Tr9ixmy70
>>382
ソースコードざっと見たけど、evalが見当たらないんだけど何行目にある？
https://code.jquery.com/jquery-3.3.1.js
2019/02/15(金) 23:17:08.57ID:NXuVhChr0
jQueryを使うのって、速さ云々より一つのコードがどんな環境でも同じ様に動くって所なんじゃないの？

ブラウザの種類やバージョンでJavascriptの挙動の違いがあるから、それを吸収する為にjQueryを使うんじゃない？
2019/02/15(金) 23:17:55.89ID:zC296ldL0
>>381
はっきり言ってjQueryが遅いとは思わない
熟練した人が地道に管理すれば十分速い

それが手間じゃねぇの？ってのがフレームワークの意義
2019/02/15(金) 23:21:18.07ID:Tr9ixmy70
>>384
jQueryってDOM APIを使ってるだけなのに
なんでアンセキュアになるの？
2019/02/15(金) 23:21:36.55ID:ca0WBun30
>>383
そうか、なんかすまん。

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

この部分読んで仮想DOMは遅くてjQueryは速いのか！って解釈しちゃったんだが仮想DOMに比べて速いだけでjQueryも速くないんだな。
2019/02/15(金) 23:25:42.00ID:ca0WBun30
>>387

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

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

とりあえず俺にはこのスレの会話を理解する能力が足りないっぽい。
2019/02/15(金) 23:28:54.96ID:ca0WBun30
まあ1つの処理に4ミリ秒って時点で衝撃的な遅さだしweb開発の世界はそんなもんなのか。
2019/02/15(金) 23:31:51.99ID:I8iEDAq80
jQuery使うと100ミリ秒になるけどなｗ
2019/02/16(土) 00:34:30.68ID:oKtXVOCjd
vue.jsが
やたらめってら、もてハヤサれる昨今だけど
ぶっちゃ毛v-forが仕様としてオワッテると思うわ。
それとuidの生成パターンをC言語なら「ポインターが理解でないワケ」や
「ポインター徹底攻略」、、、JAVAならデザイパターン本みたいな
分厚い本で説明しなきゃ
いけないのに、それを全くやってないよな。
俺が考えるvue.jsが広まらないワケだよ。コンポーネントをどうユーザーが
受けとるべきかも、簡単な再帰などを使ってイラストレートしなきゃいけないのに
これも全くやってない。細々としたシステムは売り込んでるけど
vueの長所が全くされてない
394デフォルトの名無しさん (ﾜｯﾁｮｲ c701-+o2P)
垢版 |
2019/02/16(土) 00:34:57.77ID:fcnsYPNW0
早い遅いじゃなくて開発効率の話だろ。domを直接指定して操作云々はもう止める、最小限にするて事。今後確実にそうなるのは皆分かってると思うが。
2019/02/16(土) 00:44:30.53ID:HVh9Xg4td
実行速度の話をしてる人たちに、いきなり開発効率の話をしだすのは草。なんの関係もないじゃんw
2019/02/16(土) 01:34:13.23ID:SPTGalft0
実行速度については、DOM要素を作成したり削除したりするよりも
CSSで表示したり隠したりしたほうが速いんじゃないかってだけのこと
それをやるにはVue/React/AngularよりもjQueryの方が楽ってこと

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

そのCSSによる表示切り替えを楽にやる（開発効率が良い）のは
jQueryってだけのこと
2019/02/16(土) 01:47:37.10ID:P5gjDjW+0
DOM要素の追加削除とCSSの表示切り替えって役割が違わね？
2019/02/16(土) 01:49:25.92ID:P5gjDjW+0
CSSの表示切り替えは既に存在する要素に対して行うのに対してDOM要素の追加は動的に要素を追加するためにやるもんだと思うんだが。
この2つは比べるべきものなの？
2019/02/16(土) 01:59:26.44ID:P5gjDjW+0
スレタイの3つとかはSPAのような高性能なブラウザアプリを作成するものでしょ。例えばofficeとかslackとか。CSSの切り替えだけでいけるの？
2019/02/16(土) 02:11:14.67ID:yZTjSyit0
相手せんでええよキチガイだから。
2019/02/16(土) 04:00:16.99ID:H80q57B70
>>354
難しいというより学習コストが高い＝最低限として覚えなきゃいけない事が多い
その反面必要な機能をサードパーティーから探してくる必要性がかなり低い
2019/02/16(土) 04:05:31.34ID:H80q57B70
>>379
普通にUIとして使う分にはそんなに気になるほどの事でもないけど
Canvasに連続的に描画とか行う場合はダイレクトにその遅さが目立つってくらいかな
403デフォルトの名無しさん (ﾜｯﾁｮｲ c701-+o2P)
垢版 |
2019/02/16(土) 06:51:31.57ID:fcnsYPNW0
早いからじゃなくて便利だからjQueryを使うんだろ。なんで今更速度の話になってんの？
2019/02/16(土) 07:10:24.28ID:H80q57B70
最近ブラウザでWebRTCとかやるのもわりとあるケースだし遅いってのは無視できない問題でもあるよ
405デフォルトの名無しさん (ﾜｯﾁｮｲ 8701-z6VA)
垢版 |
2019/02/16(土) 07:20:20.26ID:Ka3Sv0NV0
>>403
jQueryは仮想DOM操作より早いと信者が言い出したから。
2019/02/16(土) 08:04:12.49ID:SPTGalft0
>>405
デマ乙

>>330を見れば分かるが仮想DOMよりも
classの変更で表示・非表示の切り替えをしたほうが速いって言ってる
2019/02/16(土) 08:58:01.91ID:P5gjDjW+0
もう一度聞くけど、classの変更でできることって限られてるでしょ？見た目の操作だけかな？
それが仮想DOMより速くてもどうしようもなくないか？役割が違うんだから。
なんか自分の間違いを認めたくないから無理やり話をすり替えようとしてるようにしか見えないんだが…
2019/02/16(土) 09:01:46.50ID:mveZudXk0
>>406
仮想DOMだって属性の値にしか差分がないことがわかったらそれだけ反映するようにはできるだろ。
これなんかわかりやすい。
https://kuroeveryday.blogspot.com/2018/11/how-to-create-virtual-dom-framework.html
409デフォルトの名無しさん (ﾜｯﾁｮｲ c701-+o2P)
垢版 |
2019/02/16(土) 11:06:01.11ID:fcnsYPNW0
スレタイから逸脱しすぎてると思ったらjQueryと比較してる奴がいるのか。。もう何年も前に通り過ぎた話題だぞ。前見ようぜ。
410デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/16(土) 11:13:52.65ID:jR4qOrfsr
ReactとかVueすら使えない超低レベルなクソジジイが騒いでるだけだから
2019/02/16(土) 11:14:50.85ID:SPTGalft0
>>407
> もう一度聞くけど、classの変更でできることって限られてるでしょ？見た目の操作だけかな？

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

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

仮想DOMではDOM操作を最適化して必要な場合だけ実行するが
速度の話をするならそもそもDOM操作自体を減らそうという発想にしたほうが良いと思う
要素ごとにイベントハンドラを設定するよりも、
要素の親に一つだけイベントハンドラ設定したほうがいいわけだし
2019/02/16(土) 11:35:47.92ID:H80q57B70
こっちでやったら？

Webフロントエンドで脱jQueryを目指すスレ
https://mevius.5ch.net/test/read.cgi/tech/1547896353/
2019/02/16(土) 11:38:28.40ID:auHH3gBua
使える使えないと使う使わないは別のこと
jQueryが殆どの場合最適解でSPAが勝てる領域はかなり狭いという事実を見失っちゃいかん
2019/02/16(土) 11:41:22.10ID:SPTGalft0
SPA、シングルページアプリケーションであって
シングルページウェブサイトじゃないからな

アプリケーションの時点で、ならネイティブアプリにしろよって
言われる時代
2019/02/16(土) 11:52:58.50ID:R2hmaITu0
勝手にそんな時代を作るな
2019/02/16(土) 11:56:31.80ID:H80q57B70
まぁ正直フレームワークは知らなくてもいいかも知れんがNodeを知らないと確実に困る時代にはなってくると思う
2019/02/16(土) 12:00:35.69ID:auHH3gBua
ネイティヴアプリは環境差異とデプロイメントがめんどくさいんだよね
dockerがGUIをサポートしてくれたら乗り気になるかもしれんがな
2019/02/16(土) 12:09:05.56ID:SPTGalft0
>>417
それはウェブでも変わらん。カメラ使おうと思ったら
ブラウザごとに使うAPIは違うし、端末ごとに対応してる
解像度も違うし散々だったぞ

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

一般ユーザー向けにアプリを配布するならSnapsなどを使う
GUI対応でディストリ非依存のパッケージ管理システム
2019/02/16(土) 12:16:07.61ID:H80q57B70
>>417
ネイティブの面倒なところはそこよりも
OSの差異で動かなくなったりするところだな特にiOSとか
2019/02/16(土) 12:19:58.87ID:auHH3gBua
>>418
Snapsってdockerのように依存関係や実行時の環境もカプセル化してくれんの？
2019/02/16(土) 12:34:18.62ID:msvpDp2N0
>>419
その差異をブラウザは吸収できないんだよね
だからみんなネイティブアプリにする
2019/02/16(土) 12:41:53.08ID:R2hmaITu0
みんなって誰だよ
勝手に決めるな
2019/02/16(土) 12:43:59.75ID:P5gjDjW+0
>>411
具体例をお伝えした方がいいのだろうか？
例えばサーバーのDBに対して検索かけてとってきた要素を並べてコンテンツだすとかclassだけでなんとかなるの？
そもそも要素を出したし消したりでなんとかなるような簡単なものにReactとか使わないものじゃね？
2019/02/16(土) 12:47:43.95ID:P5gjDjW+0
サービス提供する側としてはネイティブよりSPAの方がよいケースはままあるでしょ。
例えばインストーラーが不要、そもそも技術者がいない、今までの資産をそのまま流用できる、とかとか。
ハードを限定しないソフトウェアの提供形態って殆どの場合は都合できまるもんだと思う。
2019/02/16(土) 12:50:25.75ID:0+4MW20ta
ネイティブはストアにリリースすんのがイチイチめんどくさい
426デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/16(土) 13:05:39.77ID:jR4qOrfsr
jqueryしか使えない無能の自己紹介はいらん
消えろカスジジイ
2019/02/16(土) 13:13:23.51ID:dSQ6SPUO0
Angular習得した後にjQueryで書かれたコード見たら吐き気がしてくるわ。

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

まぁ、古いブラウザでも動くようにしなきゃならないからjQuery使ってんだけどね。
2019/02/16(土) 13:19:34.25ID:H80q57B70
>>427
Windows7のサポートが切れればなぁ
2019/02/16(土) 14:02:04.13ID:msvpDp2N0
>>427
お前が書くコードがクソなだけｗ
2019/02/16(土) 16:10:27.79ID:dSQ6SPUO0
>>428
サポート切れてても「壊れてないから」とか「投資できる余裕がない」とか「基幹システムが新しいOSに対応していないから」って理由で
古いOSと機械を使い続ける客もいるんだよなぁ。あんまりよろしくは無いんだけど。

>>429
jQueryベースでデータバインディングみたいなコード書けるん？
書けるなら書き方教えてくれや。こちとら嫌々でもjQueryとは付き合っていかなきゃなんねーんだよ。
2019/02/16(土) 16:16:01.06ID:sYjKK7tj0
イベント使え
432デフォルトの名無しさん (ﾜｯﾁｮｲ c701-+o2P)
垢版 |
2019/02/16(土) 17:30:33.50ID:fcnsYPNW0
>>430
使ったことないが、backboneやKnockoutやらのIE7でも動くライブラリ使ってみれば？ただ今更勉強する意義を考えると辛いなあ。。
2019/02/16(土) 18:08:11.34ID:auHH3gBua
旧ブラウザサポートはお高くなりますよ？
これでほとんどの客が黙る
2019/02/16(土) 19:11:18.01ID:LE6s3aZE0
やっすい案件ほどクソ要求してきやがる。
2019/02/16(土) 19:38:01.61ID:H80q57B70
>>430
少なくともイントラではなグローバルサイトではサポート切れたOSの対応は打ち切っていいだろ
2019/02/16(土) 19:40:47.09ID:msvpDp2N0
Androidだとサポート切れといっていいOSはどれ？
437デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/16(土) 20:08:25.91ID:4RfOpqIfr
>>433
最新バージョンのreact使ってるけどIE11で問題なく動作しとる
2019/02/16(土) 21:03:12.87ID:H80q57B70
正直互換性の点ではIE11よりもEdgeの方が癖があるんだよね
まぁEdgeもChromiumベースになる計画があるらしいしEdgeのChromium化とWindows7のサポート打ち切りが来ればパブリックサイトは随分シンプルになるんじゃないかと思う
2019/02/16(土) 22:09:54.11ID:gLKxbWo30
chromiumになってもなんかしらイレギュラーがありそう
信用できない
2019/02/17(日) 08:20:58.26ID:O/E0SKNM0
フロントエンドなんてそんなもんだとしか言いようがない。
441デフォルトの名無しさん (ﾜｯﾁｮｲ c701-+o2P)
垢版 |
2019/02/17(日) 09:26:47.38ID:x12h9xDW0
逆に言えば進化の余地ありありと言うこと。でもフレームワーク競争もひと段落して数年は安定じゃないかな。ブラウザもChromiumとSafariに収束されつつあるし。あとはiOS safariにpush通知実装されればなあ。
2019/02/17(日) 09:30:51.46ID:Y22Zw0Bq0
プログラマには、Apple機がなくなった方が楽になると思われている。
IEが消滅して言ったのと同じ状況がApple機に対しても起きつつあると思う。
iPhoneは売れなくなった。
2019/02/17(日) 09:44:50.06ID:E0TCVuWu0
フロントエンドは端末とブラウザの進化の影響をもろに受けるからねぇ…。

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

SPAだけでも選択肢多いのに、xamarinだのcordovaだのFlutterだのと。
こっちとしては「クロスプラットフォームアプリ開発するなら結局どれ選べばいいんだよ」的な状態だわ。
2019/02/17(日) 09:48:46.68ID:Y22Zw0Bq0
結局、大きい組織が作ったものを使っていくようになるんだろう。
2019/02/17(日) 09:49:49.70ID:eXZp7YPc0
Apple機さえ無視すれば、プログラミングが色々便利になる。
2019/02/17(日) 10:25:00.47ID:vi4O111wa
>>443
どれでもいい
フロントは使い捨て
簡単に乗り換えできるようにビジネスロジックと疎結合に作る
そこだけ死守すればなにを使ってもいい
2019/02/17(日) 10:44:59.94ID:1mijhG+I0
cordova使うならIonicでいいんじゃない？
最近はAngularだけじゃなくVueにも対応したらしいし
そういやReactNativeにもVue版出てたな
2019/02/17(日) 15:29:11.35ID:KFkN1Yft0
vueはreactパクってばっかだな。
storybookもパクってなかったか？
nuxtもnextのパクりだろ？
さすが中国人プロジェクトｗ
2019/02/17(日) 16:09:57.46ID:E0TCVuWu0
別にパクっていてもそれで良くなるなら別に何でもいいけど。ただvueは元Google社員とはいえ中国人でしかも個人開発だろあれ。

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

vue使いたがる奴なんて、vueを使いたいから使うんじゃなく、技術力低いからvueしか選択肢が無いんじゃないかと。
2019/02/17(日) 16:17:22.57ID:YF9uE98b0
技術力低くても使えるなんてコスト低くて最高だな
2019/02/17(日) 18:12:29.77ID:jxnSJIL40
どうせWebComponentsが完成したら
またガラリと世界が変わるんだから
どれ使っても一緒
2019/02/17(日) 18:17:28.09ID:1mijhG+I0
>>451
過大評価しすぎ
2019/02/17(日) 19:04:36.50ID:vi4O111wa
何れにせよあっという間に時代遅れになることは確かだ
454デフォルトの名無しさん (ﾜｯﾁｮｲ 8701-z6VA)
垢版 |
2019/02/17(日) 19:11:48.12ID:8CydzgAW0
金融系取引先においてある、およそ10年前に作られた当時先端のActionScript製RIA業務システムを見るとふふってなる。
2019/02/17(日) 19:15:44.06ID:jxnSJIL40
10年前、2009年か。なら当時最先端のAngularJSを使っていればよかったのに
2019/02/17(日) 19:19:23.16ID:jxnSJIL40
Reactは2013年だから10年前には選べない
Vueも2014年だから無理
Backboneは2010年だからギリ間に合うか？
Knockoutも2010年だな

10年前の最先端は、すべからくオワコン
ReactもVueもあと5年程度の命だろ
2019/02/17(日) 19:27:54.46ID:GfPZMs79M
*すべからく
458デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/17(日) 19:39:34.68ID:6yF6+Ynsr
Reactオワコンだからこれからはjqueryオススメ
2019/02/17(日) 20:02:00.60ID:4TiEHd4P0
>>448-449
やっぱ、Aureliaだな
2019/02/17(日) 20:17:50.30ID:1mijhG+I0
>>459
この前のレスで気になってたから今ちょうどインストールしてた
何気にAngularの一番厚い本(アプリケーションプログラミング)で主要なフレームワークとして挙がってるのな

>>448
パクリから始まったのは確かだけど今やNuxtはSSRの為だけのものじゃなく
Vueベースのフルスタックフレームワークなんだよな
461デフォルトの名無しさん (ｻｻｸｯﾃﾛ Sp7b-iTJL)
垢版 |
2019/02/17(日) 20:40:36.87ID:SrJ5Oa/9p
Reactがオワコンって即ちjsがオワコンって事だと思うんだけどそれはないんじゃないか？
462デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/17(日) 21:28:50.33ID:6yF6+Ynsr
ReactがオワコンになってjsもオワコンになってjQueryだけが使われると思ってるクソジジイが一匹いるけど
2019/02/17(日) 21:36:36.53ID:1mijhG+I0
jQueryは別にいいんだけどWebpackは知らんとこの先ついて行けんくなると思うよホント
今やブラウザでなんでもできる時代やしなんでも作らないかんくなるから何も勉強しなくても余裕とは思わん方がいい
464デフォルトの名無しさん (ﾜｯﾁｮｲ c701-+o2P)
垢版 |
2019/02/17(日) 22:05:35.95ID:x12h9xDW0
jQueryが長生きなのは認める。
2019/02/17(日) 22:23:23.44ID:jxnSJIL40
babel使うんだからwebpackぐらい使うだろ？
466デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/17(日) 22:57:23.05ID:6yF6+Ynsr
普通に使うよな
2019/02/17(日) 23:02:22.78ID:1mijhG+I0
もしかしてAureliaってCliでプロジェクト作っても碌にデモ画面も表示されない？
2019/02/17(日) 23:57:17.64ID:AOpTaf3U0
単刀直入に質問。Vue.jsとReactを勉強するための書籍を探してる。今は
両方のチュートリアル見たりしながら写経しつつ、我流で勉強中。
●Vue.jsは技評のVue.js入門と基礎から学ぶシーアンドアールのVue.jsで迷ってる
●Reactはどれも評価高いものがなくて迷ってるが今は見送り？

ちなみにＪＳの知識だが、今までjavascriptは紫の山田本一通り通したことがあり、AngularJS1.5で簡単な
検索システム組んだことあるぐらい。いちおうjQueryも一通り触れてプログラムに
色々システムを手書きで組み込めるレベルはある。
469デフォルトの名無しさん (ﾜｯﾁｮｲ c701-+o2P)
垢版 |
2019/02/18(月) 00:24:29.50ID:ZveW3gOd0
>>468
vueだけど、俺は「基礎から学ぶvue.js」買ったよ。技評の方は読んでない。公式webとその本で十分網羅されてると思う。
2019/02/18(月) 00:32:34.18ID:PvqzGaNZ0
おお、サンクス。なら、そっちも買うか
2019/02/18(月) 01:01:22.40ID:qsq8EO4j0
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
2019/02/18(月) 01:12:07.61ID:TCe7B/Jv0
↓Reduxに関しては一番詳しく書いてあるけどサンプルプログラムの入手先が本誌に書いてない・やっぱちょい古い
React入門 React・Reduxの導入からサーバサイドレンダリングによるUXの向上まで

↓構成は悪くないしサンプルプログラムがしっかりしてる点はいいがバージョンが古いのとReduxが載ってない
いまどきのJSプログラマーのための Node.jsとReactアプリケーション開発テクニック

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

とりあえず一番上がいいかな
2019/02/18(月) 01:14:46.55ID:TCe7B/Jv0
>>471
Node.js超入門は全然役に立たんし買う必要ないと思う

てか全般的に2017年以前の書籍勧めちゃいかんだろ
2019/02/18(月) 01:17:18.50ID:TCe7B/Jv0
>>470
基礎からは著者のサポートサイトも併せて見るとやりやすい
475デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/18(月) 08:10:58.01ID:3Fbf7ypjr
フロントは更新や淘汰が速すぎるから書籍だと情報が古くなるのは仕方ない
476デフォルトの名無しさん (ﾜｯﾁｮｲ a768-z6VA)
垢版 |
2019/02/18(月) 08:44:20.46ID:WLtbirMY0
SproutCoreとかもう名前が挙げられることもないからな。
なぜかmeteorは今更挙げられることがあるが。
2019/02/18(月) 22:14:52.84ID:WoGhDUeR0
逆にフレームワークを本買ってまで勉強する必要あんのかな。

公式のチュートリアル一通りやればどう書けばいいかは大体想像付くし、
あとは自分でお題決めて、わからん事は公式ドキュメントやstackoverflowとにらめっこしてれば、大抵の物は作れるだろ。
2019/02/18(月) 22:20:39.28ID:788tab2z0
>>477
そう。英語勉強したほうがマシ。マジで。
2019/02/18(月) 22:38:28.05ID:dNYL//qB0
フレームワーク本を1週間で読めるとして、
英語を勉強するのとどちらが速いと思いますか？
480デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/18(月) 22:44:57.01ID:3Fbf7ypjr
英語は10年やっても無理だがフレームワークなら1日で覚えられる
2019/02/18(月) 22:53:31.84ID:788tab2z0
ウンコ訳で周回遅れの邦訳に付き合わなくてよくなるぞ。
英語なら電子版無料公開してるような書籍でも日本では印刷してボッタくっている。
2019/02/18(月) 22:56:21.87ID:7ubWqY/W0
理解できなけりゃ金払ってでも理解すりゃ良いんだよ。
2019/02/18(月) 23:01:29.12ID:PvqzGaNZ0
理系じゃないんで抽象的な表現が苦手なんだよな。なので、ひとつ何か
コンポーネント指向がわかる手ほどき書がほしかったわけで

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

>>478
むしろ、英語は読める口（ニュースサイトの記事や英語版Wikipediaの記事とかは
だいたいわかる）なんだけどね
2019/02/18(月) 23:10:58.27ID:6vaPKOJl0
話題になり始めたらとりあえずgithub見に行くな
必要なものは大抵その中か、そこからのリンクにある
2019/02/18(月) 23:17:17.71ID:2Q4jbH6wM
>>483
はぁ、コンポーネント指向を…
Atomic Design ~堅牢で使いやすいUIを効率良く設計する　くらいしか知らないな。この本で使ってたのはReact。
2019/02/19(火) 01:42:29.59ID:qmiILQOL0
>>468
Vue本は両方買った
ある程度動けばいい実践派は猫本
理論から入りたい理屈派は技評本ってとこ
俺は技評の方が性にあった
487デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/19(火) 02:51:16.21ID:QF2NWP5xr
China開発者が作ったvueと、Facebookが作ったReactは将来性も含めてどっちがオススメ？
2019/02/19(火) 09:00:05.79ID:8ne5Wfny0
vueはちょいと手を広げすぎな気はする。
2019/02/19(火) 09:01:38.38ID:494Vj+cBa
もしかしてAngularって本当に淘汰されてる？
490デフォルトの名無しさん (ﾜｯﾁｮｲ c701-+o2P)
垢版 |
2019/02/19(火) 09:14:50.98ID:jwE8w3hJ0
Angularのシェアが落ちてると言うより、angular採用するまでも無いサイトが他を使用してるだけだろう。vueなんかは小さく始められるから入力フォームにだけ利用もできるしjQueryと共存もできるしね。俺もフォームから始めたな。随分スッキリした。
2019/02/19(火) 13:47:21.51ID:YsDFh+D0d
vueの良さが今日

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

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

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

知ろうとしないとこの境地には辿りつけないけど
492デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/19(火) 15:11:28.48ID:QF2NWP5xr
React終わったな
もはやvueの勢いにはどうあがいても勝てない
2019/02/19(火) 15:40:44.07ID:SwtNBaDUM
※スターの半分以上は中国人です
2019/02/19(火) 15:46:05.13ID:g2OPfq0o0
中国人がどんどんcomponent作ってくれるから楽できる
495デフォルトの名無しさん (ｱｳｱｳｳｰ Sa4b-8ERn)
垢版 |
2019/02/19(火) 16:37:04.20ID:wezyZP0ya
Alibaba vs Facebook
2019/02/19(火) 18:19:10.23ID:QwJoWSeKd
俺は中国人の勢いにかけるぜ
497デフォルトの名無しさん (ﾜｯﾁｮｲ c701-OU7K)
垢版 |
2019/02/19(火) 19:06:32.74ID:sMCHYB6e0
>>495
アリババの勝ちだな。
2019/02/19(火) 19:10:40.62ID:Qqrvi8yYa
Aurelia試してみたけどcliでプロジェクト作ってもhttp-serverインストールした上必要なファイル手動で追加せんとデモ画面もろくに表示されんとかこりゃ流行らんの当たり前やん
499デフォルトの名無しさん (ﾜｯﾁｮｲ c701-OU7K)
垢版 |
2019/02/19(火) 21:08:49.53ID:sMCHYB6e0
中間とってビュアクトにしたらいいのでは。
2019/02/19(火) 22:32:39.35ID:E9aKyrSX0
>>490
AngularはAngularJSでやらかしたのがデカイんじゃない？

一生懸命AngularJS勉強して「さあこれから本格的に開発していこう！」って矢先に互換性のないAngular 2発表、
AngularJSはオワコン化じゃ、次何が出ようと「誰がお前らのフレームワークの習得に投資するんだよ」ってなるわ。
2019/02/20(水) 01:13:44.34ID:1A7mnZWV0
>>496
わからない時は英語じゃなくて
中国語で検索しないといけなくなるのかな？
2019/02/20(水) 02:18:36.91ID:23FEoZns0
>>500
ほんまそれだわ、3年前Angular2で別物になったと思えば、もう6とかいってるし…
数年でもう5まで行ったLaravelも大概じゃないがそれよりひどい
2019/02/20(水) 02:27:40.92ID:23FEoZns0
あと、フルスタックじゃないAngularJSのような気軽さがないとね…。
ReactとRedux、Vueとnuxtみたいな関係が必要だ。門戸は広く、奥行きは深くすべき
ReactはVueに影響されたか、だいぶ記述はわかりやすくなったから、前よりは
とっつきやすくなったと思う
2019/02/20(水) 07:17:02.34ID:SpCnH/g70
おいreactに来たhooks apiめっちゃいいやんけ。クラスなんていらんかったんや！
505デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/20(水) 07:59:55.95ID:zvYiCp4Or
クラスでええやん
2019/02/20(水) 13:47:47.60ID:n2p9Q1hFd
>>502
7やろ
507デフォルトの名無しさん (ﾜｯﾁｮｲ c701-+o2P)
垢版 |
2019/02/20(水) 14:20:15.26ID:B6NZYAeG0
>>503
> ReactとRedux、Vueとnuxtみたいな関係
言いたい事は分かるが一応訂正。reactとnext.jsに対応するのはvueとnuxt.js。ステート保持はreactがredux、 vueがvuex。
2019/02/20(水) 19:48:50.57ID:CEoya/3z0
HooksってReduxとの相性どうなの
2019/02/20(水) 20:13:36.83ID:SGVVPurF0
Reduxが要らなくなるのがHooksなんじゃないの？
2019/02/20(水) 20:17:31.57ID:hK+DOQwsM
context apiと組み合わせれば。
デカイアプリはまだまだreduxじゃないかな？
しかし確実にstate管理の枠組みにも変革を促すであろう。
post reduxにどんなのが出てくるのか楽しみ。
2019/02/20(水) 20:24:09.86ID:SGVVPurF0
ということで、またオワコンが一つ増えますね。Reduxはオワコン。
ほれ、また次だぞ。チキンレースは終わってないぞ！
2019/02/20(水) 20:36:00.91ID:hK+DOQwsM
まあreduxはめんどくさすぎるからな。
小規模アプリでも必須みたいな風潮が異常だった。
2019/02/20(水) 20:47:56.19ID:IrLSPTwba
>>507
現状nuxtは大きくなりすぎたからnextと比較するのは不毛
514デフォルトの名無しさん (ｵｯﾍﾟｹ Sr7b-/+m/)
垢版 |
2019/02/20(水) 22:17:55.07ID:zvYiCp4Or
まじか
いまReduxつこてるのに
515デフォルトの名無しさん (ｵｯﾍﾟｹ Srbd-WrPJ)
垢版 |
2019/02/21(木) 16:37:13.46ID:QuFAf9ehr
reactでブラウザの戻るに一つしか履歴が登録されない
意味不明
2019/02/21(木) 17:02:23.80ID:f8G92//U0
ヒステリーAPIを使え
517デフォルトの名無しさん (ｵｯﾍﾟｹ Srbd-WrPJ)
垢版 |
2019/02/21(木) 17:08:39.36ID:QuFAf9ehr
ヒストリー使ってるんだけど

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

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

てか解説サイトがほとんどない…
2019/02/21(木) 18:31:50.74ID:++Eueb0Rd
>>516
ヒステリーAPIは草
2019/02/21(木) 20:33:12.61ID:P4oXdJL20
>>515
これのexampleの構成をよく見た方がいい
https://github.com/supasate/connected-react-router
2019/02/22(金) 03:02:07.44ID:y9srh0J/p
>>516
まあまあ
落ち着けよw
521デフォルトの名無しさん (ｵｯﾍﾟｹ Srbd-WrPJ)
垢版 |
2019/02/22(金) 12:59:46.42ID:CkzBv4Her
とりあえずhistory直す
なんかわからんがLink使うとhistoryの履歴が3つ登録される
SPAはここがめっちゃめんどくせぇ
なんでブラウザの操作までjsで組まなきゃいけないんだか
2019/02/22(金) 13:22:14.53ID:nIPzShw8a
てかｵｯﾍﾟｹってReactマスターやなかったんかい
2019/02/22(金) 13:32:15.20ID:9C0ENtC1M
別にSPAにせず普通にページ遷移してもいいんだがな。誰もやらないだけで。したがってサンプルも転がってないｗ
524デフォルトの名無しさん (ｵｯﾍﾟｹ Srbd-WrPJ)
垢版 |
2019/02/22(金) 14:06:18.79ID:CkzBv4Her
>>522
すまん、App.jsのコンストラクタ内でthis.props.history.listen使ってしまっておった
これやめたら直りました
dispatchで初期化するのにつかってたのが間違い
2019/02/22(金) 21:03:06.66ID:wU2NQYd9a
>>519
サンプルここにあんじゃん
2019/02/22(金) 21:06:35.12ID:Q1wbj0yj0
Reactはホント人によって使うフレームワークやライブラリが全然違うな。
ちょっと興味あったけど、これじゃどっから始めたらいいか全然分からん。

てか、ReduxだのNextだの、第三者が作ってるであろうフレームワークの開発なりサポートなりが終わってしまったら、代わりはどうすんだ？
2019/02/22(金) 21:14:42.59ID:QkaGMiSY0
極力公式か大きめの企業がメンテしてるものだけで作る
コミッタが少ないものは使わない
ライブラリへの依存が散らばらないよう自コードで軽くラップして使う
2019/02/22(金) 21:19:43.61ID:wU2NQYd9a
まぁ本当にSSR必要かってのもあるけどね
最近自分の関わってる案件だと会員サイトの認証済み領域の情報は一切検索エンジンにヒットさせる必要ないからSSRとは無縁なんだよな
2019/02/22(金) 21:24:17.86ID:LKaW/yz70
スペシャルスーパーレア？
2019/02/23(土) 00:29:55.26ID:tE6+E9hM0
>>526
大丈夫。その前にReactが終わる。VueもAngularも
あと数年後は今存在してないフレームワークが使われてるよｗ
2019/02/23(土) 07:14:02.54ID:6swyBY50a
数年後も残ってるのはjQueryだけ
MVC+jQが正解なんだよ
532デフォルトの名無しさん (ﾜｯﾁｮｲ b501-q7W2)
垢版 |
2019/02/23(土) 09:37:08.18ID:2sBO9l/X0
いやreact vue angularについては長生きすると思う。ここ数年は本当酷かったフレームワーク戦争も落ち着いたしあと5年は使えるんじゃないか？ようやく腰を据えて安心して学べる状態になった。
2019/02/23(土) 10:08:06.99ID:tE6+E9hM0
あとたった5年（笑）
2019/02/23(土) 10:16:15.94ID:tE6+E9hM0
お前ら、RADツールって知ってるか？
ウェブの世界じゃあまり知られてないかもしれないが
デスクトプアプリの世界じゃ20年以上前から存在してるものだよ
VBとか有名だな

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

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

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

20年前のVBはすでにこういった世界だったんだよ？
2019/02/23(土) 10:34:55.14ID:6swyBY50a
だが滅んだ
2019/02/23(土) 10:55:53.84ID:awIWFh910
マウス1つでレスポンシブデザインまで対応出来るなんて
夢みたいなツールじゃん
2019/02/23(土) 11:17:14.46ID:tE6+E9hM0
レスポンシブはブレークポイントを複数定義して
デフォルトからの差分みたいな感じでデザインするんだろうね
538デフォルトの名無しさん (ﾜｯﾁｮｲ 7d01-Vd0N)
垢版 |
2019/02/23(土) 11:17:41.85ID:XpMOEioH0
選択肢の一つをあたかも統合されるかのような詭弁はNG。
ポトペタASP.NETが密結合過ぎてわざわざOSS界隈に歩み寄った歴史を思い出せ。
2019/02/23(土) 11:25:13.71ID:6swyBY50a
技術がなく判断できない企業はノンプログラミングという言葉に騙されやすいのだろうね
2019/02/23(土) 11:32:23.19ID:RWE+nJx90
>>539
WIXはそんなに悪くないが一般的には酷いの多いよね
2019/02/23(土) 12:15:44.69ID:tE6+E9hM0
>>539
ノンプログラミングはだめだろうね。
今のRADはGUIのエディタで作ってもいいし、
コードで書いたとしてもGUIに反映されるようになってる
2019/02/23(土) 12:23:17.31ID:n0LspLEFd
>>538
Web Formsね
2019/02/23(土) 12:37:28.79ID:K/uRyWeBM
WebFormは一瞬でページ作れるから
ものによっては便利だが
2019/02/23(土) 12:41:54.25ID:6swyBY50a
単純なページはスキャフォールディングでええやんけ
2019/02/23(土) 12:45:12.12ID:tE6+E9hM0
スキャフォールディングはページを作るものではなくて
ベージの一番最初のコードを生成するだけです。
その後に生成したコードを修正して作っていかなければいけません。
2019/02/23(土) 12:52:56.11ID:6swyBY50a
修正すればええやんけ
ポトペタより簡単でソースも綺麗やで
ポトペタなんてマウス操作とアイコン探しの悪魔的苦行の繰り返しやないか
あれが楽とかマゾでもよう言わんで
2019/02/23(土) 13:01:24.38ID:K/uRyWeBM
いやちゃんとしたい時はMVCなんだが
WebFormの存在理由もそれなりにある
2019/02/23(土) 13:09:09.75ID:K/uRyWeBM
さすがにVueとかにはくっつけられないから
スレ違いだったな
RazorPagesはくっつくかな
2019/02/23(土) 21:37:53.78ID:QCtZNWil0
>>538
MVCやSignalRも知らないおバカさん
550デフォルトの名無しさん (ﾜｯﾁｮｲ 7d01-Vd0N)
垢版 |
2019/02/24(日) 02:35:29.23ID:7mFkjhD10
>>549
RADの話が出たからWebFormsみたいなクソが消えた歴史を考えろっつってんのに、何がSingnalRだよ。文脈読め。
2019/02/24(日) 02:58:24.82ID:O4f1RypY0
>>550
ASP.NET=Web formsっていう発想自体が頭おかしいんだよ
2019/02/24(日) 03:19:47.26ID:wTcw/8fo0
お、お、お、おちけつよ！
2019/02/27(水) 15:11:35.98ID:XUj+n7600
Reactというかredux？見てて思うのは、
お前らネットワークプロトコルでも作ってるのかよって話

普通にメソッド実行すればいいのに、
パケットデータ作って、そのパケット解析して処理実行する
メソッド一つ実行すりゃ終わりなのに

関数型にしたいのかどうか知らんが、目的を履き違えてる。
バグを減らすために関数型にする。そのために複雑にしてバグを作りやすくしてどうする
関数型じゃなくていい、バグを減らすためにシンプルにしろよ
554デフォルトの名無しさん (ｵｯﾍﾟｹ Srbd-WrPJ)
垢版 |
2019/02/27(水) 15:24:17.37ID:PVZtgHDGr
>>553
しかしflux概念は世界的に認められてるから広く使われるわけで、キミの主張vs世界中の開発者の同意でキミが勝てるわけないよね
そのへんどうすんの？
2019/02/27(水) 16:07:14.12ID:XUj+n7600
反論しないで、世界に広める方法を聞く
変なレスだなぁｗ
2019/02/27(水) 16:34:28.95ID:XUj+n7600
ところでさ、

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

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

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

固定の連想配列返す関数のテスト書いても意味ないぞ
二度手間なだけで、それを避けるためにどうせコピペするんだろうし
2019/02/27(水) 17:20:11.35ID:fbQufi7O0
>>553
メソッド実行するって具体的にはどういう形？

dispatchの前処理と後処理を自分で追加したメソッドを
ストア(↓)に生やすようなのをイメージしたけど合ってる？
https://github.com/reduxjs/redux/blob/master/src/createStore.js
2019/02/27(水) 17:45:18.46ID:XUj+n7600
>>557
ようするに、

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

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

ってことだよ。

onclickにincrementメソッド書いたら、+1するincrementメソッドが呼ばれます。
でいいじゃねーか。直感的だろ？それで別にテストできないわけじゃないんだし
2019/02/27(水) 17:50:17.86ID:avwBchUKa
IOモナド不要論に近いものを感じる
単にReactを選択しなければいいだけなのにね
選択肢の中に一つでも気に入らないものが混じってると全否定を始めるんだからもう
2019/02/27(水) 17:53:11.18ID:XUj+n7600
IOモナド不要論というか、IOモナド至上主義じゃないってだけ
副作用排除は素晴らしいよ？でも複雑にしてまでやることじゃない。
バグは副作用でも増えるだろうが、複雑にしても増えるんだよ
書くものが増えれば増えるほど、書き間違いも増えテストも増えるんだから
2019/02/27(水) 17:58:32.64ID:fbQufi7O0
>>558
その形なら単にReduxを使わなければ良いだけでは？
使用を強制されてるのなら何とも言えないけど

ちなみにうちは本開発でReduxを使ってない
別に嫌ってるわけでもなく、とりあえずバニラなReactでやってるうちに
Contextが来たのもあって特に入れたい状況にもならずって感じ
2019/02/27(水) 18:03:11.05ID:XUj+n7600
>>561
たぶんReduxは捨てろって流れになるだろうね。
それが可能になるContext

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

あと別に使用を強制されてない。
React自体使ってないものｗ
2019/02/27(水) 18:13:46.28ID:gzx7LPiYa
>>553
ていうかまず状態って言うほどサイト全体で持つ必要あるのか？って思うね
大体の場合はコンポーネントの中で閉じててもいい場合が多いし
本当にサイト全体で持ちたいデータはリロードとかて吹っ飛ばないようにlocalstrageにでも書いた方がいいんじゃないかとか
2019/02/27(水) 18:21:13.76ID:U+okKr8Fa
遷移して戻ってまだ編集内容が残ってると逆に気持ち悪い
2019/02/27(水) 19:19:39.92ID:6a6tMlMF0
どのコンポーネントが状態持ってるのか探す方がめんどくさいじゃん。
2019/02/27(水) 19:36:24.78ID:haTnnqieM
reactは好きだけどreduxめんどくさい論は大賛成！
hooks + contextに大期待！！
2019/02/27(水) 20:01:14.80ID:gzx7LPiYa
>>565
その部品の情報がその部品で閉じてるなら探す必要ないじゃん？
2019/02/27(水) 20:20:53.09ID:33VvYXhGp
Redux使わずcontextAPIのみでアプリ作ったけど、なかなか良い感じ
シンプルisベストだね
2019/02/27(水) 22:38:29.67ID:U+okKr8Fa
マルチページ+Vueがベスト
2019/02/27(水) 23:30:28.79ID:6a6tMlMF0
>>567
その部品で閉じるような状態ならな。
二つ以上の部品にまたがる状態だってあるだろ。
2019/02/27(水) 23:47:31.09ID:XUj+n7600
だから2つ以上の部品にまたがる所だけで良くなるだろ
572デフォルトの名無しさん (ｵｯﾍﾟｹ Srbd-WrPJ)
垢版 |
2019/02/27(水) 23:49:27.29ID:PVZtgHDGr
reduxなんて面倒くさいレベルに入らないだろ
しょぼいシステムしか作ったことがないんだろうが
2019/02/27(水) 23:52:10.20ID:6a6tMlMF0
>>571
その分け方がわかりやすいと俺は思わん。アドホックな部分が増える。
2019/02/28(木) 00:01:04.44ID:IYEK0cme0
>>572
つまりあなたも面倒くさいって思ってるわけですよね？
このぐらいのレベルなら耐えられるって言ってるだけだし
2019/02/28(木) 00:13:22.40ID:WHNbTV5sp
Reactそのものが面倒だと思う
サーバーサイド一本の人が移動してきて、Reactのコンポーネント一つ任せたら、onclickで画面をエフェクトさせるのが出来ないとブーたれてた
cssと組み合わせてやるんですよと教えたけど、デザインとロジックが分離されてない糞フレームワークだと文句ダラダラ
結局Reduxのところだけ担当してもらった
サーバーサイドだけの人はこの世界では使い道がない
2019/02/28(木) 00:24:32.39ID:PBjHM/k00
それはサーバーサイドしか知らないのに画面のエフェクトだデザインとロジックの分離だ言う
その人個人の問題なんじゃないかね。
2019/02/28(木) 00:30:03.58ID:IYEK0cme0
デザインとロジックが分離されてないのは本当だろ
578デフォルトの名無しさん (ｵｯﾍﾟｹ Sr0b-5hgX)
垢版 |
2019/02/28(木) 01:39:22.43ID:FLrrxMk0r
>>574
こんなのより何千倍も面倒くさいプログラミングしてきてるから面倒くさくねえ部類って言ってんの
頭イカれてんのか？
2019/02/28(木) 06:14:57.31ID:WHNbTV5sp
何千倍も難しいって、口調が前にどこかのスレで見たような気がする
確か自称ゲームプログラマーじゃなかったけ

私大文系はクズだのヴァカだの幾何学的計算が出来れば高卒でも理系とか意味不明な発言の人だった
2019/02/28(木) 06:16:05.22ID:WHNbTV5sp
バカじゃなくてヴァカという変な単語を連呼してたので覚えてる
2019/02/28(木) 06:50:50.42ID:6H8i6ZZe0
てかテキストボックスのチェンジイベントでイチイチReducerだかDispatcherだかを経由してストアに書きに行くもんなの？
確定ボタン押した時でよくない？
2019/02/28(木) 06:55:29.34ID:6H8i6ZZe0
>>577
デザインとロジックが分離してない上にVueみたいにコンポーネントとして独立するわけでもないっていう中途半端さがね
2019/02/28(木) 08:52:57.67ID:jOvvow1Ud
落ち着け、議論を飛び出してケンカになってるぞ。そこまでくると他の人に迷惑だから頼むから我慢して2、3日スレから離れて観て欲しい。
2019/02/28(木) 08:57:16.34ID:w/cn9HKca
>>583
ビビんなよ。5chではよくあることだろ
2019/02/28(木) 10:41:44.71ID:6x03bq62a
ビジネスロジック→Service(バックエンド)
プレゼンテーションロジック→ViewModel(js)
デザイン→View(html/css)

サーバーサイドおじさんはプレゼンテーションロジックがお気に召さないらしい
ビジネスロジックとデザインだけで完結するMVCフレームワークが人気
2019/02/28(木) 10:50:58.35ID:GdwBglQC0
>>585
そこに、ActionとAction CreatorとReducerとStoreは
どこに含まれるの？って話だよ

アーキテクチャ上、必要ないものが多すぎる
2019/02/28(木) 12:22:34.05ID:qWkUq+5ha
>>586
分類するなら全部プレゼンテーションロジックだろう
SPAとかいう誰得要件のせいでプレゼンテーションロジックが過剰に肥大化複雑化してしまった結果それらが産まれた
従来のマルチページに戻すだけでスッキリ解消される
2019/02/28(木) 12:46:03.68ID:jOvvow1Ud
誰得っていうけどブラウザアプリ作るならSPAの方がUXが劇的に向上するケースが殆どじゃないか？
2019/02/28(木) 12:49:53.87ID:qWkUq+5ha
UXが向上したということにしたいだけでは？
案外ユーザーはシンプルなMVCのほうが簡単で良いと思ってるものさ
2019/02/28(木) 13:05:42.47ID:jOvvow1Ud
シンプルなMVCかどうかの判別ってユーザーからできるの？ユーザーってもしかして顧客のこと？
2019/03/02(土) 15:08:24.35ID:IgVX/rLT0
年明けてから二ヶ月経過したけどなんだかんだ書籍出てるな
売れてるんかねぇ

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

デザインとロジックの分離が不完全なので不器用な奴には使えない
結局Reactのアプリ制作はその一人が設計構造を考えて何人かで分担して作ってる
その一人がいなくなったら改修も容易ではない
2019/03/02(土) 16:52:47.42ID:IgVX/rLT0
>>592
そう最低限なんでもできるリーダーがいなきゃ初期導入すら始まらんもんな
浸透すらしてないのにフロントとバックを分業分業言い過ぎだとは常々思ってる
2019/03/02(土) 17:18:02.29ID:mksg7qZ+0
html5で独自属性を使うときはdata-*で命名する規則になってるけど
どのフレームワークも無視してるのはなぜ？
2019/03/02(土) 20:30:41.54ID:b3M+C2mw0
「知りません」は別に問題無いけど「やってみても分かりません」という奴は
PGとも呼べない半人前だと思う
でも多いんだよなそういうの
2019/03/02(土) 20:45:13.26ID:ujIKCjUH0
>>594
その属性はビルド後も残るの？
2019/03/02(土) 21:47:05.25ID:gbDUCVtH0
>>595
「よく分からないけど動いた」
598デフォルトの名無しさん (ｵｯﾍﾟｹ Sr0b-5hgX)
垢版 |
2019/03/02(土) 21:51:40.27ID:Fdvrrf47r
>>592
フロント、バックエンド、DB、インフラからデザイン、写真加工、キャラ背景画作成、アニメーションまでできる俺は頂点に立てるかな？
2019/03/02(土) 22:08:26.00ID:Lvrdovo/0
>>593
> 浸透すらしてないのにフロントとバックを分業分業言い過ぎだとは常々思ってる

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

Reactは設計レベルで分業がし辛いフレームワーク
2019/03/02(土) 22:12:30.11ID:bakyLAA50
rails、angular、vueなら分業しやすいとでも？
2019/03/02(土) 22:15:55.89ID:Lvrdovo/0
まあそうだね。

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

ReactとVueはJavaScriptの中にHTMLの断片が埋まってるから
それを修正して思い通りのデザインを作ってもらうのは無理だろう
2019/03/02(土) 22:24:29.37ID:20MtSIx6a
フロントとバックは分業したほうが楽だ
どっちもできる人は多くない
いたとしても負荷がかかるから無理強いするとブラック企業になってしまう
それに分業といってもAPI(作る|呼ぶ)だけだろう
難しいとこなんて何もない
2019/03/02(土) 22:33:41.00ID:IgVX/rLT0
>>599
逆に分業じゃなっきゃできんってヤツはわざわざ勉強してまで新しい技術を導入したいとかいい出すヤツは居ないっていう話だよ

>>600
なんでRailsねじ込んできた？
2019/03/02(土) 22:40:19.17ID:x3fQB5qB0
>>594
無視ってどういう意味で？少なくともReactのアプリで使えているけど。
2019/03/02(土) 22:46:45.64ID:0oz9yp0R0
阿部寛のHPを構築するならVue、React、Angularどれがいいの？
2019/03/02(土) 22:48:37.42ID:Lvrdovo/0
>>603
意味がわからん。

仕事を一人でやるのは大変だから、分業できるようにしないと駄目って話なんだが？
新しい技術であっても、それで分業ができればいいんだよ。
というか分業ができる技術を導入するべきだ。
2019/03/02(土) 23:11:54.68ID:bakyLAA50
この作業がそんなに難しいことだと思えないんだけど、そんなもんかね。
>ReactとVueはJavaScriptの中にHTMLの断片が埋まってるから
>それを修正して思い通りのデザインを作ってもらうのは無理だろう
2019/03/02(土) 23:27:02.72ID:Lvrdovo/0
>>607
難しいかどうかじゃなくてやり方が全く違う。
普通はHTMLとCSSで作るんだから
2019/03/02(土) 23:47:00.54ID:IgVX/rLT0
>>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の独自属性とは違う位置付けだと考えた方がいいんじゃないか
2019/03/03(日) 00:02:03.36ID:PCCGC897a
Vueの独自属性はHTML5準拠やで
なのでdata-*にしなきゃいかんルールなどない
611デフォルトの名無しさん (ｵｯﾍﾟｹ Sr0b-5hgX)
垢版 |
2019/03/03(日) 00:05:23.14ID:QTOYGzGrr
Chromeのvue dev-toolで確認できるんじゃないの
2019/03/03(日) 00:10:23.09ID:eREWiz410
>>611
それ使えば確かに見れるけどElements側に出ないって事は実DOMとしてはレンダリングされてないって事だと思う
2019/03/03(日) 00:17:30.72ID:PCCGC897a
単にインスペクターが無視してるだけだ
正しい属性なんだからレンダラが無視するわけにもいかんだろ
614デフォルトの名無しさん (ﾜｯﾁｮｲ 9f6a-SKB1)
垢版 |
2019/03/03(日) 00:43:00.34ID:0eQXv8px0
>>609
＞v-modelとかv-onとかv-bindとか
そうそう。data-＊ではないカスタム属性ってEclipseに警告だされてすっきりしない
だから実行時に消えるとしてもhtml5のカスタム属性としてはよくない気がする

本来ならxhtmlの名前空間みたいに*:*でカスタム属性を命名できれば良かったんだけどね
2019/03/03(日) 00:48:58.18ID:GWdBiIMXa
未だにEclipseなんてゴミを使ってるヤツが居ることに驚きなんだか
616デフォルトの名無しさん (ｵｯﾍﾟｹ Sr0b-5hgX)
垢版 |
2019/03/03(日) 01:03:17.04ID:QTOYGzGrr
eclipseww
2019/03/03(日) 01:41:00.89ID:QeUrAhcJM
実際レンダーする前のリソースなんだから
しょうがないんじゃないの
VSCodeとかでVue拡張使えばいいじゃん
2019/03/03(日) 01:46:51.51ID:eREWiz410
>>613
v-ifとv-showの違いとか読んだことない？ないものはないんだよ
2019/03/03(日) 08:28:07.07ID:oO/57lY20
なんだ、レンダリング前のテンプレートの話か。ならHTML5に準拠してないのは当たり前じゃん。
たしかにXHTMLならその規格に準拠した中で拡張できるけどHTML5はそれと決別したしねぇ。
2019/03/03(日) 09:22:56.48ID:PCCGC897a
>>618
正しくDOMとして評価された後にDOMを消してるだけ
拡張属性は正しく評価されてる
2019/03/03(日) 09:29:26.03ID:eREWiz410
>>620
だからその評価がBlinkやGeckoみたいなレンダリングエンジンで評価されるか
V8やSpiderMonkeyみたいなJavaScript実行エンジンエンジンで評価されるかの違いだって
2019/03/03(日) 10:40:12.55ID:BbxzBxVK0
>>608
そこまで違う作業とあんまり思ってなくて、
やってもらうとしてそんなに反感食うもんかなという風に思ってるのだが。
かなり勝手に思ってるだけだから実際の現場感覚はわからんけど。
2019/03/03(日) 11:31:27.74ID:cmngH9hR0
UIが劇的に切り替わる様な要件じゃ
デザインとロジックを完全に分離とかそもそも不可能じゃないの
2019/03/03(日) 13:57:28.79ID:PCCGC897a
デザイン
プレゼンテーションロジック
↑JS+HTML+CSS
--------
↓API
ビジネスロジック

デザインとロジックを分離するって言った場合、分離するのはビジネスロジックのこと
プレゼンテーションロジックを分離するという意味ではない
2019/03/03(日) 15:00:36.37ID:KP+Vu9ps0
WebまではHTML+CSSだけ分離も可能だけど
スマホWebアプリ／スマホアプリになってくると動きも含めてのUXという性質が強くなる

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

Reactは後者のデザイナーとは相性悪いだろうね
626デフォルトの名無しさん (ｵｯﾍﾟｹ Sr0b-5hgX)
垢版 |
2019/03/03(日) 15:07:16.96ID:QTOYGzGrr
デザインもUIもUXもフロントも全部やればいいじゃん
そもそもなんでできないのか不明
フロント勉強してできるようになったのならデザインも勉強すりゃいい
2019/03/03(日) 16:31:53.99ID:xQ2gqaf30
>>626
何でも一人でやる時間があればそうする
2019/03/03(日) 16:40:53.54ID:8CruhG400
少なくとも難しいから分業してるわけじゃないだろうね。効率の問題。
629デフォルトの名無しさん (ｵｯﾍﾟｹ Sr0b-5hgX)
垢版 |
2019/03/03(日) 17:40:54.12ID:QTOYGzGrr
>>627
時間があればじゃなく、必要だからやらなきゃいけないんだよ
最近世界的にもその必要性が言われてる

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

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

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

https://postd.cc/the-death-of-front-end-developers/
2019/03/03(日) 17:56:55.95ID:8CruhG400
>>629
開発の規模とか体制によりけりだろ。
例えば自分が所属してるとこだと、フルスタックにやれる人にはデザインなんかに凝ってる時間があったら別の仕事やらせたい。
2019/03/03(日) 18:01:05.79ID:eREWiz410
効率でいうなら複数のサイトを作業区分毎に分業するよりも１サイト１人でやる方がよっぽどいいと思うけどね
632デフォルトの名無しさん (ｵｯﾍﾟｹ Sr0b-5hgX)
垢版 |
2019/03/03(日) 18:15:09.19ID:QTOYGzGrr
>>630
>デザインなんかに

そこの認識なんだよなあ
プログラマはデザインわかってないからデザインなんかにという言葉が出てくる
2019/03/03(日) 18:45:41.76ID:8CruhG400
>>632
2019/03/03(日) 18:47:22.33ID:8CruhG400
>>632
うーん、なんか噛み合わないな。デザインは大事だと思うから分業して欲しいと思うんだよね。そしてエンジニアが楽しいからってデザインに凝るのをよくないと思ってる。
2019/03/03(日) 18:49:08.31ID:eREWiz410
>>632
まぁ例えば
プログラミングレベルが１０で
デザインレベルが５とかの人材の場合
どちらかと言えばデザインよりコーディングやって貰った方が効率いいってはあるんじゃない？
2019/03/03(日) 18:51:32.92ID:8CruhG400
>>631
それは否定しないがその人材を安定して確保しようとするといくら払えばいいの？という話にならないか？
2019/03/03(日) 18:54:01.18ID:eREWiz410
>>636
確保するんじゃなくて育てようって気がないのかね
これだから衰退するんだよ
638デフォルトの名無しさん (ｵｯﾍﾟｹ Sr0b-5hgX)
垢版 |
2019/03/03(日) 18:54:24.45ID:QTOYGzGrr
>>634
デザイン凝るっていう判断はどこでしてるの？
仕様として必要ならやるよな
それともそのフルスタックエンジニアの独断でやってるのか、デザインわかってない奴が決めてるのかにもよる
2019/03/03(日) 18:58:26.46ID:8CruhG400
>>637
育てること考えると余計に分業したくなるだろ。2人を両方フルスタックにするのと、それぞれ専門持たせて育てるのどっちが現実的なのか考えてくれよ。
なんか理想論でマウントとられても困る。
2019/03/03(日) 18:59:34.47ID:cmngH9hR0
人材云々の話は経営者が判断すべき問題であって
勉強しなくていいとかそういう問題じゃないでしょ
2019/03/03(日) 19:01:59.76ID:eREWiz410
>>592みたいに1人が抜けたらヤバイっていう状況はホントにヤバイから
できるうちに育てた方がいいよホント
2019/03/03(日) 19:03:05.35ID:8CruhG400
>>638
まあそれはそうだ。
仕様がガッチリ決まってるようなデザイン作成ってのを見たことないから故の思い込みかもしれんが、UIとなると必要以上に時間がかかってしまうという思い込みが自分のなかにあるのは確かだ。
2019/03/03(日) 19:04:53.82ID:8CruhG400
>>640
勉強すべきかどうかという話だったの？だとしたら俺も勉強すべきだと思うよ。
2019/03/03(日) 19:08:50.10ID:8CruhG400
ちなみに俺は>>630で体制によりけりと書いてるように、少数のとこならエンジニアのスキルや素質に合わせればいいと思ってる。少数でイキのいいベンチャーとかなら有能が多数派ってこともあるだろうしね。
おそらく仕事量に対する有能人材の割合が重要なんだと思う。
2019/03/03(日) 19:17:40.56ID:26syIpped
規模が大きくて大人数じゃないと作れませんねぇ、じゃあどこで分担しましょうか？

って考えればいい。
2019/03/03(日) 19:35:22.77ID:PCCGC897a
業務系だとそういう場合はレイヤーじゃなくてコンテキストで分けるのが主流だね
レイヤーで分ける企業はかつて見たことない
2019/03/03(日) 20:04:17.44ID:WgQds1l30
規模が大きくて大人数じゃないと作れませんねぇ、じゃあどこで分担しましょうか？

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

じゃあ、2人で2ヶ月の仕事を、あなた1人で2ヶ月でやってくださいね。
効率がいいんだから2倍ぐらいやれるでしょ？
でも給料は変わりませんから。
648デフォルトの名無しさん (ｵｯﾍﾟｹ Sr0b-5hgX)
垢版 |
2019/03/03(日) 20:12:49.02ID:QTOYGzGrr
>>647
そうなる
エンジニアスキルはできない奴に比べて何倍も差あるからな
だから給料もそれに比例する
2019/03/03(日) 20:33:30.24ID:WgQds1l30
> だから給料もそれに比例する

夢見るのやめとけｗ

2人で2ヶ月も、1人で2ヶ月も
働く期間が2ヶ月なら給料は同じだ
2019/03/03(日) 21:11:25.76ID:BbxzBxVK0
スケールしない作業だと言われればそうかもなとしか言えんな。
できるなら起業しとる。
2019/03/03(日) 21:42:00.62ID:QNZEu7Q40
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
2019/03/03(日) 22:00:40.86ID:YuQgiS/h0
>>651
死ね
2019/03/03(日) 22:01:29.06ID:hdxDgHRsa
Heroku使うメリットってなに？
654デフォルトの名無しさん (ｵｯﾍﾟｹ Sr0b-5hgX)
垢版 |
2019/03/03(日) 22:24:37.66ID:QTOYGzGrr
>>649
フロントデザイナーとフロントエンジニアがいても完成しない（デザインをコーディングで実現できないから）
しかしフロントフルスタックエンジニアがいれば何倍も早く完成する

何倍も早く完成するなら給料高くて当たり前
キミはどんなクソな会社で奴隷やってんの？
そもそもキミはフロントフルスタックエンジニアなのか？
2019/03/03(日) 22:34:10.60ID:hdxDgHRsa
寧ろフルスタックエンジニアって中小にこそ居るからな
待遇良くないってのもまぁあると思う
2019/03/03(日) 22:54:37.37ID:QNZEu7Q40
Heroku を使うのは、圧倒的にわかりやすいからだろう

それで、プログラマーの人件費が節約できる
2019/03/03(日) 23:07:55.84ID:sIAjtg1ud
>>654
逆にどういった組織を想定しているのか聞きたい。
1人にやらせた方が効率がいいのは当たり前だが、高給払えるような利益あげてる企業で、そんな体制で運営できるような小さなプロダクト扱ってる会社ってそんなにあるのか？
2019/03/03(日) 23:09:14.73ID:eREWiz410
慣れてしまえばLinuxでの鯖構築なんて難しい事なんもないけどな
特定の会社のインフラに依存するのってなんか怖いよね
2019/03/03(日) 23:14:25.71ID:GjzBYSLPd
>>658
動かすまではともかく、商用運用するとなると結構ハードルあがるから需要はあるんじゃない？
安定稼働、セキュリティ、費用計算、etc.
660デフォルトの名無しさん (ﾜｯﾁｮｲ 9701-3wv8)
垢版 |
2019/03/03(日) 23:56:16.49ID:dWHbj95s0
>>629
デザイナのコーディングは昔からの課題だよな。
ただcssやdomが打てるなら、vueだとかなりスッキリ分業出来ると思うけどな。社内か社外かの方が問題大きい。
661デフォルトの名無しさん (ｵｯﾍﾟｹ Sr0b-5hgX)
垢版 |
2019/03/04(月) 01:06:09.78ID:hdL+Fhbir
>>657
フロントフルスタックがほとんどいないから仕方なくフロントデザイナーとフロントエンジニアを雇っているわけじゃん？
てことは当たり前だけど2人分の給料払ってるのは事実だよな
それが小さな会社だろうが大きな会社だろうが2人分払ってる

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

そいつは高給かもしれないがむしろ人件費安くなるんだけど？
2019/03/04(月) 01:26:05.61ID:GKEA/LnB0
>>661
なんか勘違いしてないか？

・早く作れるとしても2倍の速度にはならない。
・なぜなら仕事量は2倍になるから
・でも給料が2倍になることはない
・儲けは会社のもの
2019/03/04(月) 01:28:05.52ID:GKEA/LnB0
・早く作れるとしても2倍の速度にはならない。
・なぜなら二人の仕事を一人でやるので仕事量は2倍になるから
・でも給料が2倍になることはない
・仕事量が増えても納期は伸びない
・儲けは会社のもの
664デフォルトの名無しさん (ｵｯﾍﾟｹ Sr0b-5hgX)
垢版 |
2019/03/04(月) 03:24:32.08ID:hdL+Fhbir
>>662
お前が勘違いしてるだろ

・分業の場合
フロントデザイナーがデザインする
↓
フロントエンジニアがコーディングする
↓
デザインセンスないからコーディングできない
↓
納期遅れる

・フルスタック1人の場合
フルスタックがコーディングとデザイン両方を同時にやる
2019/03/04(月) 06:33:24.10ID:xKwIvMQM0
>>626
＞フロント勉強してできるようになったのならデザインも勉強すりゃいい

これなんかいい勉強法ってある？
2019/03/04(月) 07:36:10.51ID:0mKT+E5t0
2倍くらいはなるだろ上手く行かなきゃ進捗出ない事なんてザラにあるだろうし

>>665
イラストレーターとかが1からUIデザインするサイトとかじゃない限りはCSSフレームワーク使えりゃいいんじゃない？
667デフォルトの名無しさん (ｵｯﾍﾟｹ Sr0b-5hgX)
垢版 |
2019/03/04(月) 09:49:24.20ID:hdL+Fhbir
>>665
自分で言っといてすまんけど、正直デザインセンスっていくら勉強してもなかなか向上しないんだよね
ベースとなるデザインの勉強はそのへんの学校に通いつつ、普段はひたすらUI/UXの情報みたり（海外系サイトおすすめ）して
構造や配色などの知見を増やし、あとはフロントデザイナーに金払って教えてもらう
2019/03/04(月) 11:00:17.97ID:fPP1emsu0
>>664
それただのウォーターフォールやん
分業は同時進行するんだよ
2019/03/04(月) 11:02:34.38ID:fPP1emsu0
・フルスタック1人の場合
フルスタックがデザインする（その間コーディングできない）
↓
フルスタックがコーディングする（その間デザインできない）
↓
一人でやるから同時に作業できなくて時間がかかる
↓
納期遅れる

・分業の場合
フロントデザイナーとフロントエンジニアが両方を同時に作業を始める
2019/03/04(月) 12:14:16.79ID:F1HORdDoa
でも分業するとインターフェースの協議に時間がかかるからそれがなかなかペイできないんだよね
2019/03/04(月) 12:30:51.83ID:gIkfSPyQ0
>>668
横から質問なんだけど
デザインが決まってない状態で
フロントエンジニア（プレゼンテーションロジック担当？）って何の作業するの？
2019/03/04(月) 12:35:52.25ID:yQsTNF7Xa
>>671
詳細なデザインがないと出来ないこと以外の全部
2019/03/04(月) 13:01:07.29ID:enTqHBl5M
ハハハ
2019/03/04(月) 14:17:57.52ID:fPP1emsu0
>>671
あのさぁ、かっこいい見た目なんか作らないでいいから
動きが必要なところをさっさと作るとかあるでしょ
2019/03/04(月) 14:49:51.44ID:vM9NvnRR0
見た目のない動きか
文字列かな
2019/03/04(月) 15:18:45.40ID:fPP1emsu0
かっこいい見た目といったのに
全く何も表示がないものと解釈するのか
馬鹿なのかな
2019/03/04(月) 15:36:50.66ID:ldzpTYWZ0
僕のおちんちんも激しく動きます
2019/03/04(月) 16:46:58.11ID:gIkfSPyQ0
>>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
2019/03/04(月) 17:04:13.55ID:yQsTNF7Xa
>>678
そういうのは手戻りではなく設計不足というのですよ
2019/03/04(月) 17:14:40.72ID:gIkfSPyQ0
>>679
設計の段階でデザインがほぼ固まってから実装ということなら
デザイン→実装の直列作業で
同時進行じゃない気がするんだけど・・・
2019/03/04(月) 19:04:00.56ID:kaSUrRDqa
デザインとロジックの分業は分かるが
結局フロントロジックとバックロジックの分業なんてしたって無駄なんだよ
682デフォルトの名無しさん (ｵｯﾍﾟｹ Sr0b-5hgX)
垢版 |
2019/03/04(月) 20:44:55.78ID:hdL+Fhbir
>>678
おれこのくらい他人のデザインも不要だしモックなくても頭の中でデザインできるからすぐにコーディングできるわ
なんなら数パターンのデザインを一つのソースで作ることもできる

さっきから言ってることだが、フルスタックはデザインもコーディングも「同時進行」で作業するんだよ
デザインしてからコーディングをやるんじゃないから
2019/03/04(月) 21:38:41.81ID:0mKT+E5t0
SPAじゃなくPWAってこれから流行るの？
2019/03/04(月) 22:18:18.82ID:fPP1emsu0
>>678
手戻りが出ないように最初のざっくり方針を決めとこうな
2019/03/04(月) 22:19:37.95ID:fPP1emsu0
>>682
> さっきから言ってることだが、フルスタックはデザインもコーディングも「同時進行」で作業するんだよ

同時進行で作業するが、一人でやるから時間が2倍かかるって話なんだが？
2019/03/04(月) 22:20:44.65ID:fPP1emsu0
どうしてもデザインが完成しないとコーディングが出来ないって言うなら、

相手にデザインさせている間、自分は違う仕事をやればいいだけだし
687デフォルトの名無しさん (ｵｯﾍﾟｹ Sr0b-5hgX)
垢版 |
2019/03/04(月) 22:42:20.42ID:hdL+Fhbir
>>685
何度も言うのめんどくせ
まあわからん奴にいくら言ってもわからんからどうでもいいや
2019/03/04(月) 22:51:08.65ID:0mKT+E5t0
人数増えた分だけ作業が速くなると錯覚してる大企業体質に何言っても無駄だと思うよ
2019/03/04(月) 23:01:25.29ID:VXdcZokm0
なんで極論同士で争うんだ？
開発規模(複数プロジェクトの合計の規模も含む)が大きくなって一人じゃできないから分業が発生するってだけだろ？
みんな一人でやった方が効率がいいとわかってるし、一人じゃ限界があるってわかってるんだよな？
2019/03/04(月) 23:05:47.91ID:Gt0dR1DD0
人数が増えるほど、すり合わせコストが掛かるから、単純な掛け算にならない。
意思疎通・教育コストが掛かる

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

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

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

だから、プログラマーのように難しい仕事は、単純に人数を増やしていけない。
人数効果があるのは、すごく簡単な単純作業の場合だけ

こういうのは、中小企業診断士・MBA のテキストに書いてある
2019/03/04(月) 23:06:55.42ID:VXdcZokm0
重要なのはいかに効率よく分業するかだろ？
2019/03/04(月) 23:11:34.47ID:Gt0dR1DD0
でも複数人数の良い点も多い

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

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

一見、損に思うけど、
教育効果により品質が向上して、後で十分に取り戻せる
2019/03/04(月) 23:24:38.44ID:56/JbqfwM
Web制作板行けやカス
2019/03/04(月) 23:32:05.12ID:/Cs1xWTia
>>692
辞めなければな！
2019/03/05(火) 05:46:36.86ID:437fdADv0
>>694
そういう発想だから辞められるんだよ。
2019/03/05(火) 07:55:43.10ID:N2s6BYvr0
>>684
「デザイン」の定義が食い違ってるのかもね

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

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

こういったこと
https://uxdesign.cc/designchallenge-cd7bdb589855
2019/03/05(火) 11:20:44.07ID:YFVILFEb0
>>696
ざっくり方針を決めただけなので
デザインは変わることがありますが
デザインを先に固めています。

と言いたいの？
2019/03/05(火) 11:43:17.86ID:DIrFqE8lM
「ざっくり方針決める」だけで給料もらえて納期遅れを下流のせいにできるなんて……


……なんていい仕事なんだ！俺がやりたい！
2019/03/05(火) 12:25:43.27ID:IGhfqt8ja
ウェブ系は楽だよなぁほんと
モダンで便利なエコシステム
ハイスペックな開発機
クラウドへのアクセスもサクサク
厳しい社内統制もなくゆるい現場
シンプルで簡単なドメイン
10年物のレガシーなんて無い
2019/03/05(火) 12:41:39.55ID:4lHVjw0ya
>>699
Java6「現役やで」
2019/03/05(火) 14:48:04.00ID:YFVILFEb0
>>698
わざと？必死だね？

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

でないと一人で作業することになって、2倍の時間がかかる
702デフォルトの名無しさん (ﾜｯﾁｮｲ 9701-3wv8)
垢版 |
2019/03/05(火) 16:44:18.98ID:nrrzzgEL0
>>699
フロントはどんどん楽になるよね。やってて楽しいのがweb系。ただサーバサイドやDB、ネットワークはレガシーも残ってるよ。
2019/03/05(火) 20:46:44.51ID:nwidEdp+0
>>701
その2倍ってのがおかしいって
2019/03/05(火) 23:25:03.26ID:8a3k8XPA0
たしかサーバーサイドJavaでJSPのテンプレートエンジン廃れたよね？
htmlに<if>とか<for>とか変なタグを入れるなって流れになったはずだけど
最近はJavaScriptで同じようなことしてるよなあ
2019/03/05(火) 23:42:35.99ID:exrcDGV20
それはJavaが廃れたんであって、Javaの世界じゃあ普通にやってるよ。
2019/03/06(水) 01:11:22.98ID:C3QpaLdU0
>>704
JSPはJAVAソースコードを出力する為のテンプレートであって、HTMLそのものでは無いよ。

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

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

んで、出力されたHTMLには<%if( 条件式 ){%>なんて文字列も出てこないよ。
そもそもこの<%%>タグはHTMLの為じゃなく、JAVAソースコード生成の為に使われるから出てくるわけ無い。
2019/03/06(水) 01:43:49.00ID:Uli2bEJM0
Spring Boot のテンプレートエンジンは、Thymeleaf とかだろ
2019/03/06(水) 08:55:10.29ID:lkGca0kGd
そういう意味ならJSFがある
2019/03/06(水) 22:12:48.11ID:oR6mPeK70
スレ違いかもしれないけど、たまには気分転換にvueとかreactとかの話題はどうかな？
2019/03/06(水) 23:50:49.60ID:1pbO3u+T0
Reactの仮想ＤＯＭとかいうのが未だに分からん
HTMLをオブジェクトの木構造にしないで文字列のままで握ってるってことでＯＫ？
2019/03/07(木) 02:22:49.29ID:/M0SxS0j0
>>710
違う。
メモリ上に持つ実DOMの劣化レプリカ。
そして利用者は実DOMはイジらず、劣化レプリカの方をイジる。
angular react vueなどの仮想dom系のライブラリが劣化レプリカの変化から、最小の実dom操作を計算して適用。
昔は人がやってた仕事がライブラリに委譲された格好。
712デフォルトの名無しさん (ｱｳｱｳｶｰ Sa6f-P5ld)
垢版 |
2019/03/07(木) 02:44:23.97ID:FkBKY4Sxa
HTML のタグを javascript のオブジェクトで単純に表現しただけのもの。react であれば、createElement 関数で生成されるオブジェクトのことになる。で、そのインスタンスの変化に合わせて実際の HTML に反映してくれる。
2019/03/07(木) 03:07:16.07ID:7lOwuU310
>>711
HTMLElementじゃないけど似たようなのをツリーで持ってるのか
HTMLElement.clone(true)でページ全体のクローンを作って、
それをＤＯＭ操作してからdocument.documentElementに差し替えるのかと思ってた

単純にFragment使ってＤＯＭ操作するより速いのか気になる
2019/03/07(木) 07:22:52.72ID:rioBJ/QG0
やってることは実DOMの変更をバッファして
変更タイミングをいい感じでやってくれてるってことじゃないの？
2019/03/07(木) 08:43:40.11ID:oVD+pZgg0
>>713
> 単純にFragment使ってＤＯＭ操作するより速いのか気になる
速くならない

× 仮想DOMは速い
○ 仮想DOMは遅くならないように頑張っている

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

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

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

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

つまり

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

と言ってるだけ

そもそも実DOMを操作しているときは、必要最小限のものしか書き換えないので
仮想DOMが差分（必要なところ）だけ書き換えるといっても、それ普通ですよね？という話でしか無い。
むしろ仮想DOMは実DOM操作よりメモリ使用量は増えるし、差分計算の分遅くなってる。
2019/03/07(木) 08:54:40.49ID:NrdLaj5lM
実DOM操作自体の速度は当然変わらない。
人が書くか仮想DOMライブラリがやるかの違いだけ。
ライブラリは実DOM操作の回数を減らすため仮想DOM持って計算頑張ってるだけ。
「DOM操作が速くなる」とか言ってるのは全部嘘。
2019/03/07(木) 09:00:44.74ID:oVD+pZgg0
> 人が書くか仮想DOMライブラリがやるかの違いだけ

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

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

その全部消して作り直すっていうのをやろうという発想が仮想DOMで
遅くならないように差分を計算して、必要最小限のものだけ変えよう。というふうに
自分で遅くしておいて、自分で改善した（速くした）って言ってるだけなんです
718デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/07(木) 09:10:38.72ID:FKXLE38I0
速度に関しては実dom直接操作よりは遅い。その辺はググればすぐ出るから見とくと良い。ただおかけでリアクティブという大きなメリットを手に入れた。ページ切り替えさえ差分更新してspaも出来る訳で、レスポンスは全体的に向上する。
2019/03/07(木) 09:19:40.62ID:NrdLaj5lM
人はある処理の中でDOMのどの部分を書き換えたいかを
知っている（担当の頭の中にある）ので、必要最小限のDOM操作しか変更しない。

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

人が脳のリソース使ってやるか仮想DOMライブラリが自動でやるかの違いだけ。
2019/03/07(木) 09:27:16.66ID:oVD+pZgg0
ここで忘れてはいけないのは

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

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

ということ

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

SPAもそうだ。ユーザーにとってはシングルページだろうが、マルチページだろうが関係ない。
シングルページだとページごとに分担して開発するのが難しくなる。
マルチページなら、ページごとに別の人が担当して開発するのが楽である。
721デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/07(木) 09:52:31.84ID:FKXLE38I0
リアクティブのメリットは複雑な入力フォームが分かりやすい。pc購入する際のカスタマイズ画面なんかが良い例。以前と比べて工期の短縮できて保守が凄く楽。部分的な導入も出来るからvueで試せば分かる。フォーム周りは圧倒的にリアクティブが良い。
2019/03/07(木) 09:57:57.50ID:oVD+pZgg0
>>721
リアクティブがやりやすいんじゃなくて、
以前のやり方がだめだっただけでは？
2019/03/07(木) 10:01:54.73ID:oVD+pZgg0
>>721
その例ってこんな程度でいいの？

https://www.dell.com/ja-jp/shop/serviceselection/cai401cspgmt04oo3ijp?selectionState=&;cartItemId=
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
724デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/07(木) 10:43:49.16ID:FKXLE38I0
>>722
ある入力に対して別の複数の要素が動的に変更される場合、リアクティブだとcomputedプロパティで自動的にuiに反映されるよう設定するのがとても楽。これjqueryだと面倒だしミスも増える。

>>723
この程度って。。結構大変だよ。条件も頻繁に変わるだろうし。
2019/03/07(木) 10:54:23.39ID:oVD+pZgg0
>>724
やっぱり使い方がわかってないだけだな

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

jQueryだと最低3行。あとはCSSでおしまい。
2019/03/07(木) 11:05:05.80ID:oVD+pZgg0
前から思ってるんだけど（自称）プログラマって
HTML/CSSは嫌いです。出来ません。って人多いよね。

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

多くのDOM要素はCSSを使って単に見えなくしたり表示したりすればいいだけなんだが
（プログラマとしての技術力不足で）CSSを使えないから
JavaScriptでいちいち作り出したり削除するしか出来ないんだよな
2019/03/07(木) 16:04:46.19ID:uSXw2eVGM
>>720
要件を勝手に決めつけないでよ
客からユーザーから代弁して喋るなら何だって言いたい放題じゃん
2019/03/07(木) 17:22:06.09ID:oVD+pZgg0
>>727
だったら要件を決めつけてメリットだって言わないでくれ
要件によってはデメリットなんでしょ？
2019/03/07(木) 18:14:20.13ID:mVKClUMzd
簡単にいい感じのページが作れるのはメリットの一つだと思うけどな。
例えばpythonは成果物に関してはCに対するメリットはないけど簡単に作れるから人気なわけで。
2019/03/07(木) 21:20:18.65ID:bV0vVOYFM
>>728
いやだからさ
「要件次第」で済む話を何度掘り返すのよ
スレタイ見てスレチだと思わないの？
2019/03/07(木) 22:37:46.71ID:cPei42ec0
>人はある処理の中でDOMのどの部分を書き換えたいかを
>知っているので、必要最小限のDOM操作しか変更しない
>（クソプログラマなら全部消して作り直すとかいう無駄してるかもしれんが）

クソプログラマは全部消して作り直す
賢いプログラマはどうDOM操作すれば最適かなどという生産性のない仕事をフレームワークに任せる
2019/03/07(木) 22:42:13.25ID:N/E4f3Caa
>>725
管理対象の状態数が増えるのがやだ
状態はできるだけ純粋で論理的な形式で管理したい
という要求がスッポリ抜けてるね
2019/03/07(木) 22:55:10.59ID:Tta1cO7U0
GoogleもこれからPWAで攻めてきそうだけどね
2019/03/07(木) 22:59:25.97ID:Y4GuSkwR0
>>732
CSSは宣言型なので、
管理対象の状態数が減るんですよ
2019/03/07(木) 23:00:35.30ID:Y4GuSkwR0
>>731
> 賢いプログラマはどうDOM操作すれば最適かなどという生産性のない仕事をフレームワークに任せる

もっと賢いプログラマは、必要なことしかしないんだよ。
Aを変えたいなら、Aだけを変えましょう。ってね
2019/03/07(木) 23:01:50.74ID:N/E4f3Caa
>>734
domの状態数は多すぎるよ
2019/03/07(木) 23:04:15.56ID:N/E4f3Caa
>>735
見えるか見えないかみたいな、ただの論理値を管理したいだけなのに
それをわざわざdom/cssの物理構造に縛られた迂遠な方法で管理するのは確かに賢くないな
2019/03/07(木) 23:09:46.27ID:oTfLqBj1a
まあ本当に賢いプログラマ達はフロントエンドなんてやらないんですけどね
2019/03/07(木) 23:11:14.61ID:N/E4f3Caa
>>738
それは同意
2019/03/07(木) 23:12:46.45ID:Y4GuSkwR0
AしたらBを変えたいんですが？

Reactを使うと・・・・



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

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

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

ムキー！
2019/03/07(木) 23:14:47.91ID:Y4GuSkwR0
>>737
> それをわざわざdom/cssの物理構造に縛られた迂遠な方法で管理するのは確かに賢くないな

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

あとはデザインを作る人が、その状態でどう表示したいかを作るだけなんです。
742デフォルトの名無しさん (ｵｯﾍﾟｹ Src7-EzoF)
垢版 |
2019/03/07(木) 23:23:16.99ID:jEbiMY7gr
fluxの概念を取り入れたらものすごく簡単に状態管理ができる！
って本にもキータにもみんな書いてるんだけど？
2019/03/07(木) 23:23:24.15ID:N/E4f3Caa
>>741
私が管理したいのは見えるか見えないかという2つの純粋な状態なんです
ブーリアンで済むものをわざわざスタイルシートやらクラスなどといった迂遠な方法で管理したくないんです
それはまるで物体から投影された影に干渉して、もとの物体を操ろうとするような愚かなことです
744デフォルトの名無しさん (ﾜｯﾁｮｲ ff3d-g2Ga)
垢版 |
2019/03/07(木) 23:58:03.68ID:tvHZX0HA0
どっちも極端じゃないか？
バインディングならjQueryよりはVueやReact使った方がいいと思うけど、
表示非表示やアニメーションならcss側でやった方がいいと思う。
2019/03/08(金) 00:38:11.11ID:kMybevyH0
仮想ＤＯＭとJQueryの世代の重要な違いとして
セレクタやDOM操作を一切したくないという発想があるのではないだろうか
JSXでHTMLをそのまま書くのもセレクタを使いたくないからだろうし
2019/03/08(金) 00:47:24.38ID:N66/0TP00
実DOM では、IO 操作が遅い

仮想DOMでは、JavaScript内の操作だけだから、速い
2019/03/08(金) 01:03:32.93ID:kMybevyH0
それはHTMLFragmentがあれば事足りる話っしょ
2019/03/08(金) 10:15:11.65ID:jbQifWXg0
>>743
> ブーリアンで済むものをわざわざスタイルシートやらクラスなどといった迂遠な方法で管理したくないんです

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

ある要素に、flagクラスというブーリアン値が
立っているか、立っていないか
2019/03/08(金) 10:16:08.10ID:jbQifWXg0
>>746
仮想DOMを実DOMに反映させる所で
大幅に遅くなるんだよ
750デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/08(金) 11:13:41.54ID:/TYC9ex30
>>725
リアクティブだと一行で終わるよね。単に変数をfalseにするだけ。ミスしようがない。うーん、なんでjQueryやcssにそこまでこだわるかね。みんな散々苦労してきた末のスマートな解決方法が仮想domでありリアクティブなんだけどな。一度試してみたら？食わず嫌いしないでさ。
2019/03/08(金) 11:17:51.39ID:jbQifWXg0
> リアクティブだと一行で終わるよね。単に変数をfalseにするだけ。

終わらねーよｗ 変数みてデザインを変えるコードを書かないとだめだろ
752デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/08(金) 11:28:53.74ID:/TYC9ex30
>>751
そう、まさにそこがキモ。ロジックとuiが綺麗に分離されてる。
Falseになった結果どうなるかはuiの管轄でcssやdomとは本来無関係なんだよ。jQueryはそこが分離できない。
2019/03/08(金) 11:35:19.90ID:jbQifWXg0
> そう、まさにそこがキモ。ロジックとuiが綺麗に分離されてる。

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

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

デザイナーはJavaScriptファイルを一切触らずに
デザインを作り込むことができる。
2019/03/08(金) 11:40:36.85ID:jbQifWXg0
jQueryで書く場合はこんな感じだね。

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

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

DOMの構成がどうなっているか一切気にする必要がないんだよ。
755デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/08(金) 13:46:44.51ID:/TYC9ex30
>>753
デザイナはスクリプトをいじる必要全くない。例えば
<div v-if=“isShow”></div>
というテンプレに対してスクリプトでは、
isShow=false
とするだけ。これだけでリアクティブになる。どっちがミスが少ないか分かるだろう？
756デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/08(金) 13:50:05.53ID:/TYC9ex30
すまん途切れた。どっちがミスが少ないか、分業しやすいか分かると思うんだが、どうかね？
2019/03/08(金) 13:55:12.54ID:jbQifWXg0
> <div v-if=“isShow”></div>

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

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

リ・ア・ク・ト。やり方覚えてくださいね。
やり方変えたんですよ。こっちのやり方にね。
え？他にも色々ありますよ。勉強してくださいー。
2019/03/08(金) 13:57:57.43ID:kMybevyH0
Javascript(Data/Model) - Javascript(UI/DOM) - HTML/CSS
デザイナーが真ん中の層を如何にやるのかという話だろう
HTML内にv-bindとか属性で埋め込むのもJQueryを書かせるのも同じこと
仮想DOMのフレームワークによって真ん中が無くなったとは言えないだろうし
2019/03/08(金) 14:02:22.95ID:jbQifWXg0
jQueryはプログラマが使って、
イベントに反応してクラスを変更するだけなんだよ。

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

デザイナーはデザイナーの流儀でやれるし、
JavaScriptフレームワークの流儀を押し付けることもない
2019/03/08(金) 14:05:09.01ID:jbQifWXg0
>>758
HTMLのタグはDOMですか？
CSSで指定する色や配置はUIですか？
761デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/08(金) 14:11:29.15ID:/TYC9ex30
>>758
いや随分コード減るぞ。当然ミスも減る。デザイナも楽になる。
>>757
うむ、リアクティブの方が良い事は理解できたようだね。あとは君がデザイナや上司を説得するんだよ。そこは別問題。
2019/03/08(金) 14:12:44.22ID:kMybevyH0
jQueryはすべてデザイナーがやるべき
ボタンをクリックしたらどのタグの色が変わるのか、それを知っているのはデザイナーだけで良い
2019/03/08(金) 14:20:09.62ID:jbQifWXg0
>>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/
764デフォルトの名無しさん (ｵｯﾍﾟｹ Src7-EzoF)
垢版 |
2019/03/08(金) 14:20:12.96ID:mjBCJk3zr
ほらほらだからこうなるって何度も言っただろ
フロントはフルスタックじゃないとこの程度ですら揉めるんだよ
もう一度言うぞ

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

お前ら言い争ってる時点で無能だと自覚しろ
2019/03/08(金) 14:20:13.82ID:kMybevyH0
>>761
＞いや随分コード減るぞ。当然ミスも減る。デザイナも楽になる。
そう、デザイン側のJSコードは減る。それはたしかだし、データ側JSとの繋ぎかたもはっきりとするね
欠点はHTML内に変なのをたくさん突っ込むのはいかがなものかってことかな
2019/03/08(金) 14:20:59.66ID:jbQifWXg0
>>762
> jQueryはすべてデザイナーがやるべき
JavaScriptのライブラリなのにデザイナーって意味不明ｗ

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

これが分業っていうんだよ。
2019/03/08(金) 14:28:57.63ID:B/j0V0h2a
>>757
どっちかというとその場合デザイナーに必要なのはv-showじゃなくてisShowだから
どういうモードの時変数の設定値を何にすべきかという一覧表があればいいだけじゃね？
てかその辺のコード化はデザイナーじゃなくてフロントエンジニアの仕事だろ
2019/03/08(金) 14:31:25.36ID:jbQifWXg0
> てかその辺のコード化はデザイナーじゃなくてフロントエンジニアの仕事だろ
フロントエンジニアがHTMLを書くから
分業できないってことなんですよ
769デフォルトの名無しさん (ｵｯﾍﾟｹ Src7-EzoF)
垢版 |
2019/03/08(金) 14:33:21.35ID:mjBCJk3zr
>>757
いや、お前がデザイン覚えろよwwww
2019/03/08(金) 14:36:15.92ID:kMybevyH0
>>766
プログラマーはcssに書かれたclassの名前まで知らなくていい
その方がデザイナーが変更してもプログラマーが対応しなくて済むだろ？
2019/03/08(金) 14:54:21.66ID:B/j0V0h2a
デザイナーはロジックレスな一枚ずつのhtmlと画像素材のcss作ってりゃそれでいいじゃん
772デフォルトの名無しさん (ｵｯﾍﾟｹ Src7-EzoF)
垢版 |
2019/03/08(金) 14:58:33.92ID:kvsQt7Fnr
UI・UXやインタラクションはエンジニアがやる分野
世界的にもその方向性になってきている
しかし世界中のエンジニアは無能だからまともにデザインできない
ごく簡単なUIすら理解できない

終わってんだろ
2019/03/08(金) 15:02:21.59ID:B/j0V0h2a
最低限のモダンっぽい見た目でいいならもうcssフレームワークのどれかでもいいだろ
2019/03/08(金) 15:07:22.44ID:jbQifWXg0
>>769
> いや、お前がデザイン覚えろよwwww

分業するんだよ
2019/03/08(金) 15:08:44.58ID:jbQifWXg0
>>770
分業っていうのは、完全に相手のことを知らないで
できるわけじゃないんだよ。

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

jQuery使って、HTMLとCSSを正しく使うだけで
最小限の連絡で、それぞれが開発できるんだよ。
2019/03/08(金) 15:11:41.12ID:jbQifWXg0
>>771
> デザイナーはロジックレスな一枚ずつのhtmlと画像素材のcss作ってりゃそれでいいじゃん

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

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

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

超簡単
2019/03/08(金) 15:13:04.69ID:kMybevyH0
>>772
いやUI・UXはデザイナーがやるべきだろ
そこで分離するからおかしなことになってる
2019/03/08(金) 15:15:10.57ID:B/j0V0h2a
デザイナーに求めるものなんて最低限なら画像データだっていい
html形式でブラウザで表示できるなら大助かり
期日が守れないヤツ多いから最低限期日までにどっちか出してくれればそれ以上に求める事なんてねぇんだが
779デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/08(金) 16:28:21.11ID:/TYC9ex30
>>763
くわー面倒だなあ。でもコード見ないと分からんか。

[JavaScript]
isActive=false

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

[css]
変更なし

どう？君のコードより随分少ないだろ。特にscriptなんて変数一個で終わり。まだ分からない事あるなら聞いてみなよ。でもスマホ手打ちなんで面倒なのはやめてw
780デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/08(金) 16:38:37.56ID:/TYC9ex30
おっとミスった。スマホ手打ちなんですまんね。

[HTML]
<div class="my-component" class=“{active:isActive}”>
正しくは
<div class="my-component" :class=“{active:isActive}”>
:が抜けてたよ。
2019/03/08(金) 16:49:32.55ID:oNzvowiX0
>>779
あのさぁ、動かないコード書かないでくれないか？
scriptタグまでは書かなくていいよ。jQueryでも書いてないからさ、
でも動くコード書いてっていったよね？
せめてjsfiddleで動かしてから来てよ
2019/03/08(金) 16:54:12.44ID:oNzvowiX0
なんか動くって嘘つきそうだから
>>779では動かないという証拠として
>>779の内容を https://jsfiddle.net/b5xusp1d/ に書いておいたから

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

jQuery版の実際に動くコードですよ。
https://jsfiddle.net/eu2wm3tk/
783デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/08(金) 16:55:22.77ID:/TYC9ex30
>>781
それは贅沢だなw。こっちはスマホだと言うのに。あ、そうか君はvue知らないから動作チェックできないのか。どうせなら入れてみたら？簡単だよ。
あとコードは短くなった訳だが感想はどうかね？
2019/03/08(金) 16:55:35.67ID:oNzvowiX0
ほんとなんですぐばれる嘘を作るんだろう？
理解できないな
2019/03/08(金) 16:56:30.27ID:oNzvowiX0
>>783
だから動かないって
証拠>>782にかいたからさ。
お前がスマホとか知らんわ

スマホだから動かなくてもいいでしょ？
嘘だけど、いいでしょとか。恥ずかしくないの？
2019/03/08(金) 16:58:49.01ID:oNzvowiX0
あ、ReactじゃなくてVueか。

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

https://jsfiddle.net/zvft0qo8/
787デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/08(金) 17:01:09.95ID:/TYC9ex30
>>786
書き方間違えてるぞ。vue初期からしなきゃ動かんよw
2019/03/08(金) 17:01:40.94ID:oNzvowiX0
あともう一つ教えといてあげるよ。

作ったのは.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/
2019/03/08(金) 17:02:12.51ID:oNzvowiX0
>>787
書き方間違えてるって。
動くコード書いてないお前の落ち度じゃん
2019/03/08(金) 17:07:56.77ID:oNzvowiX0
vueは面倒だなーって思いながら、

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

と指摘された点を
今書いてるのかな？ｗ
791デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/08(金) 17:08:24.75ID:/TYC9ex30
>>789
おいおい、vue知らないのに勝手にアップして動かないと言うのは無しだろ。知らないなら知らないと言えば教えてあげるのに。初期化方法までは面倒みれんぞ。jQueryだってそうだろ？
まあいいよ、後で動作する奴を上げてあげるよ。
2019/03/08(金) 17:12:52.61ID:oNzvowiX0
> jQueryだってそうだろ

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

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

いやまさかそんなこと、ありえるなんて思いもしなかった！
レベルなのか？ｗ
2019/03/08(金) 17:15:48.86ID:oNzvowiX0
ついでだからちょっと改造

$('.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/
2019/03/08(金) 17:19:36.99ID:oNzvowiX0
>>791
> まあいいよ、後で動作する奴を上げてあげるよ。

じゃあHTML側はこれ相当でお願いね。
コンポーネントは３つ。

<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>
795デフォルトの名無しさん (ﾜｯﾁｮｲ a701-chNm)
垢版 |
2019/03/08(金) 17:59:49.58ID:/TYC9ex30
>>794
ふう、やっとPCの前に戻ってきた。というわけでちょっと上げてみた。ブラウザから5ch書き込むの久しぶりだわｗ。
https://codepen.io/hinoragi/pen/YgVQjK

簡単にテンプレート化してコンポーネント化もしといた。何か分からないことあるなら遠慮なく質問してよ。ちょっと用事あるから次は10時ぐらいにスレみる予定。
2019/03/08(金) 18:05:40.88ID:oNzvowiX0
[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のコードに移動したんで
デザイン変えたきゃVueの方いじってくださいねｗｗｗ

やっぱりこうなるｗ
2019/03/08(金) 18:07:11.66ID:oNzvowiX0
[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の方いじってくださいねｗｗｗ

やっぱりこうなるｗ


行数は増え、分業ができなくなる
2019/03/08(金) 18:11:58.57ID:oNzvowiX0
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>
799デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/08(金) 18:44:14.67ID:/TYC9ex30
>>797
気になって覗きに来たら案の定。。うーん、そこから先は話長くなるぞ。一番簡単なサンプルだし、5chでやる規模じゃない。
それより最初の話はどうした？vueの方が随分コード短いぞ。その質問に答える為にサンプル上げたんだが、答えるのが礼儀ってもんだぜ。
2019/03/08(金) 18:49:38.83ID:oNzvowiX0
>>799
> 気になって覗きに来たら案の定。。うーん、そこから先は話長くなるぞ

jQueryと同じことをするのに、話が長くなるんだへーｗ

ま結論な。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'})
2019/03/08(金) 18:52:05.37ID:oNzvowiX0
それに一番ひどいのは、やっぱりmy-componentのdivの中身を
デザイナがいじろうとしたら、JavaScriptファイルを修正しなければ
ならなくなるってところなんだよね。
DOMとコードが密接に結びついちゃってる。
2019/03/08(金) 18:56:00.97ID:oNzvowiX0
jQueryの場合、JavaScriptのコードとDOMの構造は結ぶていてなくて
結びついているのは、.my-componentというクラス名と
input name=switchだけ。だからDOMの構造をどんなに変えても
クラス名とそういう名前のinputがあればいい
コードとDOMの構造が分離されている
803デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/08(金) 19:11:44.53ID:/TYC9ex30
>>801
やっぱり全く理解できてないじゃん。最初の話に戻すぞ。
最初の例ならスクリプトは、
new vue({data:{isActive:false}})
これだけ。君が分からなくて動かん！！とか騒いでた奴。君のその3行のスクリプトと比べてみなよ。

次に、まあ君はvue知らんからしょうがないがテンプレートは実務では当然外部に持つ。単一ファイルコンポーネントでググれ。

これで聞かれた事は答えたって事で俺からも質問していいか？

さっきからコンポーネントと言ってるが、君のはコンポーネントじゃないだろ。単なるコピペでカプセル化も局所化も無い。サンプルである事を割り引いてもコンポーネントと呼べる内容じゃない、と思うんだが、マジでどう思ってるの？
2019/03/08(金) 19:14:42.43ID:oNzvowiX0
>>803
> new vue({data:{isActive:false}})

それだけだと、どれと結びついてるのか（＝セレクタ）その情報がないだろ。
セレクタを省略して良いんだったら、jQueryだってこの一行だよ。
toggleClass('active', this.checked);
2019/03/08(金) 19:16:38.22ID:oNzvowiX0
いや、値を変えるコードすら無いかｗ
jQueryだとこれだなｗ Vueより断然短い
'active'
2019/03/08(金) 19:23:09.87ID:oNzvowiX0
> 最初の例ならスクリプトは、
> new vue({data:{isActive:false}})
> これだけ。

これだけで動く！（=動かない）

これなんて詐欺？ｗ
807デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/08(金) 19:25:20.00ID:/TYC9ex30
>>804
がーん、ここまで書いても分からんか。それ動作せんだろ。。自分で言った様に動作するコードで比較しようぜ！！
それと、俺は君を責めてる訳じゃなんだぜ。長年jQueryには世話になったから、優秀なライブラリだとよく知ってる。でもここはvue react angularスレだろ。jQueryはややすれ違いなんだよ。でもまあお互いの長所短所を比較しつつ、まったり雑談しようや。
808デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/08(金) 19:26:43.19ID:/TYC9ex30
>>806
wwワザとか？vue本体ロードしなはれよ。
2019/03/08(金) 19:29:20.37ID:oNzvowiX0
>>808
はい。動かない証拠。vue本体は前の人がロードしてますよーｗ
https://codepen.io/anon/pen/MxmrjP
2019/03/08(金) 19:30:11.51ID:oNzvowiX0
>>807
だから動作しないコードを出して
これだけって嘘を付くのをやめろって言ってるんだが、

これだけって、どこまでごこれだけなんｄ？
動作しないコードまでがこれだけか。
2019/03/08(金) 19:30:33.50ID:oNzvowiX0
これだけって、どこまでがこれだけなんだ？
動作しないコードまでがこれだけか。
812デフォルトの名無しさん (ﾄﾞｺｸﾞﾛ MM97-w6xA)
垢版 |
2019/03/08(金) 19:35:01.38ID:YjtKBzOFM
はあ、、分かった分かった。最初の例で動く奴上げてやるよ。出先でだから1時間後な。

で、その間に俺の質問にも答えてくれ。君のコードは再利用できないし、コンポーネントではない。どう再利用するつもりなの？そのむき出しのmy-conponentで。
2019/03/08(金) 19:37:01.18ID:oNzvowiX0
見ての通り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書いてる人は知らないタグを使うように強制され
属性が名前になるんですよーとか、新たなルールを押し付けられることになってる。
2019/03/08(金) 19:39:05.43ID:oNzvowiX0
>>812
> で、その間に俺の質問にも答えてくれ。君のコードは再利用できないし、コンポーネントではない。どう再利用するつもりなの？そのむき出しのmy-conponentで。

普通に再利用できてるんだが？
そもそもjQueryのコードは状態を保持していない。

わかるか？jQueryのコードには状態がない。
状態は、HTMLのタグに存在している。

だからHTMLのタグの分だけインスタンスが存在しているようなもので、
普通に再利用できる。
2019/03/08(金) 19:43:49.07ID:oNzvowiX0
Vueの場合、コンポーネントが状態を持ってしまってる。
isActiveという変数のことな。

状態を持ったisActiveを共有することは出来ないから、
新た無いHTMLのタグを作らければいけなくなってしまっている。

そしてisActiveという事実上のローカル変数を参照するために、
JavaScript側でHTMLを書くしかなくなってしまっている

HTMLがガッツリJavaScriptと結びついてしまっているわけだ
816デフォルトの名無しさん (ﾄﾞｺｸﾞﾛ MM97-w6xA)
垢版 |
2019/03/08(金) 20:00:52.98ID:YjtKBzOFM
>>815
どこから突っ込めばいいんだ。。

> Vueの場合、コンポーネントが状態を持ってしまってる。
> isActiveという変数のことな。

コンポーネントは状態持つものだよ。いや認識の相違とかじゃなく普通に。そして隠蔽されるべきもの。

> 状態を持ったisActiveを共有することは出来ないから、

普通に参照できる。

> そしてisActiveという事実上のローカル変数を参照するために、
> JavaScript側でHTMLを書くしかなくなってしまっている

単一ファイルコンポーネント。

> HTMLがガッツリJavaScriptと結びついてしまっているわけだ

まさかと思うがサンプルのtemplate見て言ってる？結びつくの真意が分からんがjQueryも結びついてるだろ。
817デフォルトの名無しさん (ﾄﾞｺｸﾞﾛ MM97-w6xA)
垢版 |
2019/03/08(金) 20:09:37.29ID:YjtKBzOFM
いいよ、もう少し分かりやすい質問しよう。
コンポーネントの要素として、簡単に テンプレート、css、jsがあるとしよう。3つ合わせてコンポーネントね。これらは外部から容易に参照できてはいけないし、干渉されてはいけない、複製も容易でないとダメ。
君のやり方で、my-componentをどうコンポーネント化するのか例示して欲しい。
2019/03/08(金) 20:19:23.19ID:QXTI5KI7a
わかった

Delphi使え
2019/03/08(金) 20:35:47.91ID:oNzvowiX0
>>817
何が言いたいのかわからん。

CSSで div { color: red } って書いても
影響を受けないようになんて、Vueでもできないだろ
2019/03/08(金) 20:36:44.19ID:oNzvowiX0
>>816
> まさかと思うがサンプルのtemplate見て言ってる？結びつくの真意が分からんがjQueryも結びついてるだろ。

jQueryでは結びつかない。

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

↑どこにjQuery関連のものがあるか言ってみな
2019/03/08(金) 20:43:00.51ID:oNzvowiX0
> Vueの場合、コンポーネントが状態を持ってしまってる。
> isActiveという変数のことな。

訂正

Vueの場合、JavaScriptのコードが状態を持ってしまってる。
isActiveという変数のことな。

だからDOMとJavaScriptのインスタンスを一対一で
紐付けなければならなくなってる。密接に結びついている。

jQueryの場合JavaScriptのコードでは状態を持たないから、
DOMが一つだろうと複数だろうが、処理を共有化できる。
822デフォルトの名無しさん (ｵｯﾍﾟｹ Src7-EzoF)
垢版 |
2019/03/08(金) 21:16:27.20ID:kvsQt7Fnr
デザインやUI・UX、インタラクションが実装できないクソエンジニアどもがギャーギャー騒いでる
お前ら自分の無能さを披露して恥ずかしくねえの？

フロントやるならデザイン込みでUIくらいやれや
クソみたいなUI作ってんじゃねえよ
2019/03/08(金) 21:19:25.25ID:oNzvowiX0
餅は餅屋
824デフォルトの名無しさん (ﾜｯﾁｮｲ a701-chNm)
垢版 |
2019/03/08(金) 21:31:02.59ID:/TYC9ex30
ただいまー。という訳で最初の質問の答えアップだよ。
https://codepen.io/hinoragi/pen/jJmzJG
なんの質問か忘れてるだろうから、君の763の質問引用するよ。

>jQueryの方が少ないですね。
>嘘だと思うならこれ同じことを実際に動くのに必要な分、書いてみてください。
>$('.my-component [name="switch"]').change(function() {
>　$(this).closest('.my-component').toggleClass('active', this.checked);
>});
http://jsfiddle.net/tk5yvs3g/

で答えがこれね。

new Vue({
el: '#app',
data: {isActive:false},
})

どう？まあこんな短いサンプルで比較するのもどうやねんってのは分かるけど質問にはちゃんと答えたよ。
html含めても確実にvueの方が少ないよね。
あと少しはvueやreact勉強しようよ。こんな短いサンプルの初期化方法すら知らなかった訳で、知らないからって全力否定するのはどうなのって思うぞ。
825デフォルトの名無しさん (ｵｯﾍﾟｹ Src7-EzoF)
垢版 |
2019/03/08(金) 21:36:39.46ID:kvsQt7Fnr
デザインできてUIUXできるようになれば引く手数多だぞ
ほんとフルスタックはほとんどいないから
年収は最低でも1000万はいく
2019/03/08(金) 21:40:42.36ID:NeLzfZqe0
静的なWebページがあってそこにちょっと動きを付ける程度ならjQueryがお手軽。まぁそうだな。
2019/03/08(金) 22:04:03.93ID:oNzvowiX0
>>824
my-componentの外に、置いたinputでも動くし、
my-componentを複数置いたら、おかしくなるし、
お前馬鹿なの？ 少しは書く前に頭使ったら？
2019/03/08(金) 22:19:01.08ID:JZ/onRPtM
行数連呼しといてそりゃねえだろ
2019/03/08(金) 22:29:51.19ID:i92SBzwIa
やっとReduxがちゃんと分かってきた

けどActionって関数にする必要ってなんのためなの？
constの定数でもいいような気もするんだけど
2019/03/08(金) 23:22:07.35ID:8MLFoUZt0
まさか知らないで叩いてたとはなぁ
2019/03/09(土) 00:19:50.47ID:/m10ZyJL0
UIUXが複雑化すればデザインと密接になり、デザインがやるべきことになる
昔ながらのショッピングカートならそうでもないかもしれんがｗ
832デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/09(土) 00:31:16.43ID:e9DsS9n/0
>>827
> my-componentの外に、置いたinputでも動くし、
> my-componentを複数置いたら、おかしくなるし、
> お前馬鹿なの？ 少しは書く前に頭使ったら？

君は本当成長ないね。過ちは認めようよ。俺は君の質問に的確に答えたよ。同じ動作をするより短いサンプルだろ。その返しがこれって、そんなに負けが認められんか。だから駄目なんだよなあ。。

あと批判するなら少しはvueやreact勉強してから述べような。俺もまさかど素人が批判してるとは思わなかった。当然ある程度は知ってて、それ故に批判すると思うじゃん常識的に考えてさ。そこはすまん。思い至らなかった。次からはスルーするよ。おやすみぃ。
2019/03/09(土) 00:48:24.43ID:RYW8IiyE0
同じ動作してないよね。
my-componentの外に、置いたinputでも動くし、
my-componentを複数置いたら、おかしくなるし、
お前馬鹿なの？ 少しは書く前に頭使ったら？
そんなにjQueryよりもVueの方が長くなることが許せないの？
事実を受け入れようよｗ
2019/03/09(土) 00:53:19.31ID:zxiwPMOw0
なんでjQueryの動作を真似ることが前提なんだよ
言ってることめちゃくちゃじゃん
2019/03/09(土) 00:58:02.98ID:RYW8IiyE0
> なんでjQueryの動作を真似ることが前提なんだよ

お前言ってることがおかしい。

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

これと同じことを実現するという話で、
これというのは、.my-component（クラスなのだから当然）中の [name="switch"]'からの
イベントで.my-component に active クラスをつけるというものなんだから、
最低限の条件を満たしてない
2019/03/09(土) 00:58:26.63ID:RYW8IiyE0
訂正

これというのは、.my-component（クラスなのだから当然複数ある）中の [name="switch"]'からの
2019/03/09(土) 01:00:24.50ID:RYW8IiyE0
.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'})
2019/03/09(土) 01:02:17.14ID:RYW8IiyE0
しかもこれ

　　<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>
2019/03/09(土) 01:02:49.95ID:N2GlqC3/0
こんなところにクソコードベタ貼りしてないでCodesandboxで動くソースでも書いてからリンク貼れよ
2019/03/09(土) 01:04:30.20ID:RYW8IiyE0
>>838の実際に動くコードはこちら

http://jsfiddle.net/rhp9dvya/

これと同じことをVueで実現するコードは
更に長くなる
2019/03/09(土) 01:11:28.76ID:zxiwPMOw0
はっきり言うけどさ
中のinputまで丸ごとコピペしないと動かないコンポーネントとかコンポーネントじゃねえよ
jQueryならDOM構造は気にしなくて良かったんじゃないのか
842デフォルトの名無しさん (ﾄﾞｺｸﾞﾛ MM97-w6xA)
垢版 |
2019/03/09(土) 01:36:21.59ID:ovl4dn3WM
最後にまとめて答えとくよ。

>>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になるだけだよ？何がそんな嫌なのさ？
2019/03/09(土) 02:04:13.30ID:MQBXPAS0M
jQueryの人頑張ってるみたいだけど
jQ
844デフォルトの名無しさん (ﾄﾞｺｸﾞﾛ MM97-w6xA)
垢版 |
2019/03/09(土) 02:07:07.23ID:ovl4dn3WM
>>838

> という固定のDOM構造にしか使えないので
> jQueryよりも劣っている

これが大いなる勘違いなんだがもう説明しない。いいから学べ。

> jQueryだとHTML（DOM構造）を自由に変更できる。
> 以下のどのように変更しようとも、JavaScriptのコードは変更の必要はない

これアンチパターンで混乱の元。カプセル化できないコンポーネントなんぞ不安で使えたもんじゃない。セレクタの影響範囲が広すぎて便利なつもりになってるだけ。将来的なデスマーチが約束された最も最悪な例だと気いて欲しい。
845デフォルトの名無しさん (ﾄﾞｺｸﾞﾛ MM97-w6xA)
垢版 |
2019/03/09(土) 02:21:00.49ID:ovl4dn3WM
あとさ、いいからjQuery君はスレタイ読もうついでに空気もね。
ココはvue react angularスレだよ。公式のサンプル一つも試した事ないのバレてるのよ？？なのにどうやって比較してるの？妄想じゃんそれ。
両方のコード見せて具体的に証明してよ。君の言うjQueryの優位性をさ。そしたら俺もキチンと答えるよ。間違ってたら謝るし。俺もjQueryは散々世話になったから嫌いじゃないのよ？
2019/03/09(土) 02:50:20.05ID:Tm/Y9JxW0
ただ単に覚えたくないんだよ
新しい言語を　
jQueryは
2019/03/09(土) 03:10:54.41ID:n56g/PGg0
女子更衣室に堂々とチン入してきて延々巨根自慢をする粗チンバカ
2019/03/09(土) 07:00:21.97ID:RYW8IiyE0
>>842
> できる。scopedでググるか、詳しくはvueの公式見よう。

scopedは、コンポーネントだけで使えるCSSであって
外部からの影響を受けないようにするものじゃないよ
素人かよｗ

> そこは結びつかなきゃ困るんだよ。リアクティブなんだから。
理由は？ｗ
2019/03/09(土) 07:01:33.11ID:RYW8IiyE0
>>845
> 両方のコード見せて具体的に証明してよ。君の言うjQueryの優位性をさ。

jQueryの動くコード
http://jsfiddle.net/rhp9dvya/

Vueの動くコードはでてない。
my-componentの外に、置いたinputでも動くし、
my-componentを複数置いたら、おかしくなる
というクソコードしか出てない
2019/03/09(土) 07:05:56.25ID:RYW8IiyE0
リアクティブなんだから！（自分で言っていて意味わかっていない）


↑ぷぎゃーｗ
2019/03/09(土) 07:06:59.38ID:RYW8IiyE0
> nameがv-modelになるだけだよ？何がそんな嫌なのさ？

デザイナーの世界にないVue（JavaScript）専用の概念を
持ち込むことだね。
2019/03/09(土) 07:17:14.04ID:zxiwPMOw0
だからおかしくて当然なんだって
勝手にコンポーネントと名乗ってるだけでそれコンポーネントじゃないから
ただのjQuery特有の動作だから
2019/03/09(土) 07:18:18.22ID:RYW8IiyE0
Vueのコンポーネントだけが
正しいコンポーネントだとか
恥ずかしいよ？
2019/03/09(土) 07:22:27.20ID:zxiwPMOw0
でもあなたはjQueryの正しいコンポーネントが再現出来ないからクソコードって言うんでしょ
恥ずかしくないの？
2019/03/09(土) 07:26:00.83ID:RYW8IiyE0
jQueryの場合というか、コンポーネントというのは別にjQueryの用語ではなく
単にHTML（DOM）の構造によって形作られたものに過ぎない。
専門用語ではなく、単なる英語としてのコンポーネント

この場合のmy-componentというのは、my-componentというクラス名から始まり
内部にname="switch"があるというコンポーネント
my-componentの条件はこれだけだから、DOMの構造はHTMLを修正するだけで柔軟に変更できる。

デザイナはこの条件を守っている限りHTML（CSS)を変更し自由にデザインできるし、
プログラマもデザインが変わってもJavaScriptコードを変更する必要がなくなる。
デザイナの担当とプログラマの担当、つまり修正するファイルが明確に分かれているのも良い
どちらも自分の担当するファイルを自由に変更できるから分業することも容易になっている
2019/03/09(土) 07:29:39.24ID:RYW8IiyE0
>>854
いや、常識的な仕様を守ってないからクソコードって言ってるんだよｗ

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側のコード。これだけって言ったんだから、これだけでやってみせろやｗ
https://codepen.io/anon/pen/BbZNVM
2019/03/09(土) 07:45:09.02ID:RYW8IiyE0
ここで（HTML側を自由変更できないとはいえ）複数置いても問題ないコードを
書いてるから常識的な仕様ぐらい理解してると思うんだよねｗ
https://codepen.io/hinoragi/pen/YgVQjK

でもそれだとVueの方がjQueryよりも大幅に長くなっちゃったから
これだけでできる！（←まともに動かない）

と騙そうとしたんだろうね。
でもバレちゃったｗ
858デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/09(土) 08:07:35.93ID:e9DsS9n/0
>>848
アホはお前だろう。。もう少しよく読んで意図把握しよう。
あとやっぱり君はリアクティブ自体理解できてないのがよくわかる。だからもう少し公式読め。
859デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/09(土) 08:10:00.82ID:e9DsS9n/0
>>849
ほら
自分が書けないからそうやって逃げる。全く進歩しない。分からない事は否定するだけ。いいから自分で勉強証明しなって。見ててやるからさ。
2019/03/09(土) 08:10:39.68ID:zxiwPMOw0
提示された例がコンポーネントじゃないから当然なんだって
inputが中に２つあっても動いちゃうし無かったら役立たずのmy-componentが残るだけ
綺麗にコピペしないと動かないなんて常識的なコンポーネントの仕様を守ってないよね
861デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/09(土) 08:16:51.61ID:e9DsS9n/0
>>857
なあ自分で言ってて悲しくならない？
new Vueすら知らない事バレてるんよ君w。俺はもう説明しない。基本すら自学できない奴に教える価値無い。
862デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/09(土) 08:24:01.30ID:e9DsS9n/0
>>855

> jQueryの場合というか、コンポーネントというのは別にjQueryの用語ではなく
> 単にHTML（DOM）の構造によって形作られたものに過ぎない。
> 専門用語ではなく、単なる英語としてのコンポーネント

無知極まってるぞ。勝手に定義するな。マジで少し勉強して。そんな俺様定義だからあんな再利用できない紛いモノ書くんだよ。
863デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/09(土) 08:28:42.54ID:e9DsS9n/0
だああ、色々言いたいが出社だ。
いいかiQuery君。君はまずスレチだ。そこをまず理解しろ。
その上で書くならせめてjQueryとvue react angularのどれか、2つのコードを比較しながらjQueryの良さを語れ。
それがここに書き込む最低の礼儀じゃね？
864デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/09(土) 08:37:47.27ID:e9DsS9n/0
最後にもう一回言うぞ。
jQueryのコード置くだけで「だからvueだめなんだよ」コレ止めろ。
基礎だけでもVueを勉強してから発言するのが筋だぜ。でないと話が通じないから困るんだよ。ほらココvueのスレでもあるし。
2019/03/09(土) 09:14:15.58ID:N2GlqC3/0
>>849
かっこいい画像.gifくらいちゃんと用意しろよ
2019/03/09(土) 09:18:13.96ID:izNw5U5za
>>851
デザイナーは巣のhtmlだけ書いてくれりゃいいよ
実環境にコードをマージする作業はこっちでやるし
2019/03/09(土) 09:19:00.94ID:zJdX2n9h0
これは素晴らしい煽り合いだな
お互いコードでやりあうとか
勉強になります
2019/03/09(土) 09:20:39.95ID:b+N//s300
多分、「jQueryで十分」って主張してる人は、結局SPAの概念が習得出来なかった、あるいはする気のない人じゃない？

最新のフロントエンド開発について行けないから、新しい物の価値を否定して、
自分の相対価値が下がって行くのを阻止したいんじゃないかと。

今後SPAがどうなるかなんて分からないけど、少なくとも新しい事に挑戦もせず、勉強もせず、
自分が理解出来る古い技術にばかりすがるのは、正直エンジニアとしては失格だと思うよ。

そういった人が今すべき事は、不真面目な自分を戒めて勉強に励むか、
あるいはエンジニアとしての死を素直に受け入れて、別の道を模索するかのどっちかにしたらいいんじゃないかと。
2019/03/09(土) 09:22:15.82ID:ezqy2TGU0
スレチだし
ライブラリとフレームワークを比較する具合が香ばしさ
2019/03/09(土) 09:23:51.52ID:N2GlqC3/0
>>856
独立タグはちゃんと閉じろよ性格の雑さが出てるぞ
<input />
2019/03/09(土) 09:29:59.29ID:OAlfgW/Ia
jQueryはデザインの物理的な構造にプログラムが強く依存してしまうから生産性が低い
プログラムがデザインの物理的な構造に依存することを知ってるからデザインも安易に作れない(プログラムから扱えるようにするために物理的な制約が生まれる)

VueはVMを使ってロジックとデザインを明確に分離してるのでそういった不都合はかなり軽減される
全くないとは言わないがね
2019/03/09(土) 10:53:00.46ID:RYW8IiyE0
>>870
それが必要なのはXHTML。HTML5では、/>は許容されるが
タグを閉じるという意味はなく単に無視されるという扱い。
2019/03/09(土) 10:53:39.13ID:RYW8IiyE0
もう一回載せようか？ はやくこれだけで作って欲しいんだが

>>854
いや、常識的な仕様を守ってないからクソコードって言ってるんだよｗ

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側のコード。これだけって言ったんだから、これだけでやってみせろやｗ
https://codepen.io/anon/pen/BbZNVM
2019/03/09(土) 11:15:35.75ID:/2BHRI8Ma
素人w
2019/03/09(土) 11:19:10.07ID:OAlfgW/Ia
Vue(というかMVVM)の素晴らしいところはjavascript側はhtml/css側がどうなってるのか知らなくてもいいところ
そしてhtml/css側はjavascript側がどうなっているか最小限の知識で済むこと

jQueryではお互いがお互いに対する知識を多く必要としているため結合が非常に強くなってしまう
これでは分業は難しい
2019/03/09(土) 11:30:18.17ID:RYW8IiyE0
>>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が埋め込まれてしまってる
877デフォルトの名無しさん (ﾜｯﾁｮｲ a701-chNm)
垢版 |
2019/03/09(土) 11:43:48.95ID:e9DsS9n/0
>>873
馬鹿野郎。。。それは最初のv-bindとv-modelのサンプルだろうが。
コンポーネントはこっちだ。
https://codepen.io/hinoragi/pen/YgVQjK
何度も何度も行ったがhtmlは分離できるぞ。ちったー勉強しろよ。

んでさ、修正点があるなら自分で書けばいいじゃない。別に複雑なコードじゃない。たった数行だぜ？コードに異論があるならコードで示す。当たり前だと思うがjQuery君は違うのかな？
それすら出来ず、vueが分からないからオウム返しのようにクソ呼ばわりする。それただのバカって言うんだよ。いい加減自覚しろ。

君に少しでもプライドがあるなら、君の思ったとおりに動作するvueのコード上げてみな。時間はかかってもいいからさ。
2019/03/09(土) 11:45:53.12ID:OAlfgW/Ia
>>876
埋め込んだのだからそれは仕方ないでしょう

ちなみに私はVueの真の利点はMVVMによるViewとViewModelの分離であると考えています
世の人々はコンポーネント志向に興味を惹かれているようですがそれはオマケです
私はVueを使ったとしてもhtml/cssとjsを同居させることはありません

それにjQueryでもコンポーネント化しようとすればテンプレートの埋め込みになる筈です
埋め込みを拒否した場合はhtmlのコピペになるでしょう
その点についてはVueもjQueryも同じことです
なので問題はVueではなくコンポーネント志向の方にあることがわかります
2019/03/09(土) 11:47:01.74ID:RYW8IiyE0
> 何度も何度も行ったがhtmlは分離できるぞ。ちったー勉強しろよ。

だったら分離してくださいよ。
"分離できるぞ" と言ってるからには、今のコードは分離されてないってことでしょ
それをしないのは、分離すると余計に長くなるってことなんでしょ？
2019/03/09(土) 11:47:56.22ID:GVs3bbIF0
Vue, React は、コンポーネント指向。
デザイナー・プログラマーの分業体制

jQuery は、そういう観点ではない！
2019/03/09(土) 11:48:33.65ID:RYW8IiyE0
>>878
> それにjQueryでもコンポーネント化しようとすればテンプレートの埋め込みになる筈です

ならない。なんのためにHTMLにテンプレートタグ <template> が出来たと思ってるんだ？
2019/03/09(土) 11:49:39.85ID:OAlfgW/Ia
>>879
重要な点はVue(MVVM)はViewとViewModelが疎結合であり
jQueryはViewとLogicが密結合している事です
それに比べればコードの行数は大した問題にはなりません
2019/03/09(土) 11:53:02.83ID:RYW8IiyE0
>>882
これがjQueryのコードなんだが
どこが結びついてるの？

$('.my-component [name="switch"]').change(function() {
　$(this).closest('.my-component').toggleClass('active', this.checked);
});
2019/03/09(土) 11:53:04.50ID:QoZVVHuY0
ツマンネーよ
2019/03/09(土) 12:00:56.94ID:OAlfgW/Ia
>>881
それはテンプレートの置き場を変えただけです
テンプレートをjavascriptからhtmlへ追い出すだけならVueでも可能です

しかしコンポーネント志向場合はテンプレートをhtmlに追い出しても意味はありません
異なるページでコンポーネントを再利用する場合を考えればそれが無意味であることがわかります
2019/03/09(土) 12:03:54.96ID:RYW8IiyE0
>>885
> それはテンプレートの置き場を変えただけです

だからお前がjQueryだと埋め込むしか無いっていったから、
置き場を変えてやったんだろうが
置き場を変えることでデザイナが自由にHTMLを変更できるようになる
プログラマは、中身がどう変わろうが意識する必要がなくなる
これが分業だろうが
2019/03/09(土) 12:04:02.87ID:N2GlqC3/0
もう「jQuery vs Vue」みたいなスレでも立ててそっちでやれよ
2019/03/09(土) 12:05:41.67ID:RYW8IiyE0
>>885
> 異なるページでコンポーネントを再利用する場合を考えれば

お前まさか、デザイナがページのヘッダとかフッタを
共通化せずにページごとに全部書いてると思ってるのか？
失礼だろｗ
889デフォルトの名無しさん (ﾜｯﾁｮｲ a701-chNm)
垢版 |
2019/03/09(土) 12:06:04.85ID:e9DsS9n/0
>>879
君は本当に面白いな。俺には君の不満点が全部見えない。当たり前だよな他人だし。だから修正したコードを君自身が書くことに意味がある訳さ。勉強にもなる。それに君は俺が何を書いても文句を言うだろう。後付で色々言われるのは面倒だ。
だったら、君の素晴らしいコードと、俺の糞コードを比較すればいいじゃん？君の正当性はコードでしか証明できないんだぞ。

たった数行の修正だし簡単だからトライしてみなって。それを見て意見出し合おうや。
2019/03/09(土) 12:07:36.71ID:flOfKdeWM
>>883
そのコードと<div>の中身がべったり対応してるじゃん
my-component以外に正確にコピペしてもらわないと動かない時点でコンポーネントじゃない
2019/03/09(土) 12:07:52.12ID:RYW8IiyE0
>>889
> たった数行の修正だし簡単だからトライしてみなって。それを見て意見出し合おうや。

えとさ、なんでお前の利益になることを俺がしないといけないの？ｗ
2019/03/09(土) 12:08:40.26ID:RYW8IiyE0
>>890
> そのコードと<div>の中身がべったり対応してるじゃん

<div>の中身がべったりってどういうこと？

divの中身はいろいろ変えられるんだけど？
そもそもdivである必要すらない
2019/03/09(土) 12:12:57.48ID:OAlfgW/Ia
>>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の属性のブール値を切り替えるだけです
894デフォルトの名無しさん (ﾜｯﾁｮｲ a701-chNm)
垢版 |
2019/03/09(土) 12:14:08.39ID:e9DsS9n/0
>>883
なんで分からんの？まさにそれも密結合と言うんだぞ。クラス名やセレクタ使ってるだろ？
スクリプトからはdomのクラスやセレクタなぞ、可能な限り知る必要はないってこと理解できない？
2019/03/09(土) 12:17:29.40ID:RYW8IiyE0
>>893

Vue(MVVM)ならばそのような仮定は全く必要ありません
代わりにHTMLを直接書き換えるからです。
HTMLにコードがべったり結合してしまっています
2019/03/09(土) 12:17:40.62ID:flOfKdeWM
>>892
jQプログラマ「my-componentを置いてくだだい」
デザイナ「<div class="my-component"></div>」
これで分業なんて出来るかよ
2019/03/09(土) 12:18:35.13ID:RYW8IiyE0
>>894
> スクリプトからはdomのクラスやセレクタなぞ、可能な限り知る必要はないってこと理解できない？

DOMのクラスやセレクタを使わないでやるなら
HTMLに直接React用のコードを埋め込むしか無いやんｗ
2019/03/09(土) 12:18:44.76ID:OAlfgW/Ia
>>886
デザイナは自由ではありません
jQueryコードを理解してプログラムを破壊しないように作業しなければなりません
プログラムを破壊しないための条件は明確にはなっていません

そもそもあなたはコンポーネントの意味を理解していないようです
template tagを使用しても別の画面では再利用できません
それはコンポーネントではありません
コンポーネントはテンプレートとロジックが1つのブロックとして再利用可能な形態になっている必要があります
2019/03/09(土) 12:21:48.66ID:OAlfgW/Ia
>>888
それは補助的な方法論です
補助的な方法を使用していいならVueのコンポーネントからテンプレート分離することも容易に可能です
あなたの最初の主張は完全に理を失いました
2019/03/09(土) 12:23:08.25ID:RYW8IiyE0
>>896
jQueryプログラマ「この動きがほしい所に my-componentというクラス名をつけてください」
デザイナ「はいわかりました。昔からあるLightBoxみたいなやつですよね。
aタグに特定の属性をつけるだけで画像のポップアップができて簡単ですよね」
2019/03/09(土) 12:24:33.39ID:RYW8IiyE0
>>899
> あなたの最初の主張は完全に理を失いました

意味わからん。逆だろ

お前がjQueryでもコードの中にHTMLを埋め込むしか無い！って
jQueryを貶めようとしたから、それは間違いって言ってるんだが。

俺がいつjQueryの理だといったよｗ
マッピポンプしてるんじゃねーよ
902デフォルトの名無しさん (ﾜｯﾁｮｲ a701-chNm)
垢版 |
2019/03/09(土) 12:24:59.58ID:e9DsS9n/0
>>891
うわあ。。性格ネジ曲がりすぎだろ。すっごく君のためを考えて言ったんだがなあ。
俺が書いてもvueを何も知らない君がどう評価するの？まさか文字数カウントして終わりか？

君の言ってるのはこういう事。
vueしりませーん、よめませーん。かきませーん。おぼえませーん。でもvueクソだわ！！
通用するわけねーだろ。どあほう。
2019/03/09(土) 12:26:05.91ID:RYW8IiyE0
>>902
評価してやるからグダグダ言ってないでかけや
2019/03/09(土) 12:28:51.73ID:OAlfgW/Ia
>>895
完全に依存性がなくなったわけではありませんがべったり依存していません

Vue(MVVM)ではViewは明確に定義されたViewModelのインターフェースのみに依存します
ViewModelの実装からは完全に隔離されます
ViewModelのインターフェースがViewとViewModelの疎結合を保証する境界になっています

逆にjQueryではjs側がどのような実装を行っているか厳密に理解していなければViewを定義できません
そ
ViewとLogicを隔てる境界はありません
905デフォルトの名無しさん (ﾜｯﾁｮｲ a701-chNm)
垢版 |
2019/03/09(土) 12:31:29.70ID:e9DsS9n/0
>>897
いいから無理にvueやreactの知識だすなってｗ。ボロでてるから。
コード埋め込みじゃなくてバインディング。
どうせ何が違うのか分からんだろ？いいから勉強してくれ。
906デフォルトの名無しさん (ﾜｯﾁｮｲ a701-chNm)
垢版 |
2019/03/09(土) 12:33:31.50ID:e9DsS9n/0
>>903
書けやじゃねーよｗ
俺は答えた。それについて文句があるならまず自分でやるのが当たり前じゃん。
君は社会人じゃないのかね？俺は君のお守りしてるわけじゃないぞ？
2019/03/09(土) 12:36:22.72ID:flOfKdeWM
>>900
それのどこがコンポーネントなんだよ
「この動き」と言った瞬間同じDOM構造が思い浮かんで初めて成立する会話
てかこの動きってなに？長々と説明する位ならコード見せた方が早いよね
2019/03/09(土) 12:38:01.89ID:OAlfgW/Ia
>>901
Vueでコンポーネントを実装するとhtml/cssとjsが1箇所に記述されるため強い結合が生じるというのがあなたの最初の主張です
ここには暗黙的に1つの前提がありました
html/cssを別のファイルに定義しないという前提です

しかしあなたは続く投稿でその前提を自ら覆しました
あなたはtemplate tagを提示してhtml/cssを別のファイルに記述する手段があるならしてもよいとしてしまいました
前提が崩れたためあなたの最初の主張の理もまた失われたのです
2019/03/09(土) 12:38:30.60ID:izNw5U5za
>>904
お前ももうそいつを説得しようとかバカなマネするのやめろ
論破と謂われようが勝利宣言されようが我慢しろ
無駄だし邪魔
910デフォルトの名無しさん (ﾜｯﾁｮｲ a701-chNm)
垢版 |
2019/03/09(土) 12:44:02.36ID:e9DsS9n/0
>>900
あーそうだ、jQuery君に肝心な事聞き忘れてた。
君がmy-componentをコンポーネントと言うなら答えられるはず。
1、そのコンポーネントのインターフェイスは？
2、再利用は？
3、内部をどう隠蔽して部品化する？
これコンポーネントの最低条件だから。本当はもっとある。
一つでも満たさない場合少なくとも仕事でコンポーネントと言ってはだめよ。
まあ保守するのが君一人ならオレオレコンポーネントでもいいんだけど。
911デフォルトの名無しさん (ﾜｯﾁｮｲ a701-chNm)
垢版 |
2019/03/09(土) 13:16:35.03ID:e9DsS9n/0
>>897
>DOMのクラスやセレクタを使わないでやるなら
>HTMLに直接React用のコードを埋め込むしか無いやんｗ

やっぱりここにjQuery君の根本的な勘違いがあるな。
jQueryってのは基本密結合なんだよ。密結合ってのは、相手を明確に知ってないといけないという事。端的に言えばセレクタが元凶。密結合が好ましくないってことは知ってるよね。

んでさ、また君の不得意なvueですまんけどさ、疎結合ってのはこういう事。
<div v-show="isShow"><div>
script側は変数isShowを切り替えるのみ。
違い分かるかな？スクリプト側からはdomを知らない＆触れてない事。

メリットがとてつもなく大きな事も分かってるはず。いや分かれ。だったらデザイナに教えるなり、君が骨組み作ればいいだけ。。。いやそれができればこんな話になってないかああ。スレも残り少ないのに不毛だぜ。。
2019/03/09(土) 13:25:46.15ID:GVs3bbIF0
コンポーネントは、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');
2019/03/09(土) 13:28:20.83ID:RYW8IiyE0
まだVue側のコードは出てないのか
2019/03/09(土) 14:01:33.87ID:JGH8xftfM
コンポーネントを理解できてないってことだよな
915デフォルトの名無しさん (ｵｯﾍﾟｹ Src7-EzoF)
垢版 |
2019/03/09(土) 14:19:02.54ID:47IMMy0/r
デザイナー兼プログラマーの俺様なら全て解決する問題だな
jquery使うのはWordPressのみ
Webアプリ系はvueかReactで作る

てかデザイナーとフロント分けたほうが効率いいとかいう輩どもはこれでわかったんじゃねえの
まったく解決できてねえじゃん
むしろ悪化してる
916デフォルトの名無しさん (ﾜｯﾁｮｲ a701-chNm)
垢版 |
2019/03/09(土) 14:22:14.84ID:e9DsS9n/0
>>913
この機会にvue react覚えればいいのに。
5chの不毛な論争でもそういう気持ちが芽生えれてくれれば無駄じゃない。100%君のプラスになる話だよ。俺は1円も得しないマジでｗ
2019/03/09(土) 14:22:18.32ID:RYW8IiyE0
>>915
あれほどVueは密結合になってないといいはっていながら、
最後は密結合にしたほうがいいっていうんだから面白いよなｗ
2019/03/09(土) 14:22:58.79ID:RYW8IiyE0
>>916
すでにVueもReactもマスターした上で言ってんだよｗ
VueもReactも密結合になるだけでメンテナンスしづらくなり
コードの量も増えるって。
919デフォルトの名無しさん (ﾜｯﾁｮｲ a701-chNm)
垢版 |
2019/03/09(土) 14:35:46.09ID:e9DsS9n/0
>>918
ほう昨日はnew Vue()すら知らなかった君が、たった一日でマスターしたのか。しかもreactも。って冗談でも笑えねえぞこら。

あとまあ、、一応聞いとくか、、
> VueもReactも密結合になるだけでメンテナンスしづらくなり
どのへんが密結合なんでしょうvue reactマスターさん？
まだまだ私も勉強中なので参考までに教えてください。
まずは密結合の意味からお願いします。
2019/03/09(土) 14:37:44.00ID:RYW8IiyE0
>>919
見た目（デザイン）を変更しようと思った時にJavaScriptのコードを
変更しなければいけないのが密結合です。
2019/03/09(土) 14:39:02.01ID:RYW8IiyE0
もう少しわかりやすく言えば、

見た目（デザイン）を変更しようと思った時に、JavaScriptを全く知らない人に
担当させられないのが密結合の証拠です。
2019/03/09(土) 14:46:41.07ID:aSIxwjYia
コンポーネントぶち殺すマン
2019/03/09(土) 14:50:50.25ID:RYW8IiyE0
>>922
コンポーネントと見た目（デザイン）は別の概念です。

VueやReactを使うとコンポーネントに見た目（デザイン）が蜜に結合してしまって
再利用しづらいコンポーネントになってしまうと自白しているようなもんですね。

同じコンポーネントでも見た目（デザイン）は別のものに変更できるようになってないと
いけません。テーマとかスキンという言葉を使えば理解できますか？
2019/03/09(土) 14:55:21.16ID:izNw5U5za
正直行数が少ない方が正義って思う人はjQuery使ってていいんじゃないかと思うよ
2019/03/09(土) 14:57:22.21ID:RYW8IiyE0
行数よりも、HTMLとCSSとJavaScriptが
明確に分離できてるのがjQueryの強みですけどね
2019/03/09(土) 15:16:00.82ID:RYW8IiyE0
というかVueの方が行数が長くなると認めたレスなのかｗ
2019/03/09(土) 15:19:43.98ID:/2BHRI8Ma
動的にタグの数が変わるようなものはjqueryでどう書くのでしょうか？
928デフォルトの名無しさん (ｵｯﾍﾟｹ Src7-EzoF)
垢版 |
2019/03/09(土) 15:22:05.65ID:47IMMy0/r
ほんとエンジニアって使えねえなあ
行数ごときで争ってるバカどもw

WebアプリなんだからUIUXもシステムで作るんだから右脳左脳両方使って効率よく作り出せよ

デザインセンスゼロだから行数で言い合うしかねえんだろ
お絵描き教室からはじめろ
2019/03/09(土) 15:25:37.25ID:flOfKdeWM
>>723の「こんな程度」のUIをJS
知らないデザイナーと>>900みたいな会話で分業して作ってるんなら
色んな意味で尊敬するわ
俺なんて地獄しか見えないもん
2019/03/09(土) 15:33:47.36ID:/2BHRI8Ma
動的にタグの数が変わるものはjqueryでどう書くのでしょうか？
タグをjsに書いたりしないですよね
2019/03/09(土) 15:44:26.89ID:RYW8IiyE0
> タグをjsに書いたりしないですよね
当たり前だろ。そんな事したらJavaScriptの中に
タグが埋め込まれてしまってデザインが用意に変更しづらくなるだろ
2019/03/09(土) 15:48:30.46ID:/2BHRI8Ma
>>931
それは知っていますよ。どう書くのでしょうか？
933デフォルトの名無しさん (ﾜｯﾁｮｲ a701-chNm)
垢版 |
2019/03/09(土) 15:55:06.21ID:e9DsS9n/0
>>919
まあ予想してたと思うけど、、ちょっと長いよ。２つに分ける。

>見た目（デザイン）を変更しようと思った時にJavaScriptのコードを変更しなければいけないのが密結合です。

違います。
Javascriptのコードと言うからややこしくなるんです。データ駆動という言葉を知っていますか？
例えばform。form全体の状態を保持するjsonAがあるとしましょう。この場合、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業界ではそうです。
それにしてもコンポーネントといい、君は本当に勝手な解釈をしますね。もっと勉強しましょう。
934デフォルトの名無しさん (ﾜｯﾁｮｲ a701-chNm)
垢版 |
2019/03/09(土) 15:55:34.80ID:e9DsS9n/0
>>919
> 見た目（デザイン）を変更しようと思った時に、JavaScriptを全く知らない人に担当させられないのが密結合の証拠です。

もちろん違います。
name="checkbox"がv-model="checkbox"になるだけです。スクリプトの要素はありません。
テキストのバインディグも {{name}} とするだけです。スクリプトの要素はありません。他にもありますが、デザイナが新たに覚える文法は多くないです。
デザイナの教育、指示はむしろエンジニアの腕の見せ所ですよ。負担となるかは大部分が君次第。フレームワークだけのせいにしないように。

詳しくはvue公式を読みましょう。とてもわかり易くておすすめです。


>>923
ところで、君はコンポーネントの質問に答えてないですよね？
君の示したコンポーネント、<div class="my-component">のインターフェイス、再利用、隠蔽について答えてください。
言ってる意味さえ分からないかもしれませんが。。それなら質問しましょうね。
2019/03/09(土) 15:57:33.29ID:RYW8IiyE0
>>932
https://jsfiddle.net/v34njaes/
2019/03/09(土) 15:58:48.05ID:RYW8IiyE0
>>933
見当違いすぎてワロタｗ

HTML/CSSの世界に、Reactのものが含まれてるから
密結合だって言ってんだろ
937デフォルトの名無しさん (ﾜｯﾁｮｲ a701-chNm)
垢版 |
2019/03/09(土) 16:02:36.25ID:e9DsS9n/0
>>936
>HTML/CSSの世界に、Reactのものが含まれてるから、密結合だって言ってんだろ。

だからそれは密結合じゃないの。君の変な定義はどうでもよろしい。
相変わらず間違いを認めないヤツだなあ。。ググってみなよ。すぐ分かる事からさ。
2019/03/09(土) 16:03:36.34ID:RYW8IiyE0
>>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のコードは状態を持ってないので
隠蔽するものはなにもない。無名関数使ってるので関数名すら隠蔽された状態だし
単にクラス名がかぶらないようにしたいってだけならプリフィックスでもつければおしまい
2019/03/09(土) 16:04:07.64ID:RYW8IiyE0
>>937
ぐぐったけど、間違いないですねｗ
940デフォルトの名無しさん (ﾜｯﾁｮｲ a701-chNm)
垢版 |
2019/03/09(土) 16:05:45.02ID:e9DsS9n/0
>>936
んでさ、vue reactマスターの君はコンポーネントが全くわかってない。何も質問に何も答えられない。どうなのよマスターさん。
いろんな意味で恥ずかしいと思わんの？よくそんな妙な知識で仕事できるなあ。
同僚とか上司とかいたら注意されない？まあいれば、だけどさ。
941デフォルトの名無しさん (ﾜｯﾁｮｲ a701-chNm)
垢版 |
2019/03/09(土) 16:06:58.43ID:e9DsS9n/0
>>939
はい、ソースだしなさいねー。嘘ついてもすぐわかりますよー。
2019/03/09(土) 16:08:25.60ID:RYW8IiyE0
どうやら>>938には反論できないから
レスするのすっ飛ばしたようだなｗ
943デフォルトの名無しさん (ﾜｯﾁｮｲ a701-chNm)
垢版 |
2019/03/09(土) 16:14:51.37ID:e9DsS9n/0
>>938
やっと書いたか。本当に待ちくたびれたわい。

>インターフェース？ 何が聞きたいのかわからんが、
どあほ。。。まじで言ってる？？コンポーネントのインターフェイスが分からん？
よく堂々と白状できるな。。俺なら到底言えないわ。

あとさ、君のコードは再利用できてない。
それは単に、コ　ピ　ペ　と言うの。

>何から何を隠蔽するしたいのかわからん。jQueryのコードは状態を持ってないので隠蔽するものはなにもない
もう、、、、なにを言っていいのやら。
あのね、例えばさ、外部からさ、直接 $("div.my-component input")とか、コンポーネント内部にダイレクトにアクセスできちゃ駄目なのよ。

これってコンポーネントの最低条件なんだけど、、君はどうやって勉強したんだ。
いいからこれもググってみなよ。。。うーん、だれか突っ込んであげてください。私はもう疲れました。
2019/03/09(土) 16:16:33.74ID:RYW8IiyE0
>>943
> どあほ。。。まじで言ってる？？コンポーネントのインターフェイスが分からん？

じゃあ、VueからReactのコンポーネントのインターフェース書いてみろよｗ
2019/03/09(土) 16:17:00.95ID:RYW8IiyE0
>>943
> あのね、例えばさ、外部からさ、直接 $("div.my-component input")とか、コンポーネント内部にダイレクトにアクセスできちゃ駄目なのよ。

VueやReactでもダイレクトにアクセスできますが？
946デフォルトの名無しさん (ﾜｯﾁｮｲ a701-chNm)
垢版 |
2019/03/09(土) 16:19:28.37ID:e9DsS9n/0
>>945
おいおいおいおいー、どこがvueマスターなの？
直接アクセスできません。インターフェイスを介してアクセスします。
わかった？OK?
2019/03/09(土) 16:21:26.12ID:RYW8IiyE0
はい、Vueでコンポーネント内部にダイレクトにアクセスできちゃいましたｗ

https://codepen.io/anon/pen/ywXVOW
2019/03/09(土) 16:24:13.68ID:RYW8IiyE0
確か上の方で、scopedを使えば、こういうCSSからコンポーネントを
守ることができる。コンポーネントは影響を受けないってのたまわっていたね？
やってみて

div { //CSS ダイレクトアクセス
background-color: red;
}
2019/03/09(土) 16:26:40.96ID:zxiwPMOw0
さすがに呆れたというかコメントできない…
950デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/09(土) 16:27:02.65ID:e9DsS9n/0
>>947
笑いが止まらんぞおいっっっw
今日一番だわ！！！
本当に君には驚かされるな！！！
どこまで発想がjQueryなのよ。そりゃvueと共存できるよ。注意すればね。
いやすまん、ニヤニヤが止まらんから後でちゃんと返事する。
2019/03/09(土) 16:33:17.69ID:RYW8IiyE0
結局Vueのコンポーネントは隠蔽化されてるとか言うのは
技術的にそうなってるんじゃなくて、単にフレームワークの決まりとして
外部から触らないようにしましょうと文書で書かれているだけ

それを言ったら、jQueryでは情報のやり取りには
（カスタム）イベントを使用しましょう。コンポーネントの担当者以外が
直接内部をいじってはいけません。と文書でかけば終わるわけだよ。
2019/03/09(土) 16:42:10.68ID:RYW8IiyE0
少し訂正

それを言ったら、jQueryでは "コンポーネント間" の情報のやり取りには
（カスタム）イベントを使用しましょう。コンポーネントの担当者以外が
2019/03/09(土) 17:55:48.33ID:GVs3bbIF0
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通りの中から、適用される組み合わせを探すのに、時間が掛かりすぎるため破たんした！
954デフォルトの名無しさん (ﾜｯﾁｮｲ a701-chNm)
垢版 |
2019/03/09(土) 17:57:51.41ID:e9DsS9n/0
>>952
いやすまん、ちょっと笑いすぎた。失礼しました。
ってー君もめげないなあ。。。その不屈の精神があればvue reactなんてすぐ習得できると思うぞ本当に。

>結局Vueのコンポーネントは隠蔽化されてるとか言うのは技術的にそうなってるんじゃなくて、単にフレームワークの決まりとして外部から触らないようにしましょうと文書で書かれているだけ
文章で書かれてるだけｗｗ、全然ちがうし、大体そんな事書かれてないし！
vueはフレームワークなの。jQueryと違うの。vue使ってる限りはきちんとコンポーネント化できてるよ。もし直接アクセスできたらバグだよ。

>それを言ったら、jQueryでは "コンポーネント間" の情報のやり取りには（カスタム）イベントを使用しましょう。 コンポーネントの担当者以外が直接内部をいじってはいけません。と文書でかけば終わるわけだよ。
はい気をつけまーす。でも人間は間違えるし忘れるよねぇ。うっかりアクセスする事も十分あり得るよね。
ただうっかりdocument.getElementsByClassNameなんて発行しないよなあ。そもそもdocument自体使わんし。どんなミスだそれ。

認めようよ。君のコンポーネントは不十分というか君の理解不足とスキル不足だよ。そしてvueは基準を満たす。
流石にこれは擁護できんし見逃せんわ。認めるまで議論は進まない。まあどうせスレも終わるし最後にありがとう、面白かった。
2019/03/09(土) 18:00:05.54ID:RYW8IiyE0
>>953
> 従来のやり方では、3つのHTMLファイル・4つのCSSファイル・5つのJSファイルがあれば、
> 3 * 4 * 5 = 60通りの中から、適用される組み合わせを探すのに、時間が掛かりすぎるため破たんした！

とりあえずお前はブラウザの開発者ツールを使えるようになろう。
あとはgrepも便利だぞ

そしたら今度はコンポーネントごとにグループ分けしてディレクトリ管理して
webpackやsassも使えるようになろう
2019/03/09(土) 18:00:22.08ID:RYW8IiyE0
> ってー君もめげないなあ。。。その不屈の精神があればvue reactなんてすぐ習得できると思うぞ本当に。

だから習得してるってｗ
2019/03/09(土) 18:00:41.76ID:RYW8IiyE0
> vueはフレームワークなの。jQueryと違うの。vue使ってる限りはきちんとコンポーネント化できてるよ。もし直接アクセスできたらバグだよ。

はい、Vueでコンポーネント内部にダイレクトにアクセスできちゃいましたｗ

https://codepen.io/anon/pen/ywXVOW
2019/03/09(土) 18:01:53.35ID:RYW8IiyE0
>>953
> 各コンポーネントには、ユニークな属性が付いているため、お互いに影響を与えることはない(Scoped CSS)

だからユニークな属性をつければいいと思いますよ？
2019/03/09(土) 18:05:06.61ID:GVs3bbIF0
従来のやり方では、3つのHTMLファイル・4つのCSSファイル・5つのJSファイルがあれば、
3 * 4 * 5 = 60通りの中から、適用される組み合わせを探すのに、時間が掛かりすぎるため破たんした！

これが密結合！

どこかを修正すると、別のどこかがおかしくなるため、無限に修正を繰り返すことになる！

今までの日本車のすり合わせ技術と同じ。
どこかを修正すると、別のどこかがおかしくなるため、外人よりも日本人に有利だった

これを部品ごとに疎結合にすることで、ある部品の修正が、他の部品に影響を与えないため、
すり合わせ技術がなくなり、外人でも同じ車が作れるようになった

すり合わせがあると、単独で部品が作れない・単独で働けないから、
常に全員が相談・残業して働く、日本人が有利だった
960デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/09(土) 18:09:10.56ID:e9DsS9n/0
>>957
もういい。休んでいいんだ。十分スレを楽ませてもらった。
君がいいと言うならいい。常識破りのまま、そのまま突っ走ってくれ。
2019/03/09(土) 18:10:12.37ID:RYW8IiyE0
次スレ立てました


Vue vs React vs Angular その2
https://mevius.5ch.net/test/read.cgi/tech/1552122580/
2019/03/09(土) 18:17:05.53ID:GVs3bbIF0
すり合わせは、金メダルのスピードスケート女子パシュートもそう。
常に全員が相談・残業して練習する、日本人が有利

外人は思想・人種・性格もバラバラで、長時間一緒に居れない

しかも草食動物の日本人とは違い、外人は肉食動物で自己主張が強いから、
異なる思想・人種・性格の奴とは、殴り合いのケンカになる！

外人は、日本人みたいに従順で、すぐに従ったりしないから
2019/03/09(土) 18:26:31.50ID:GVs3bbIF0
>>958
>だからユニークな属性をつければいいと思いますよ？
従来のやり方では、無理

属性を付けても、それを訂正してはずす時には、
また、3 * 4 * 5 = 60通りの中から、正しいかどうかを確かめないといけないから、時間が掛かりすぎる

密結合・すり合わせは、どこかを修正すると、別のどこかがおかしくなるため、
無限に修正を繰り返すことになる

だから、部品やプログラミングは、疎結合でないとダメ！
2019/03/09(土) 18:32:31.91ID:RYW8IiyE0
>>963
その計算になんの根拠もねーわｗ

コンポーネント毎にCSS定義してるから
何を探すと言ってるのかさっぱりわからない。

.my-compnent {
　[name="switch"] { }
　sonota-1 { }
　sonota-2 { }
}

JavaScriptファイルも my-compnent に関するものは
my-compnent.js に全部収められているし、

あ、なるほど、jQueryがだめと言ってる根拠は
自分がまともな管理できてないからだってことかｗ
2019/03/09(土) 18:35:08.58ID:GVs3bbIF0
従来のやり方では、3つのHTMLファイル・4つのCSSファイル・5つのJSファイルがあれば、
3 * 4 * 5 = 60通りの中から、適用される組み合わせを探すのに、時間が掛かりすぎるため破たんした！

さらに、これの悪い所は、3 + 4 + 5 = 12 の足し算じゃなく、掛け算になるのが最悪！
考えることが加速度的に増える

ここを修正したら、別の場所がおかしくなりましたとか、こればっかりやってる。
延々と、適用される組み合わせを探してる！
2019/03/09(土) 18:36:52.78ID:RYW8IiyE0
根拠言えないから、必死に嘘を言いまくるのねｗ
どっかの国の人と行動がおなじになってるよｗ
2019/03/09(土) 18:46:21.76ID:GVs3bbIF0
自分で属性を付けても、またそれを修正したり、訂正してはずす時には、
また、3 * 4 * 5 = 60通りの中から、正しいかどうかを確かめないといけないから、時間が掛かりすぎる

だから、各コンポーネントを別々のファイルに書くだけで、
ユニークな属性を自動的に付けてくれる、フレームワークが良い
2019/03/09(土) 18:51:07.24ID:pp+gnfPcM
>>961
荒らし行為
問答無用で出て行け
969デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/09(土) 18:55:36.80ID:e9DsS9n/0
>>961
そんなに悔しかったの？次スレってwほんと滲み出てるw
まあ頑張れよ自称vueマスターさんw。ほらテンプレに書かなきゃ。vueでdocument直接いじっちゃダメよー。逸材。
970デフォルトの名無しさん (ｻｻｸｯﾃﾛ Spc7-tTzy)
垢版 |
2019/03/09(土) 18:56:19.05ID:jSVYUNoJp
jQueryおじさんネトウヨだったのかw
年齢も高そうだしな...
971デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/09(土) 19:30:08.07ID:e9DsS9n/0
jQuery君なあ。。ここまでの逸材なら色々拗らせた年齢不詳の40代かなあ。
つーか、ここまで vue react嫌うって何があったんだろ。そのくせ自称vue reactマスターなんだぜw。何その劣等感。しかもマスターならvueでもdom直接いじれるんだぜ。それでコンポーネントの垣根も超えられるって自慢するんだぜ。でも文書化で禁止すればokなんだぜ。
これで納得できるのが本当凄え。
2019/03/09(土) 19:42:14.57ID:fCQTKW9ua
jQueryおじさん、スレチなんで次スレは来ないでね
2019/03/09(土) 19:46:22.67ID:C6v7oEvsM
>>961
これ通報じゃね？
2019/03/09(土) 19:52:05.13ID:izNw5U5za
ReactはReactNativeとセットにして一スレ立ててもいいんじゃない？
975デフォルトの名無しさん (ｵｯﾍﾟｹ Src7-EzoF)
垢版 |
2019/03/09(土) 20:20:05.00ID:47IMMy0/r
密結合だろうが疎結合だろうが俺の場合は右脳と左脳が同時に判断すらから何も問題がない
本当のフルスタックとはそういうものだ

しかし左脳しか機能していないお前らは、理解不能で恐ろしい存在であるデザインのためにくだらない争いをしているわけだ

レベルが低すぎてアプリ開発なんか無理だろ
2019/03/09(土) 20:20:35.21ID:GVs3bbIF0
テンプレを勝手に改変する、いつもの荒らしだろ

テンプレに、Ruby 禁止とか、jQuery・Lodash 禁止とか、
自分がわからない技術を禁止して、色々なスレを立てている奴

あちこちに、死ねとか書き込んでいる奴だろ
977デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/09(土) 20:36:11.59ID:e9DsS9n/0
jQuery君は最後っ屁していったのか。次から色々スルーするわ。
2019/03/09(土) 20:37:03.42ID:OAlfgW/Ia
>>975
疎結合のほうが理解しやすいことは確かですが理解のしやすさためだけに疎結合を目指すわけではありません
疎結合なシステムは個々のモジュールを独立にメンテナンス可能であるという点が最も重要なのです
2019/03/09(土) 20:53:08.50ID:RYW8IiyE0
例えば、HTML、CSS、JavaScript。
個々のモジュールが独立してメンテナンス可能であるということです。
2019/03/09(土) 20:59:34.50ID:RYW8IiyE0
例えばデザインですが、同じ機能を持ったコンポーネントでも
別のアプリだと違うデザインにしますよね？
そういった時にデザインのみ独立してメンテナンスします。
2019/03/09(土) 21:01:14.05ID:RYW8IiyE0
見た目をちょっと変えるだけで、別のコンポーネントとして
管理するのは馬鹿げているわけです。
2019/03/09(土) 21:07:26.91ID:izNw5U5za
渡すpropsで切り替えればいいんじゃない？
2019/03/09(土) 21:08:16.18ID:RYW8IiyE0
時代はこの先Web Componentsの時代になり、
高度なコンポーネントが増えますが、
再利用可能であるということは、別のデザインを持ったサイトでも
使えるコンポーネントでなければなりません。

機能はコンポーネントに閉じてよいですが、
デザインはコンポーネントに閉じてはだめなのです。
デザインはサイト全体で横断的に適用するものなのですから
2019/03/09(土) 21:09:18.57ID:Uscl0PAlM
荒らしは出て行け
2019/03/09(土) 21:10:57.82ID:izNw5U5za
>>975
React専用スレ立ててよ
2019/03/09(土) 21:11:12.56ID:RYW8IiyE0
>>985
了解
987デフォルトの名無しさん (ｵｯﾍﾟｹ Src7-EzoF)
垢版 |
2019/03/09(土) 21:14:19.58ID:47IMMy0/r
>>978
そういうこと言ってんじゃねえよ
2019/03/09(土) 21:16:41.18ID:izNw5U5za
>>925
どうせならここじゃなくてQiitaで「jQueryの方がVueよりも優れてる理由」とかいう記事かけば誰かがお望みの回答をしてくれるんじゃないかと思うんだけどね
989デフォルトの名無しさん (ﾜｯﾁｮｲ a701-/bUt)
垢版 |
2019/03/09(土) 21:20:38.74ID:jx9iLAiD0
> Javascript はweb制作管理板、CGI はWEBプログラミング板へ。
2019/03/09(土) 21:22:22.46ID:izNw5U5za
>>989
正直過疎板立てても仕方ないよ経験上
2019/03/09(土) 21:23:34.06ID:nmSMFs2da
Qiitaとかスレチとか、お前ら、jQueryおじさんが周りの言うこと聞くわけないだろ
エホバみたいなもんやぞ
2019/03/09(土) 21:30:52.53ID:AJ6jPa0v0
>>985
立てたぞ。>>974がセットにしてって言ってたからセットにした

React と React Native のスレ
https://mevius.5ch.net/test/read.cgi/tech/1552134567/
2019/03/09(土) 21:49:36.92ID:7ubvtRZR0
>>988
書くならもっと別物にするな
メンテナンスしやすいコーディングスタイルとか

jQueryがだめに見られてるのは、DOM要素を追加したり消したりすることであって
クラス属性を書き換えるなどして、DOM要素にかんしてはCSSで制御するようにすれば
メンテナンス性が高いことは明らかだからね
994デフォルトの名無しさん (ｵｯﾍﾟｹ Src7-EzoF)
垢版 |
2019/03/09(土) 22:03:28.92ID:47IMMy0/r
Vue vs React vs Angular Part.2
http://mevius.5ch.net/test/read.cgi/tech/1552136553/

本スレPart2建てた
こっちはjQueryの話禁止にした
2019/03/09(土) 22:05:43.66ID:KVQbeC9/0
>>994
乙
996デフォルトの名無しさん (ﾜｯﾁｮｲ a701-w6xA)
垢版 |
2019/03/10(日) 09:10:34.18ID:q7odbdCi0
jQueryは悪くない。ただスレチ。
次スレが有意義でありますように。
2019/03/10(日) 09:50:49.25ID:5/+zyaBC0
>>976
死ね
2019/03/10(日) 10:51:49.09ID:KLmR+9gsM
結局主張のごり押しなだけで時間とスレの無駄だったな
2019/03/10(日) 10:55:35.81ID:9XIrDo2La
5chではいつもの光景
2019/03/10(日) 10:59:45.81ID:5/+zyaBC0
次スレ
Vue vs React vs Angular Part.2
http://mevius.5ch.net/test/read.cgi/tech/1552136553/
10011001
垢版 |
Over 1000Thread
このスレッドは１０００を超えました。
新しいスレッドを立ててください。
life time: 78日 13時間 22分 9秒
10021002
垢版 |
Over 1000Thread
5ちゃんねるの運営はプレミアム会員の皆さまに支えられています。
運営にご協力お願いいたします。


───────────────────
《プレミアム会員の主な特典》
★ 5ちゃんねる専用ブラウザからの広告除去
★ 5ちゃんねるの過去ログを取得
★ 書き込み規制の緩和
───────────────────

会員登録には個人情報は一切必要ありません。
月300円から匿名でご購入いただけます。

▼ プレミアム会員登録はこちら ▼
https://premium.5ch.net/

▼ 浪人ログインはこちら ▼
https://login.5ch.net/login.php
レス数が1000を超えています。これ以上書き込みはできません。
5ちゃんねるの広告が気に入らない場合は、こちらをクリックしてください。
ニューススポーツなんでも実況