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
JavaScriptのイベントを体感しよう
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
256times
April 17, 2019
Programming
0
3k
JavaScriptのイベントを体感しよう
256times
April 17, 2019
Tweet
Share
More Decks by 256times
See All by 256times
256times 6週間の軌跡
256times
0
1.6k
256timesふりかえり
256times
0
1.6k
toraの256times
256times
0
1.5k
JS Lovers 愛はJavaScriptで掴め。
256times
0
3.1k
挫けてからはじまるアプリ開発
256times
0
3.3k
エラーで学ぶJavaScript
256times
1
3.2k
JavaScript初学者がスパルタ環境で頑張れた理由
256times
1
3k
今日も挑戦者ここで討たれり
256times
0
3k
Other Decks in Programming
See All in Programming
Smarter Angular mit Transformers.js & Prompt API
christianliebel
PRO
1
100
Java 21/25 Virtual Threads 소개
debop
0
300
今こそ押さえておきたい アマゾンウェブサービス(AWS)の データベースの基礎 おもクラ #6版
satoshi256kbyte
1
200
へんな働き方
yusukebe
6
2.9k
Nostalgia Meets Technology: Super Mario with TypeScript
manfredsteyer
PRO
0
110
Strategy for Finding a Problem for OSS: With Real Examples
kibitan
0
120
AI活用のコスパを最大化する方法
ochtum
0
340
AI時代の脳疲弊と向き合う ~言語学としてのPHP~
sakuraikotone
1
1.6k
テレメトリーシグナルが導くパフォーマンス最適化 / Performance Optimization Driven by Telemetry Signals
seike460
PRO
2
190
Xdebug と IDE による デバッグ実行の仕組みを見る / Exploring-How-Debugging-Works-with-Xdebug-and-an-IDE
shin1x1
0
230
Codex の「自走力」を高める
yorifuji
0
1.3k
Understanding Apache Lucene - More than just full-text search
spinscale
0
140
Featured
See All Featured
The Cost Of JavaScript in 2023
addyosmani
55
9.8k
End of SEO as We Know It (SMX Advanced Version)
ipullrank
3
4.1k
Designing for humans not robots
tammielis
254
26k
Digital Ethics as a Driver of Design Innovation
axbom
PRO
1
240
Applied NLP in the Age of Generative AI
inesmontani
PRO
4
2.2k
Money Talks: Using Revenue to Get Sh*t Done
nikkihalliwell
0
190
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
techseoconnect
PRO
0
130
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
kimpetersen
PRO
0
280
Building Applications with DynamoDB
mza
96
7k
The Impact of AI in SEO - AI Overviews June 2024 Edition
aleyda
5
780
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.6k
Public Speaking Without Barfing On Your Shoes - THAT 2023
reverentgeek
1
350
Transcript
256 times ZVLJ
ϓϩϑΟʔϧ • yukiʢ@sac_180822ʣ • WEB੍࡞ͷPMΛ4΄Ͳ͍ͬͯ·ͨ͠ɻݱࡏγεͰ͢ɻ • ϓϩάϥϛϯάܦݧ8ϲ݄Ͱ͢ɻ • ҭٳதʹͳʹ͔ҭࣇҎ֎ͷ͜ͱ͕Γͨ͘ͳͬͯϓϩάϥϛϯά Λ࢝ΊͯΈͨΒɺ໘നͯ͘໘ന͍ͯ͘༨ͬͯ256timesʹԠื͠
͍ͯ·ͨ͠ɻ
256 times ࢀՃલͷΘͨ͠ͱࠓͷΘͨ͠
256 times ࢀՃલɾɾɾ
υοτΠϯετʔϧ Progate Udemy Rails νϡʔτϦΞϧ νΣϦʔຊ ɾ ɾ ɾ ͱΓ͋͑ͣ༗໊ͳڭࡐΛ͍Ζ͍ΖͬͯΈͨ
͜͏͍͏ͷ࡞Γ͍ͨ ↓ άάΔ ↓ ͜ͷهࣄྑͦ͞͏ʂ ✖ ໌֬ͳཧ༝ͳ͍͚ͲͳΜ͔ྑͦ͞͏ ✖ ͳ͔ͥωοτʹܝࡌ͞Ε͍ͯΔίʔυશͯਖ਼ͩͱ৴͖͍ͬͯ͡Δ ✖
ͦͷίʔυ͕ݹ͍ॻ͖ํͰແବͳهड़͕ଟͯ͘ؾ͘ྗ͕ͳ͍ ↓ ΄΅ਅࣅͯ͠ॻ͘ ↓ ͜͜ͷίʔυͪΐͬͱΘ͔Βͳ͍͚Ͳಈ͍ͯΔ͔Β͍͔ͬ ↓ σβΠϯ͍ͬͯ͡ ↓ ͓ʔͰ͖ͨʂΘͨ͠࡞Εͨʂྗ͍͔ͭͨʂ
͜͏͍͏ͷΛ܁Γฦͯ͠ ྗ͕͍͍ͭͯΔͱࢥ͍ࠐΜͰ͍ͨ
256 times ͷ ాޱ͞ΜͱͷॳճϝϯλϦϯάͰɾɾɾ
ాޱ͞Μ ͡Ό͋·ͣϑΥʔϜ࡞ͬͯɺ Ϙλϯԡͨ͠Βೖྗ༰͕ग़Δͭ࡞ͬͯΈ·͠ΐ͏ Θͨ͠ ͍ʂ ాޱ͞Μ ςΩετೖྗͷ෦࡞͍ͬͯͩ͘͞ Θͨ͠ ʢϑΥʔϜɺϑΥʔϜɺͳΜͷλά͚ͩͬʁٽʣ ɾɾɾɾɾɾɾɾɾɾɾɾௐΕͰ͖·͢ɺͨͿΜ
ͳʹͰ͖ͳ͍ɾɾɾʂ
ాޱ͞Μ ʮௐͳ͍ͱͰ͖ͳ͍͜ͱɺ Ͱ͖Δͱݴ͑ͳ͍Ͱ͢Ͷʯ
ాޱ͞Μ ʮ͜Ε͘Β͍ͷ͜ͱ֮͑·͠ΐ͏ʯ
5ϲ݄ؒɺҰԠຖϓϩάϥϛϯάֶशΛ ͍ͯͨ͠ʢͭΓͩͬͨʣͷʹɺ ͳͥ<input>λά͢Βॻ͚ͳ͔ͬͨͷ͔ʁ
“֮͑Α͏”ͱ͍͏ҙࣝΛશ࣋ͨͣ͘ʹ औΓΜͰ͍ͨ
ʮϓϩάϥϛϯά֮͑ͳͯ͘ྑ͍ɺ άάΔྗ͕͋ΕOKʯ ͱ͍͏TwitterͰݟͨݴ༿Λͦͷ··ӏವΈʹ͍ͯͨ͠ ͦΜͳϫέͳ͔ͬͨʂ
Έཧղ͍ͯͯ͠ɺશવ͍֮͑ͯͳ͍ ↓ Կ͔Λݟͳ͍ͱԿॻ͚ͳ͍ਓʹͳ͍ͬͯͨ
ڭ܇̍ جຊతͳ͜ͱɺ֮͑ͨํ͕ྑ͍ʹܾ·ͬͯΔ ʢΑ͘ग़ͯ͘Δॻ͖ํͱ͔ϝιουͱ͔ʣ
ڭ܇̎ Α͔͘Βͳ͍··ௐ·ͬͯ͘ ͳΜ͔͍͢͝ͷΛ࡞ΔྗΑΓɺ ࣗྗͰجຊతͳͷΛ࡞ΔྗΛʹ͚ͭΔ
<input>λά͢Β ࣗྗͰॻ͚ͳ͔ͬͨΘͨ͠Ͱ͕͢ɺ 256times Λऴ͑ͨࠓɾɾɾ
ࣗͷ࡞Γ͍ͨͷΛ࣮͢ΔͨΊʹ Ͳ͏͍͏ίʔυΛॻ͚ྑ͍͔ ༧ଌͰ͖ΔΑ͏ʹͳͬͨʂ ͦͯͦ͠Ε͕͋Δఔಈ͘ͱ͜Ζ·Ͱ ࣗྗͰίʔυ͕ॻ͚ΔΑ͏ʹͳͬͨʂ
͋ͱɾɾɾ ՈిࣗಈԽγεςϜΛ͍ͬͯΔͱ ແҙࣝʹཪଆͷॲཧΛ૾͢ΔΑ͏ʹͳͬͨʂ ͨͱ͑ચ୕ػ ͜ͷϞʔυͰελʔτϘλϯԡ͢ͱɺ ͜͜·Ͱ͍ͭͱಉ͡ॲཧ͚ͩͲ ͜ͷλΠϛϯάͰ݅ذ͞Εͯɾɾɾ ͜Εాޱ͞Μ͕ݴ͍ͬͯͨ ʮݟ͑ͳ͍ઢ͕ݟ͑ΔΑ͏ʹͳΔ͜ͱʯ
JavaScriptͷΠϕϯτΛ ςʔϚʹͨ͠ΞϓϦ
ͦͦ’click’Πϕϯτ͔͠ ͬͨ͜ͱ͕ͳ͔ͬͨ
256times ͷجૅ࿅Ͱ’keyup’͕ొͯ͠ ’keydown’’keypress’ͷଘࡏΛΔ MDNΛݟͨΒଞʹͨ͘͞ΜΠϕϯτ͕ɾɾɾ
Α͘Α͘ߟ͑Δͱ webίϯςϯπͰى͜Δͯ͢ͷมԽ Πϕϯτ͕͖͔͚ͬʹͳ͍ͬͯΔ ͨ͘͞ΜΠϕϯτ͕͋Δͷೲಘʂ
ΫϦοΫͨ͠ΓεΫϩʔϧͨ͠ΓΩʔೖྗͨ͠Γɾɾɾ Ϣʔβʔͷಈ࡞ͻͱͭͻͱ͕ͭશͯΠϕϯτ Ϣʔβʔͷ༷ʑͳΠϕϯτΛΩϟονͯ͠ ԿΒ͔ͷॲཧΛߦ͍ͬͯΔ Button
ͲΜͳΠϕϯτ͕͋Δͷ͔͍ͬͯΔͱ ੍࡞ͷ෯͕͕Δͣ
͜ͷΠϕϯτɺͲͷλΠϛϯάͰൃՐ͢ΔΜͩΖɾɾɾ ࣅͨΑ͏ͳΠϕϯτ͕͍͔ͭ͋͘ΔͷͳΜͰʁ ඍົʹλΠϛϯά͕ҧ͏ͷʁ ͲͷΠϕϯτΛ͏ͷ͕ϕετͳͷ͔͔Βͳ͍ ͱʹ͔͘ṖͩΒ͚
ओཁͳΠϕϯτ͕ཏ͞Ε͍ͯͯ ͞Βʹʮ͍·ൃՐͨ͠ʯ͕ ࢹ֮తʹΘ͔ΔΞϓϦ͕΄͍͠ʂ
Event Labo IUUQTFWFOUMBCPZVLJL[DPN εϚϗͰݟΔͱTouchΠϕϯτମײͰ͖ΔΑʂ
͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠