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
Webの未来を切り開くIonic Framework/wep-pwa-ionic-framework
Search
Masahiko Sakakibara
August 06, 2017
Technology
1.2k
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Webの未来を切り開くIonic Framework/wep-pwa-ionic-framework
Masahiko Sakakibara
August 06, 2017
More Decks by Masahiko Sakakibara
See All by Masahiko Sakakibara
決済端末ビジネスを、決済会社だけのものにしない/stripe_terminal_business
rdlabo
0
57
JavaScriptで始める店舗インフラ決済構築/stripe_terminal_workshop
rdlabo
0
46
No Install CMS戦略 〜 5年先を見据えたフロントエンド開発を考える / no_install_cms
rdlabo
0
690
本当に欲しかったのはモノレポツールではなく、tsconfigの設定だった / monorepo-tsconfig
rdlabo
1
380
Reactフレームワークプロダクトを モバイルアプリにして、もっと便利に。 ユーザに価値を届けよう。/React Framework with Capacitor
rdlabo
0
570
プライベートプロダクト戦略 - フロントエンドカンファレンス沖縄 / private_product_frontend
rdlabo
3
4.9k
GitHubをCMSとして使う話/ using_github_as_CMS
rdlabo
0
680
JavaScriptから デバイスの力を100%引き出すための Web APIとCapacitor入門 / power_from_javascript
rdlabo
0
640
Capacitor4_release
rdlabo
0
730
Other Decks in Technology
See All in Technology
Tab5をRubyで動くパソコンにする
kishima
1
190
こんなアーキテクチャ図は嫌だ BEYOND THE TIME: 半年後の自分へ贈る15のメッセージ / 15 of Anti-pattern in AWS Architecture Diagrams
naospon
3
250
Sony-DroidKaigi2026
sony
1
320
設計の世代交代を乗り越える、14年続くAndroidアプリの開発戦略
sansantech
PRO
1
130
From Vanilla Kubernetes to a Batteries-Included Platform: Developer Experience at 1,300+ Clusters
yosshi_
0
550
GuardDuty 検知対応を DevOps Agent で効率化しようとしている話 / GuardDuty Investigations with DevOps Agent
masahirokawahara
1
310
多摩川(.dev)ランニング入門 / Tamagawa.dev#3
fujiwara3
3
370
V8コントリビュート超入門
riyaamemiya
0
140
AI活用の現在地、 ちゃんと見えてますか?/XPfest-2026
visional_engineering_and_design
0
160
Amazon S3 Tablesに全部任せてみた結果——コンパクション/スナップショット管理は本当に手放せるか
shigeruoda
0
400
Self Healing Rollouts: Automating Production Fixes with Agentic AI
kdubois
0
150
Azure App Service / Container Apps の組み込み認証
kuniteru
0
200
Featured
See All Featured
Scaling GitHub
holman
464
140k
The AI Search Optimization Roadmap by Aleyda Solis
aleyda
1
6.1k
First, design no harm
axbom
PRO
2
1.3k
WENDY [Excerpt]
tessaabrams
12
39k
Bridging the Design Gap: How Collaborative Modelling removes blockers to flow between stakeholders and teams @FastFlow conf
baasie
0
690
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
287
14k
Facilitating Awesome Meetings
lara
57
7.1k
The Curse of the Amulet
leimatthew05
2
14k
The SEO Collaboration Effect
kristinabergwall1
1
550
How to make the Groovebox
asonas
2
2.4k
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
davidcarrasco
3
230
Effective software design: The role of men in debugging patriarchy in IT @ Voxxed Days AMS
baasie
0
510
Transcript
Ұൠࣾஂ๏ਓϦϨʔγϣϯσβΠϯݚڀॴ දཧࣄɹࡗݪণ 8FCͷະདྷΛΓ։͘*POJD'SBNFXPSL
ࣗݾհ ࡗݪণ Ұൠࣾஂ๏ਓϦϨʔγϣϯσβΠϯ ݚڀॴදཧࣄ Ұൠࣾஂ๏ਓΤϦΞɾ ΠϊϕʔγϣϯɾΞϥΠΞϯε$50 ञॲ͔͖͞ ళओ ຊͷϋογϡλά #ionic_jp
#cybozutech
)5.-ΞϓϦΛͭ͘ΔͨΊͷશ෦ ೖΓϑϨʔϜϫʔΫ w "OHVMBSʢ(PPHMFʣ͕ w λεΫϥϯφʔɺϥΠϒϦϩʔυ ͳͲͷ૯߹։ൃڥ͕σϑΥϧτ Ͱ༻ҙ͞Ε͍ͯͯ w $PSEPWBɺ18"ʹσϑΥϧτରԠ
w #PPUTUSBQͷΑ͏ͳ6*ίϯϙʔω ϯτΛ࣋ͪ *POJD'SBNFXPSLͱ
ςοΫϑΟʔυʢ0QFO8FC5FDIOPMPHZ$PSQʣ
)JCFFʢ&YDJUF+BQBO$P -UEʣ
.D%POBMET5ÛSLJZFʢ"OBEPMVʜ-UEŞUJʣ
$ npm install -g ionic cordova <= Ionicをはじめる準備(CLI) $ ionic
start ProjectName <= プロジェクトを作成 $ ionic serve <= 開発開始 ͡Ίํ
<֮͑ํ>VTFDBTF͔ΒֶͿ$POQPOFOUT IUUQJPOJDUFBNHJUIVCJPJPOJDDPOGFSFODFBQQXXX
͞Βʹ JPOJDDPSEPWBCVJMEJPTcBOESPJE w εϚϗΞϓϦͱͯ͠Մೳ w ϦιʔεͰෳΞϓϦϦϦʔ ε w J5VOFT4UPSF(PPHMF1MBZ 8JOEPXT1IPOF
w &MFDUSPOͰίϯύΠϧ͢Δͱ σεΫτοϓΞϓϦɻ $PSEPWBͰ8FCΛεϚϗΞϓϦ
͜͜·Ͱɺ*POJDʹ͋Γ·ͨ͠ΑͶɻ
ɺ)5.-ͰΞϓϦΛͭ͘ΔͷͰͳ͘ )5.-͕ΞϓϦʹͳΔ࣌Ͱ͢ɻ
ΦϑϥΠϯͰͷදࣔʢΩϟογϡදࣔʣ w ࣗͰνΣοΫ͓ͯ͠ؾʹೖΓʹೖΕ͓ͨ ళใΛग़ઌͰݟ͢ w ిंͷதͰϒϥβόοΫͨ͠ॠؒʹτϯ ωϧʹೖͬͨ w ʰΠϯλʔωοτଓ͕͋Γ·ͤΜʱ ͨΓલʁ
σϞ IUUQTBJSBSFBJBKQ 18"Ͱ8FCΛΞϓϦԽ
1VTI௨ ࢈ܦ৽ฉΛ͡Ίͱͯ͠ଟ͘ͷେखϝσΟ Ξ'BDFCPPL5XJUUFSͳͲ͕͢Ͱʹ࣮ ɻϒϥβͰ1VTI௨͕ૹΕ·͢ɻ ͦͷଞ w ΞϓϦͱͯ͠Πϯετʔϧ ʢ5XJUUFS-JUF.#ҎԼͰىಈ ࣌ؒΞοϓʣ w
(14ͷߴਫ਼ิ 18"Ͱ8FCΛΞϓϦԽ
ىಈ͍ΜͰ͠ΐʁ (PPHMFݕࡧͰͪΌΜͱಡΈࠐΜͰ͘Εͳ͍ͷͰ 0(1λάͱ͔ͪΌΜͱಈ͔ͳ͍ΜͰ͠ΐʁ 4BGBSJͱ͔"QQMFͰಈ͔ͳ͍ͷͰ 18"͍ͬͯ·͍ͪ͡Όͳ͍ͷʁ
w *POJD͔Β!*POJD1BHF͕ಋೖɻ$PNQPOFOUTຖʹ.PEVMFΛׂ ͯ͠Ԇϩʔυ w ಉ࣌ʹ%PDVNFOUT͔Β%FFQ-JOL͕ͳ͘ͳͬͨɻ w *POJD$-*ͷJPOJDHͰσϑΥϧτͰ.PEVMFׂͯ͠ੜ w ࠓޙํޓͰ͑Δ͚Ͳɺকདྷతʹ!*POJD1BHFΛΘͳ͍ͷ όουϊϋʹͳΓͦ͏
w ͳͷʹͳ͔ͥσϑΥϧτςϯϓϨʔτະͩ!*POJD1BHFඇରԠ 18"ͬͯىಈ͍Ͱ͠ΐʁ
18"ͬͯىಈ͍Ͱ͠ΐʁ
18"ͬͯىಈ͍Ͱ͠ΐʁ
18"ͬͯىಈ͍Ͱ͠ΐʁ
(PPHMFݕࡧͰͪΌΜͱಡΈࠐΜͰ͘Εͳ͍Ͱ͠ΐʁ
(PPHMFݕࡧͰͪΌΜͱಡΈࠐΜͰ͘Εͳ͍Ͱ͠ΐʁ
w QSFSFOEFSJPΛ͏͜ͱͰରԠ Մೳɻ w ؆୯ʹ͍͏ͱɺSPCPU͕͖ͨ࣌ͩ ͚ϨϯμϦϯάࡁΈίϯςϯπ Λฦ͢Έɻ/FUMJGZΛ͏ͱ ແྉͰ͑ΔΑɻ w "OHVMBSͷ.FUB"1*Ͱ.FUBΛ
ॻ͖͑·͢ w W͔Β443ʹσϑΥϧτରԠ ͢Δ͔ΒͬͱָʹͳΓͦ͏ 0(1λάͱ͔ͪΌΜͱಈ͔ͳ͍Ͱ͠ΐʁ
0(1λάͱ͔ͪΌΜͱಈ͔ͳ͍Ͱ͠ΐʁɿ࣮ࣄྫ
4BGBSJͱ͔"QQMFͰಈ͔ͳ͍ͷͰ
<֮͑ํ>$PNQPOFOUT"1*ΛͲ͏ͬͯ͏͔ IUUQJPOJDGSBNFXPSLDPNEPDTDPNQPOFOUT
<֮͑ํ>࠷ͰΞϓϦΛϦϦʔεͯ͠ΈΔ IUUQJPOJDXQDPN
<֮͑ํ>*POJD81DPNΛࢼ͢ΞϓϦXQQPDLFU IUUQTQPDLFUJPOJDXQDPN
ʮԶͷՇ͕ՄѪ͍ʯͷJ04"OESPJEΞϓϦ࣌ؒͰϦϦʔε ެ։ॳʹόζͬͯؒͰສ17ɻઌिɺ/),ʹͱΓ͋͛ΒΕͨʮԶՇʯ
w લɺ8PSE1SFTTΛ֮͑Δ͚ͩͰ Ҋ݅୯ՁສҎ্େ͖͘ͳͬͨ w ֶशίετ͕ʂͱ͍ͬͯͨ)5.-ίʔ μʔ͕Ͳ͏ͳ͔ͬͨ͝ଘͷ௨Γ w 8FCΞϓϦɺJ04ΞϓϦɺ"OESPJEΞ ϓϦΛผʑʹͭͬͨ͘߹ͷίετ ʁ"MMJO0OFͰͭͬͨ͘ΒҊ݅୯
Ձʁ w ʮ৽͍ٕ͠ज़ʯͰͳ͘ʮ͔Δٕज़ʯ Ͱ͋ΔՄೳੑ ୈೋͷ8PSE1SFTTʹͳΔ͔
w ͜ͷؒͰωΠςΟϒ։ൃ ͔Βݮগ w εϚʔτΥονͷ։ൃऀ͕ ͍ΔΒ͍͠ w "84ΑΓ'JSFCBTFͷํ͕Α͘ ΘΕ͍ͯΔʢϓογϡ௨Ͱ ɺͱʣ
w .JDSPTPGUͷ։ൃͨ͠7JTVBM 4UVEJP$PEF͕τοϓγΣΞ w *POJDΛબΜͩਓɺ6*ίϯϙʔ ωϯτͷσβΠϯ͕ؾʹೖͬͯ Δ w 8FC։ൃऀ͕ϞόΠϧΞϓϦ։ ൃऀͱҠߦͯ͠Δ *POJD%FWFMPQFS4FSWFZ ϑΥʔϥϜͰ$44ͷ࣭Λ͢ΔͬͯΔɻ
w TMBDLͷΦʔϓϯνϟϯωϧʢIUUQTJPOJDTMBDLDPNʣ͋Δͷ Ͱɺ͍࢝ΊͯΘ͔Βͳ͍͜ͱ͋ͬͨΒϔϧϓٻΊΒΕ·͢ w ฐࣾͰ*POJDTVQQPSUQSPHSBN͡Ί·͢ɻϦϑΝΫλϯάΦϓγϣ ϯ͢Δ༧ఆɻҊ݅ಋೖʹٕज़తʹΜͰΔํ͓͍߹ΘͤԼ͍͞ w ࠙ձͰͰɺฉ͍ͯԼ͍͞ɻ ฉ͘ɺͰऴΘΒͳ͍ͨΊʹ
None