Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
Progressive Repro Frontend #vuefes
cheezenaan
November 03, 2018
Technology
3
630
Progressive Repro Frontend #vuefes
Lunch Sponsor session in Vue Fes Japan 2018
cheezenaan
November 03, 2018
Tweet
Share
More Decks by cheezenaan
See All by cheezenaan
Repro の Web SDK 開発を支える技術 / How to deal with Web SDK development at Repro
cheezenaan
3
2.2k
Other Decks in Technology
See All in Technology
Settlement simulation testing to ensure correct settlement processing
applepine1125
2
1.5k
AWSを使う上で意識しておきたい、クラウドセキュリティ超入門(駆け足版)
kkmory
0
220
20220803投資先CXO候補者向け 会社紹介資料_合同会社BLUEPRINT
hik
0
540
サイバー攻撃を想定したクラウドネイティブセキュリティガイドラインとCNAPP及びSecurity Observabilityの未来
syoshie
2
1.5k
GCCP Creator @ COSCUP 2022
line_developers_tw
PRO
0
1.4k
フィンテック養成勉強会#24
finengine
0
340
Microsoft Data Analytics trends : ”Lakehouse” , ”Data Mesh"
ryomaru0825
2
150
ここが好きだよAWS管理ポリシー_devio2022/i_am_iam_lover
yukihirochiba
0
3.2k
Power BI のうらがわ
hanaseleb
1
160
テスト自動化を最速で軌道に乗せるために
nozomiito
0
150
DMMプラットフォーム ゼロから始めるKubernetes運用 課題と改善
pospome
0
420
聊聊 Cgo 的二三事
david74chou
0
340
Featured
See All Featured
Stop Working from a Prison Cell
hatefulcrawdad
262
17k
Build The Right Thing And Hit Your Dates
maggiecrowley
19
1.2k
Thoughts on Productivity
jonyablonski
44
2.4k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
7
1.1k
Reflections from 52 weeks, 52 projects
jeffersonlam
337
17k
From Idea to $5000 a Month in 5 Months
shpigford
373
44k
VelocityConf: Rendering Performance Case Studies
addyosmani
316
22k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
37
3.3k
Building an army of robots
kneath
299
40k
The Power of CSS Pseudo Elements
geoffreycrofte
47
4k
The Illustrated Children's Guide to Kubernetes
chrisshort
18
40k
Bash Introduction
62gerente
598
210k
Transcript
Progressive Repro Frontend @cheezenaan Repro inc. Vue Fes Japan 2018
Have you enjoyed Vue Fes Japan 2018? !
@cheezenaan Repro inc. Progressive Repro Frontend Vue Fes Japan 2018
What’s Repro?
IUUQTSFQSPJP
Web / App Marketing Automation IUUQTSFQSPJP
αϒεΫϦϓγϣϯΛ ղͦ͠͏ͳϢʔβʔ ͚ͩʹ ϓογϡ௨ΛૹΓ͍ͨ
αϒεΫϦϓγϣϯΛ ղͦ͠͏ͳϢʔβʔ ͚ͩʹ ϓογϡ௨ΛૹΓ͍ͨ
Repro ͳΒ αΫοͱͰ͖·͢
ઍສͷτϥϑΟοΫ ԯ௨ͷϓογϡ৴ per day
“ͱΓ͋͑ͣ Repro ೖΕΑ͏” ΛੈքنͰࢦͯ͠·͢
Ͱɺ͓Ίʔ୭Αʁ
@cheezenaan Application Engineer Loves: - TypeScript - Curry NOT callee
$ - Kyoto Animation
ΑΖ͘͠ ͓Ͷ͕͍͠·͢
͔͜͜Βຊฤ
Progressive Repro Frontend
Progressive Repro Frontend
…
࣌ʹɺྐྵ 2014
࣌ʹɺྐྵ 2014
Repro, ੜ
άϥϑΟΧϧͳ ੳը໘ΛΰϦΰϦ࣮ in RoR + jQuery
͔ΜͨΜͳϩδοΫΛ मਖ਼͢Δ͚ͩͳͷʹ DOM ߏΛ୮೦ʹ ಡΈղ͔ͳ͍ͱࢮ͵
None
IUUQTWVFKTPSH
Vue.js IUUQTWVFKTPSH
Declarative Rendering Two-way Binding IUUQTWVFKTPSH
An incrementally adoptable ecosystem IUUQTWVFKTPSH
IUUQTEPDTHPPHMFDPNQSFTFOUBUJPOE8O:TY3.J/&"S5Y[Y9)E,F)$K57YNQUHI+C&TFEJUTMJEFJEHGD@
IUUQTEPDTHPPHMFDPNQSFTFOUBUJPOE8O:TY3.J/&"S5Y[Y9)E,F)$K57YNQUHI+C&TFEJUTMJEFJEHGD@ Progressive Framework
ςΟϯʂ
None
v0.12.0
σʔλϩδοΫͱ DOM ඳըΛ
ςετ͍͢͠ʂ
ͦͷޙαʔϏε ॱௐʹΛॏͶ
IUUQTRJJUBDPNFEXBSELFOGPYJUFNTGBBEB
ʑͷ։ൃͰ ಘͨݟ ੯͠·ͣൃ৴ IUUQTRJJUBDPNFEXBSELFOGPYJUFNTGBBEB
ͦͯ͠ɺ
࣌ʹɺྐྵ 2017
ϚʔέςΟϯάػೳ֦ॆ ͳ͍ͰෳࡶԽ͢Δ ೖྗϑΥʔϜ
ίϯϙʔωϯτͷ ঢ়ଶཧͭΒͨΜ
None
IUUQTWVFYWVFKTPSH
Vuex IUUQTWVFYWVFKTPSH
Store management pattern + library IUUQTWVFYWVFKTPSH
tailored specifically for Vue.js IUUQTWVFYWVFKTPSH
ͳΔ΄Ͳ…
None
None
None
ࢼߦࡨޡ͠ͳ͕Β ݟΛͨΊͭͭ
ΞϓϦέʔγϣϯͷঢ়ଶΛ UI ͷঢ়ଶ͔ΒΓͯ͠ ू͍ͤͯ͘͞
None
ίϯϙʔωϯτͷ ݟ௨͕͠ྑ͘ͳͬͨ
ΊͰͨ͠ΊͰͨ͠ =ऴ=
ͦͯ͠ɺ
࣌ʹɺྐྵ 2018
ຖ xx0% ͢Δ ϏδωεΛࢧ͑ΔͨΊͷ ݎ࿚ͳΞʔΩςΫνϟΛ ͑ͭͭ
ΑΓεϐʔσΟʹ ܧଓతʹ ϢʔβʔՁΛ ಧ͚͍ͨ
େͳσʔλͷهɾՃ ฒྻϫʔΫϑϩʔΤϯδϯ ੳɾϚʔέςΟϯά UI / UX
େͳσʔλͷهɾՃ ฒྻϫʔΫϑϩʔΤϯδϯ ੳɾϚʔέςΟϯά UI / UX
None
͋Ε͍ͨ͠ ͜Ε͍ͨ͠
Γ͍ͨ͜ͱ͕ Γͩ͘͞Μ
None
ςΟϯʂͱ͖ͨ ͦ͜ͷ͋ͳͨ !
͓͢͢Ίͷձࣾ ͬͯ·͢
IUUQTXXXXBOUFEMZDPNDPNQBOJFTSFQSP
IUUQTXXXXBOUFEMZDPNDPNQBOJFTSFQSP
2018 2014 2017 2016 2015 v2.5.x v1.0.28 Completely Decaffeinated v3.1.x
(TBD…) v0.12 ࢲͨͪͱ ੈքΛ ࢦ͠·ͤΜ͔
End
End?
One more thing …
ϊϕϧςΟ͋Γ〼 εςοΧʔ Tγϟπ
Vue Fes ձͰ ΅͘ͱѲख
Thank you