Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
jQuery使いがVue.jsを使った話 / thank you jQuery,Hello V...
Search
Endo_Hizumi
December 11, 2019
Technology
0
170
jQuery使いがVue.jsを使った話 / thank you jQuery,Hello Vue.js
Endo_Hizumi
December 11, 2019
Tweet
Share
More Decks by Endo_Hizumi
See All by Endo_Hizumi
JSでギャルゲーをつくろう!(第3版)
endohizumi
0
33
JSでギャルゲーをつくろう!(第2版)
endohizumi
0
52
JSでギャルゲーをつくろう!
endohizumi
0
280
テレビを飲み込め! Webの嵐!! / Swallow the TV! Web storm! !!
endohizumi
1
86
OK:Googleから始めるスマートホーム生活 / OK: Smart home life starting from Google
endohizumi
0
300
クソアプリで基礎固め / Tutorial in your joke app for Vue.js
endohizumi
0
200
スマホで始めるウェブアプリ開発 / let's start web application development with a Android Device
endohizumi
1
900
キレない関数の作り方 / How to make bat function no anger
endohizumi
0
140
SwaggerでSSLCを 置き換える / Replacing SSLC with Swagger
endohizumi
0
83
Other Decks in Technology
See All in Technology
Fabric + Databricks 2025.6 の最新情報ピックアップ
ryomaru0825
1
150
Yamla: Rustでつくるリアルタイム性を追求した機械学習基盤 / Yamla: A Rust-Based Machine Learning Platform Pursuing Real-Time Capabilities
lycorptech_jp
PRO
4
150
本が全く読めなかった過去の自分へ
genshun9
0
640
GeminiとNotebookLMによる金融実務の業務革新
abenben
0
240
変化する開発、進化する体系時代に適応するソフトウェアエンジニアの知識と考え方(JaSST'25 Kansai)
mizunori
1
240
WordPressから ヘッドレスCMSへ! Storyblokへの移行プロセス
nyata
0
200
Github Copilot エージェントモードで試してみた
ochtum
0
110
Amazon Bedrockで実現する 新たな学習体験
kzkmaeda
2
620
Node-REDのFunctionノードでMCPサーバーの実装を試してみた / Node-RED × MCP 勉強会 vol.1
you
PRO
0
120
Delegating the chores of authenticating users to Keycloak
ahus1
0
130
OpenHands🤲にContributeしてみた
kotauchisunsun
1
480
LangSmith×Webhook連携で実現するプロンプトドリブンCI/CD
sergicalsix
1
120
Featured
See All Featured
Making the Leap to Tech Lead
cromwellryan
134
9.4k
Statistics for Hackers
jakevdp
799
220k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
17
950
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
Building Applications with DynamoDB
mza
95
6.5k
Site-Speed That Sticks
csswizardry
10
670
Mobile First: as difficult as doing things right
swwweet
223
9.7k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
32
2.3k
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.8k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
3.9k
Practical Orchestrator
shlominoach
188
11k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
Transcript
jQuery使いがVue.js を使った話 2019/12/11 Yumemi.vue #4 遠藤ヒズミ
合同誌頒布のお知らせ 親方Projectさんより新刊合同誌『ワンストッ プアプリ開発(α版)』が出ます スマホで始めるWebアプリ開発で 寄稿しました! アプリに関する様々なノウハウが詰まった一 冊です!
合同誌頒布のお知らせ イベント名:第2回 技術同人誌博覧会 日時:2019.12.14 (Sat.) 11:00~17:00 場所:プラザマーム(日本橋浜町) サークル:【2F-あ06】親方Project
改訂版アプリ本 執筆者募集! ワンストップアプリ本 β版に寄稿してくれる 人募集中! アプリに関するものならなんでもおk 数行のコラムから参加おkです!
Boothお試し版 配布してます
自己紹介 名前:菊地 峻輔 HN:遠藤ヒズミ (@endo_hizumi) 所属:ジャスミンシステム 業務:都内某所でPython書いてるサーバーサイドPG 趣味:Webアプリ開発・変態ガジェット集め・プラモデル製作 Vue歴:趣味で3ヶ月くらい? Webサイト:https://hizumi.dev
7 今、やってること GameClient GameServer JinroDB JinroResponcer.php Broadcast.php member activity_logs triggerで 書き込む
発言・投票などの行動 書き込み レコード 取得 JSONで送信 7 今、開発している人狼のWebアプリの仕組みがこうなって います。
jQueryの良かったところ • DOMの取得が短くかけた ◦ document.getElementById('hoge')を$(‘hoge’)で書ける
jQueryの良かったところ • $.ajaxで、簡単に非同期通信が行えた ◦ $.getや$.postの略記があって、ワンライナーで、かけた ◦ $.ajaxで、成否の判定がコールバックで、かけた
jQueryの良かったところ • アニメーション用のメソッドが豊富 ◦ フェードイン・フェードアウトや上からスライドして下に消えるな ど、動きのあるページが容易に作れた ◦ アニメーションが終わったときのコールバックも設定できる
jQueryの良くなかったところ • 複数のイベントトリガーの定義で簡単に汚くなる ◦ DOM一つにイベントを結びつけるから、複雑な処理は辛いこ とになる。 イベントトリガーのコールバックに直接処理を書く → 良くあるファットコントローラーに イベントトリガーだけで、実際の処理が数十行先
→ 読みづらく、把握しづらい。
jQueryの良くなかったところ • 複数の要素の描画に生のHTMLを書かないといけない 配列を操作するメソッドはある。 表示にはforで必死に回さないといけなくなる。
Vue.js の良かったところ • タグのようにコンポーネントを置ける
Vue.js の良かったところ • イベントの紐付けをタグに書くのでコードと要素の関連付けが理解 しやすい
Vue.js の良かったところ • 配列要素の描画が簡単
Vue.js の良かったところ • 配列要素の描画が簡単
Vue.jsいいな
これから使っていこう
おしまい