Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Onsen UI for Vue 導入してみた
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
大塚真言
February 05, 2019
Programming
480
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Onsen UI for Vue 導入してみた
大塚真言
February 05, 2019
More Decks by 大塚真言
See All by 大塚真言
自社プロダクトを作ってみた.pdf
shingen29
0
340
CI/CD実践入門! GitHub ActionsでCI/CD環境を作ってみよう!
shingen29
0
160
CI/CD実践入門! GitHub ActionsでCI/CD環境を作ってみよう!
shingen29
0
340
ユースケース駆動開発で自社プロダクトを作ってみた!
shingen29
1
8.2k
MDN Web Docsから学ぶ 公式ドキュメントを読むメリット
shingen29
0
960
PHP8をざっくり解説してみる
shingen29
0
370
最近のプロジェクトを振り返ってみる
shingen29
0
450
Style Guideとstylelintを使ってHTML/CSSを綺麗に書こう!
shingen29
2
950
Stripe CLIを触ってみた!
shingen29
1
290
Other Decks in Programming
See All in Programming
TanStack Vue Query と Pinia Colada から学ぶ非同期状態の型設計
aoshi
0
340
dotNET_vulnclicker_intro.pdf
deka_morita
0
150
SFCで実現する病院・医療システムの動的組み立て式UI
koukimiura
1
130
No More NoSuchMethodError
exoego
1
120
AIがコードを書いてくれる時代、我々は何を確かめるのか
yosuke_furukawa
PRO
12
5k
クラウドエージェントは、 何がそんなに便利なのか / what makes cloud agents so useful
rkaga
3
600
複雑なUIコンポーネントとの ⻑い付き合い⽅:波及するバグからテスト戦略を経て、安全な再設計へ
mixplace
0
480
動画プレイヤーはなぜカクつくのか 〜Flutterのレンダリングとネイティブの境界を解剖する〜
naruogram
0
170
Domain-Driven Transformation
hschwentner
2
2.3k
学びを記事・スライド・Xへ高速展開する― AI-assisted Learning Loopで回すコンテンツ生成術
ochtum
0
150
クラウドゲーミングのパフォーマンス最適化に挑む / Cloud Gaming Performance Tuning
vivion
0
290
【加筆修正版】Laravel のアプリケーションをどこにデプロイするか #phpcon_ehime
akase244
0
160
Featured
See All Featured
The Mindset for Success: Future Career Progression
greggifford
PRO
0
550
Building a Scalable Design System with Sketch
lauravandoore
464
34k
The Invisible Side of Design
smashingmag
301
52k
SEOcharity - Dark patterns in SEO and UX: How to avoid them and build a more ethical web
sarafernandez
0
310
技術選定の審美眼(2025年版) / Understanding the Spiral of Technologies 2025 edition
twada
PRO
120
120k
How STYLIGHT went responsive
nonsquared
100
6.3k
Kristin Tynski - Automating Marketing Tasks With AI
techseoconnect
PRO
0
560
Hiding What from Whom? A Critical Review of the History of Programming languages for Music
tomoyanonymous
3
1.4k
How to train your dragon (web standard)
notwaldorf
96
6.9k
Leveraging Curiosity to Care for An Aging Population
cassininazir
1
540
Unsuck your backbone
ammeep
672
58k
How to Think Like a Performance Engineer
csswizardry
28
2.9k
Transcript
Onsen UI for Vue ಋೖͯ͠Έͨ 2019/2/4 JSΒφΠτvol.4 ʂ େ௩ਅݴ
ࣗݾհ ɾ໊લɹɿେ௩ ਅݴʢMakoto Otsukaʣ ɾ໊͋ͩɿ͠Μ͛Μ ɾTwitterɿ@mametra ɾॴଐɹɿ߹ಉձࣾϊϚυϦ ɾεΩϧɿLaravel, Vue.js ɾझຯɹɿΩϟϯϓ,
ϑΣε
։ൃதͷγεςϜ ɾҩྍܥγεςϜ iOS/AndroidΞϓϦ Ϣʔβ͚ WebΞϓϦ පӃ/ຊ෦͚
༻ٕज़ ᶃϢʔβ͚ʢiOS/AndroidΞϓϦʣ ɹɾHTML, CSS, JavaScript, Vue.js ɹɾOnsenUIʢUIϑϨʔϜϫʔΫʣ ɹɾCordovaʢϋΠϒϦουΞϓϦ։ൃPFʣ ɹɾFirebaseʢAuthentication, Cloud
FireStore, ͋ͱͨͿΜFunctionsʣ ᶄපӃ/ຊ෦͚ʢWebΞϓϦʣ ɹɾHTML, CSS, JavaScript, Vue.js ɹɾFirebaseʢAuthentication, Cloud Firestore, Hostingʣ
༻ٕज़ʢiOS/AndroidΞϓϦʣ ϑϩϯτΤϯυ )5.- $44 7VFKT 0OTFO6* ϋΠϒϦουΞϓϦ J04ΞϓϦ "OESPJEΞϓϦ $PSEPWB
Ϗϧυ όοΫΤϯυ 'JSFCBTF %BUB #BTF
બఆཧ༝ ᶃCordova ɹɾ༧ࢉͷ্ؔɺiOSͱAndroidΛ֤ʑ։ൃͰ͖ͣ ɹɾωΠςΟϒΞϓϦ։ൃऀෆࡏ ɹɾWebʢHTML,CSS,JavaScriptʣٕज़Ͱ࣮Մೳ ɹɾReact NativeFlutterෑډ͕ߴͦ͏… ɹ ᶄOnsenUI ɹɾVue.jsʹରԠ
ɹɾυΩϡϝϯτ͕ຊޠରԠ ᶅFirebase ɹɾ։ൃup͕ݟࠐΊΔ ɹɾಋೖاۀ͕૿͓͑ͯΓࢀߟࢿྉ͕͋Δ
OnsenUIͱ ɹɾϞόΠϧΞϓϦʹಛԽͨ͠UIϑϨʔϜϫʔΫ ɹɾωΠςΟϒͷΑ͏ͳUIΛఏڙ ɹɾ༝དྷ SPA -> Թઘ -> Onsen ͔Β͖ͨΒ͍͠
ɹɾhttps://ja.onsen.io/demo/
iOS Android ࣮ߦ͢ΔʹԠͯ͡ελΠϧΛௐͯ͘͠ΕΔ
Onsen UI for Vue ͱ ɹɾ20177݄ Vue.jsʹରԠ ɹɾv-ons-*Ͱ͡·Δίϯϙʔωϯτ ɹɾͯ͢ͷAPIVue͚ʹΧελϚΠζ
ᶃηοτΞοϓ͢Δ https://ja.onsen.io/vue/
ᶄ࣮͢Δ https://ja.onsen.io/vue/
ิ ɾIonic ͕ Vue.js ʹରԠʢα൛ʣ IonicɺVue.jsΠϯςάϨʔγϣϯͷαϦϦʔεΛൃදʢhttps://www.infoq.com/jp/news/ 2018/12/ionic-vue-integration-alpha#.XBHW6TGs7yU.twitterʣ ɾIonic ͷํ͕UIίϯϙʔωϯτ͕ଟ͍Β͍͠
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ