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
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
LLoT Night - Riot.js
LLoT Night「フロントエンドだめ自慢」
愛を持ってダメだし(?)する何か
http://ll.jus.or.jp/2016/program#session_frontend
Tsutomu Kawamura
August 27, 2016
More Decks by Tsutomu Kawamura
See All by Tsutomu Kawamura
Connect your library to the world
cognitom
0
170
JTF2018
cognitom
5
1.3k
Riot: changing on v3 and its companion tools
cognitom
0
160
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
960
Riot.js in WPD-Week
cognitom
19
11k
Riot and Components
cognitom
4
680
Cooking Automation
cognitom
1
580
Other Decks in Programming
See All in Programming
ビデオ通話が繋がる0.2秒で何が起きているのか
supurazako
2
180
torikago - Ruby::Boxで照らすモジュラモノリスの実行境界
se4weed
1
350
関東Kaggler会_NVIDIA_Nemotron_コンペ_振り返り
rick_ds
0
490
源内ハンズオン概要編
hideg
0
140
全PRの83%がAIレビューだけでマージできるようになった開発組織はその後どうなったか
athug
1
1.5k
【やさしく解説 設計編・中級 #4】ルールの寿命と、システムの年輪
panda728
PRO
2
180
Claude Code全社展開のためにやったことn選~プラグイン302個・コミッター271人を支えるために~
kenchan
5
1.4k
jsmini JavaScript Engine を作ってみた話
yosuke_furukawa
PRO
0
300
Laravelで学ぶ Webアプリケーションチューニング入門/web_application_tuning_101
hanhan1978
4
1.7k
霧の中の代数的エフェクト
funnyycat
1
490
Lean は証明の正しさを確認するためだけのツールって思ってませんか?
inoueasei
1
150
Foundation Models frameworkで画像分析
ryodeveloper
1
600
Featured
See All Featured
Raft: Consensus for Rubyists
vanstee
141
7.6k
State of Search Keynote: SEO is Dead Long Live SEO
ryanjones
0
240
How to build an LLM SEO readiness audit: a practical framework
nmsamuel
1
850
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
6k
The Mindset for Success: Future Career Progression
greggifford
PRO
0
440
Side Projects
sachag
455
43k
The Illustrated Guide to Node.js - THAT Conference 2024
reverentgeek
1
420
First, design no harm
axbom
PRO
2
1.2k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
16
2.1k
Reality Check: Gamification 10 Years Later
codingconduct
0
2.2k
How to Think Like a Performance Engineer
csswizardry
28
2.7k
Why You Should Never Use an ORM
jnunemaker
PRO
61
10k
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
ਫɾ༵ ԼͰ ళ൪ͯ͠·͢ ؾܰʹฉ͖ʹདྷͯ ͍ͩ͘͞