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
LLoT Night - Riot.js
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
Tsutomu Kawamura
August 27, 2016
Programming
1
1k
LLoT Night - Riot.js
LLoT Night「フロントエンドだめ自慢」
愛を持ってダメだし(?)する何か
http://ll.jus.or.jp/2016/program#session_frontend
Tsutomu Kawamura
August 27, 2016
Tweet
Share
More Decks by Tsutomu Kawamura
See All by Tsutomu Kawamura
Connect your library to the world
cognitom
0
140
JTF2018
cognitom
5
1.3k
Riot: changing on v3 and its companion tools
cognitom
0
150
Felt - a simple web server with the power of the future
cognitom
0
330
Riot: all about v2 to v3
cognitom
7
3.9k
Create A Small Studio in A Cafe
cognitom
2
940
Riot.js in WPD-Week
cognitom
19
11k
Riot and Components
cognitom
4
650
Cooking Automation
cognitom
1
560
Other Decks in Programming
See All in Programming
プロダクトオーナーから見たSOC2 _SOC2ゆるミートアップ#2
kekekenta
0
220
CSC307 Lecture 08
javiergs
PRO
0
670
カスタマーサクセス業務を変革したヘルススコアの実現と学び
_hummer0724
0
720
CSC307 Lecture 06
javiergs
PRO
0
690
Amazon Bedrockを活用したRAGの品質管理パイプライン構築
tosuri13
5
760
疑似コードによるプロンプト記述、どのくらい正確に実行される?
kokuyouwind
0
390
HTTPプロトコル正しく理解していますか? 〜かわいい猫と共に学ぼう。ฅ^•ω•^ฅ ニャ〜
hekuchan
2
690
AtCoder Conference 2025
shindannin
0
1.1k
Oxlint JS plugins
kazupon
1
980
QAフローを最適化し、品質水準を満たしながらリリースまでの期間を最短化する #RSGT2026
shibayu36
2
4.4k
CSC307 Lecture 09
javiergs
PRO
1
840
責任感のあるCloudWatchアラームを設計しよう
akihisaikeda
3
180
Featured
See All Featured
Claude Code のすすめ
schroneko
67
210k
Bootstrapping a Software Product
garrettdimon
PRO
307
120k
Neural Spatial Audio Processing for Sound Field Analysis and Control
skoyamalab
0
170
How to Align SEO within the Product Triangle To Get Buy-In & Support - #RIMC
aleyda
1
1.4k
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
davidcarrasco
1
56
New Earth Scene 8
popppiees
1
1.5k
Leadership Guide Workshop - DevTernity 2021
reverentgeek
1
200
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
25
1.7k
A Guide to Academic Writing Using Generative AI - A Workshop
ks91
PRO
0
210
Building a Scalable Design System with Sketch
lauravandoore
463
34k
Principles of Awesome APIs and How to Build Them.
keavy
128
17k
My Coaching Mixtape
mlcsv
0
48
Transcript
Տଜ ͔ΘΉΒͭͱΉ ϦϒϥΠζ߹ಉձࣾԼΦʔϓϯιʔε$BGF --P5/JHIUϑϩϯτΤϯυͩΊࣗຫ
None
$PEFS%PKP ϦϒϥΠζ
cognitom
HJUIVCDPNDPHOJUPN
3JPUͱ
γϯϓϧͰɺͱʹ͔͍ܰ͘ 6*ϥΠϒϥϦ
খ͍͜͞ͱɺળ
W W ϑΝΠϧαΠζ ,# ,# ެࣜϦϙδτϦ ݸ ݸ ίΞίϛολʔ ਓ
ਓ एׯΆͬͪΌΓ
(JU)VCͷελʔ ˒ ίϯτϦϏϡʔλ ਓ ϓϧϦΫΤετͷ ݅ 2JJUBͷهࣄ ݅ 3JPUͷͻΖ͕Γ
ίϯϙʔωϯτΛ࡞Ε·͢ <div> <img src=“clear.svg” /> <ul> <li>ۭΑ͏: Ε</li> <li>ؾԹ: 10</li>
<li>࣪: 30%</li> </ul> </div> <weather type=“clear” temperature=“10” humidity=“30%” /> Ε 10 30%
3JPUKTͲΜͳਓʹ ࢧ࣋͞Ε͍ͯΔ͔
ʮઆ໌ॻಡ·ͳ͍ਓʯ )5.-ɾ+4ɾ$44Λɺී௨ʹཧղ͍ͯͯ͠
None
μϝࣗຫ⁞
ʮίϛολʔɺΰϏ࠭യʹফ͑Δʯ
XPOEFSJOHBSPVOETPNFXIFSFJO"TJBOEFTFSU ূݴʮΞδΞͷ࠭യΛ͞·Α͍ͬͯΔʯ
ίΞίϛολʔͷډॴ
݄W ϑΟϯϥϯυ
य़ εΠε͔Β ΞδΞͷ࠭യ
Ն ϝΩγί͔Β ձ৬తͳ ςΩαε͔Β ౦ژ͔Β
Ͳ͔͔͜Β ࣌ʑ߱ྟ
·ɺΦʔϓϯιʔεͰ͔͢Β
None
μϝࣗຫ
ίϯύΠϥ͕ਖ਼نදݱ
ͭ·Γʜ
WBS)5.-@5"(4 <";B[><aXaY" aY''> aT <?a> <?> c<?>
ca<?> <?a > caT a H
ಈ͘Μ͔ͩΒ͍͍͡Όͳ͍͔
ͱ͍͏։͖Γ "45Λநग़͢Δඞཁ͕ͳ͍ɺͱ͍͏ࣄ <my-tag> <p>{ message }</p> <script> this.message =
"Hello!" </script> </my-tag> riot.tag2(‘my-tag’, '<p>{ message }</p>’, ‘', '', function(opts) { this.message = "Hello!" } )
None
μϝࣗຫ
ʮύʔα͕ͳ͍ͬʯ ͋Δ͍ɺJOOFS)5.-࠷ڧઆʜ
None
None
None
͋
Ϛϯτ͢Δ·Ͱ w SJPUUBH ؔͰొࡁΈͷɺλάͷ࣮Λऔಘ w λάΛΠϯελϯεԽ w λάͷ࣮ )5.-ςϯϓϨʔτ ΛJOOFS)5.-ʹಥͬࠐΉ
w ύʔε͢Δɺͱ͍͏ΑΓ%0.Λτϥόʔεͯ͠ɺղੳ w ༩͑ΒΕͨσʔλͰɺλάͷ༰Λߋ৽ w ςϯϓϨʔτม FYQSFTTJPO Λߋ৽ w ϚϯτྃΠϕϯτ
<my-tag> <p>{ message }</p> <script> this.message = "Hello!" </script> </my-tag>
riot.tag2(‘my-tag’, '<p>{ message }</p>’, ‘', '', function(opts) { this.message = "Hello!" } ) riot.mount(‘#main’, ‘my-tag’) #main DOM flag flag <p> { message } </p> <p> Hello! </p> ⁞ <p> Hello! </p>
JOOOFS)5.-αΠΩϣσεϤω
None
·ͱΊ
ϒϥβΏͱΓੈ w ϞμϯϒϥβҎޙͷϥΠϒϥϦ w ϒϥβΛ͋Δఔ৴པʮϘʔϧ༑ୡʯ w ϒϥβʹػೳΛ͍ͨ͠ɺ͡Όͳͯ͘ ʮϒϥβͷػೳͰָ͍ͨ͠ʯ
None
3JPUͷΛ͢ΔͳΒͪ͜Β GCDPNHSPVQTUPLZPSJPU HJUUFSJNSJPUSJPU
ਫɾ༵ ԼͰ ళ൪ͯ͠·͢ ؾܰʹฉ͖ʹདྷͯ ͍ͩ͘͞