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
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
150
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
340
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
660
Cooking Automation
cognitom
1
570
Other Decks in Programming
See All in Programming
2026/02/04 AIキャラクター人格の実装論 口 調の模倣から、コンテキスト制御による 『思想』と『行動』の創発へ
sr2mg4
0
600
オブザーバビリティ駆動開発って実際どうなの?
yohfee
1
310
Event Storming
hschwentner
3
1.3k
CSC307 Lecture 09
javiergs
PRO
1
850
CSC307 Lecture 11
javiergs
PRO
0
580
DSPy入門 Pythonで実現する自動プロンプト最適化 〜人手によるプロンプト調整からの卒業〜
seaturt1e
1
230
生成AIを活用したソフトウェア開発ライフサイクル変革の現在値
hiroyukimori
PRO
0
140
FOSDEM 2026: STUNMESH-go: Building P2P WireGuard Mesh Without Self-Hosted Infrastructure
tjjh89017
0
190
今、アーキテクトとして 品質保証にどう関わるか
nealle
0
180
AIによる開発の民主化を支える コンテキスト管理のこれまでとこれから
mulyu
3
2k
CSC307 Lecture 06
javiergs
PRO
0
700
Gemini for developers
meteatamel
0
120
Featured
See All Featured
Six Lessons from altMBA
skipperchong
29
4.2k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
54k
Site-Speed That Sticks
csswizardry
13
1.1k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
Designing for humans not robots
tammielis
254
26k
My Coaching Mixtape
mlcsv
0
60
Rebuilding a faster, lazier Slack
samanthasiow
85
9.4k
The AI Search Optimization Roadmap by Aleyda Solis
aleyda
1
5.3k
Google's AI Overviews - The New Search
badams
0
920
Navigating the Design Leadership Dip - Product Design Week Design Leaders+ Conference 2024
apolaine
0
210
Paper Plane (Part 1)
katiecoart
PRO
0
4.8k
Odyssey Design
rkendrick25
PRO
2
520
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
ਫɾ༵ ԼͰ ళ൪ͯ͠·͢ ؾܰʹฉ͖ʹདྷͯ ͍ͩ͘͞