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
CapacitorをつかってAngularアプリの可能性を広げよう/ngjapan2019-c...
Search
Masahiko Sakakibara
July 13, 2019
Business
0
1.3k
CapacitorをつかってAngularアプリの可能性を広げよう/ngjapan2019-capacitor
ng-japan 2019「CapacitorをつかってAngularアプリの可能性を広げよう」登壇資料です。
Masahiko Sakakibara
July 13, 2019
Tweet
Share
More Decks by Masahiko Sakakibara
See All by Masahiko Sakakibara
本当に欲しかったのはモノレポツールではなく、tsconfigの設定だった / monorepo-tsconfig
rdlabo
1
72
Reactフレームワークプロダクトを モバイルアプリにして、もっと便利に。 ユーザに価値を届けよう。/React Framework with Capacitor
rdlabo
0
200
プライベートプロダクト戦略 - フロントエンドカンファレンス沖縄 / private_product_frontend
rdlabo
3
4.3k
GitHubをCMSとして使う話/ using_github_as_CMS
rdlabo
0
380
JavaScriptから デバイスの力を100%引き出すための Web APIとCapacitor入門 / power_from_javascript
rdlabo
0
500
Capacitor4_release
rdlabo
0
600
Web技術で稼ぐため選択肢を俯瞰しよう/options_to_earn_web_technology
rdlabo
0
110
Ionicモバイルアプリ制作入門/get_started_with_ionic
rdlabo
0
110
JavaScript から デバイスの力を 100%引き出すための Capacitor と Angular でのはじめかた。
rdlabo
2
1.8k
Other Decks in Business
See All in Business
How should you respond to feedback from reviews and tests
kitanosirokuma
2
170
不二製油グループ本社 (02/07/2025 プレスリリース)
tsogo817421
2
230
Mercari-Fact-book_jp
mercari_inc
5
150k
ファブリカホールディングス_2025年3月期 第3四半期説明資料
fabrica_com
1
3k
HRBP+のご紹介
masakisukeda
0
820
株式会社ビズリーチ 会社概要資料 / Corporate Deck
bizreach_inc
2
26k
メドピアグループ紹介資料
medpeer_recruit
10
120k
merpay-Overview
mercari_inc
7
170k
圧倒的な営業生産性の確立
kotohashi
1
490
ビジネスで活かす生成AIエージェント 〜業務利用を目指して今を俯瞰的に理解しよう〜
masatoto
4
260
【全ポジション共通】㈱エグゼクション/会社紹介資料
exe_recruit
1
1.1k
クラスメソッド_営業向け会社紹介資料_202502 / introduction to classmethod for sales
classmethod_jinji
0
320
Featured
See All Featured
Bootstrapping a Software Product
garrettdimon
PRO
306
110k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Optimising Largest Contentful Paint
csswizardry
34
3.1k
Java REST API Framework Comparison - PWX 2021
mraible
29
8.4k
The Cult of Friendly URLs
andyhume
78
6.2k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
226
22k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
YesSQL, Process and Tooling at Scale
rocio
172
14k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
49
2.3k
Side Projects
sachag
452
42k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
46
2.3k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
12
980
Transcript
$BQBDJUPSΛ͔ͭͬͯ "OHVMBSΞϓϦͷՄೳੑΛ͛Α͏ 6TJOH$BQBDJUPSUP&YQBOEUIF1PUFOUJBMPG"OHVMBS"QQT
*OUSPEVDF .BTBIJLP4BLBLJCBSB $&0 PG3FMBUJPO%FTJHO-BC $50PG "SFB*OOPWBUJPO"MMJBODF *POJD+BQBO6TFS(SPVQ 0SHBOJ[FS
$POUSJCVUF ionic-team/ionic ionic-team/starters ionic-team/ionic-cli ionic-team/ionic-docs ionic-team/ionic-react -conference-app GoogleChrome/lighthouse
$POUSJCVUF
*POJDTVC$-* "VUPTFU MJOUcGPSNBUUFScBMJBT JO*POJD1SPKFDU
<1SPEVDU>UJQTZT
<1SPEVDU>SBCJGZ$%/ FYBNQMFDPNDBUKQH E FYBNQMFDPNDBUKQH E *NQSPWFJNBHFEJTQMBZTQFFE CZSFTJ[FBOE$%/IPTUJOH
$BQBDJUPS
)PXXPSLTPG8FC/BUJWF"QQ w 7JFX-PDBMT8FC4JUFVTJOHB 8FC7JFXDBMMFE"QQ w "1*BWBJMBCMFUPBDDFTT/BUJWF 'VODUJPOT 888
%J⒎FSFODFPG3FBDU/BUJWF/BUJWF4DSJQU
.FDIBOJTNPG3FBDU/BUJWF/BUJWF4DSJQU
/PUGBTUFTU#VUOPUTMPX https://vimeo.com/55486684
6TJOH$BQBDJUPS 8IZ
1SPHSFTTJWF8FC"QQTͷಈ w .PCJMFUJNFJTPOUIFSJTF w PGOFXTNBSUQIPOFBQQJOTUBMMTBSF NPOUI w 5PQ4NBSUQIPOF"QQT%PNJOBUF w
8FCIBTUXJDFBTNVDIUSB⒏DBTTNBSUQIPOFBQQT w #FWJTJUFEPOWBSJPVTXFCTJUFT
1SPHSFTTJWF8FC"QQTͷར 'PSVTJOHUIFBQQ UIFVTFS ɽ(PUPUIFBQQTUPSF ɽ#ZJOTUBMMJOHUIFBQQMJDBUJPO ɽ*IBWFUPTUBSUUIFBQQMJDBUJPO
6TJOH$BQBDJUPS 8IZ
None
None
None
6TFSTXBOUT 18" J04 "OESPJE 2 6,663 1,175
6TFSTQBZNFOUT 18" J04 "OESPJE 0 770 120
.PUJPOMJOF
8FCQBZNFOUT1BZNFOU3FRVFTU"1*
lยखʹࢉ൫ɺยखʹޠz ौӫҰ &JDIJ4IJCVTBXB /PUPOMZJEFBMTCVUBMTPNBOBHFNFOU .BODBOOPUMJWFPOPOMZUIF "OBMFDUTPG$POGVDJVT BOE UIFBCBDVTBMPOFJTJNQFSGFDU BTBNBO .PSBMQSJODJQMFTBSFSFBMJ[FEJO
UIFSFBMMJGFPGNBO*UJTB HBNFPGOPUJPOTJOPOFTNJOE UIBUJUJTOPUQPTTJCMFUPMJWF BOJOEFQFOEFOUMJGF BOEUIBU JUJTBOFUIJDBMNPSBMJUZ
)PXUPTUBSU $ ng add @capacitor/angular $ ng build $ npx
cap add ios $ npx cap open ios $ yarn $ npx cap init
/FFE.PCJMF"QQ6* 'SBNFXPSL $PNQBUJCJMJUZ lOPOMJOFBS OBWJHBUJPO .PCJMF6* /BWJHBUJPO 4UBDL
/FFE.PCJMF"QQ6*.PCJMF6* .PCJMF6TFS*OUFSGBDF
/FFE.PCJMF"QQ6*'SBNFXPSL$PNQBUJCJMJUZ 'SBNFXPSL$PNQBUJCJMJUZʢϓϥοτϑΥʔϜͷޓੑʣ ʮίϯύνϏϦςΟͱɺϋʔυΣΞιϑτΣΞ͕ɺ༷ͷҟͳΔͷʹஔ͖ ͑ΒΕ্ͨͰɺݩ௨Γͷಈ࡞Λ͢Δͱ͍͏ঢ়ଶͷ͜ͱͰ͋Δʯ
/FFE.PCJMF"QQ6*lOPOMJOFBSOBWJHBUJPO lOPOMJOFBSOBWJHBUJPOʢඇઢܗφϏήʔγϣϯʣ
/FFE.PCJMF"QQ6*/BWJHBUJPO4UBDL /BWJHBUJPOTUBDLʢφϏήʔγϣϯελοΫʣ
*POJD'SBNFXPSL $ ng add @ionic/angular $ ng update @ionic/angular
'FBUVSFTPG$BQBDJUPS18"&MFNFOUT $ ionic start ng-demo sidemenu --capacitor $ npm install
@ionic/pwa-elements IUUQTHJUIVCDPNSEMBCPOHKBQBOEFNP IUUQTOHKBQBOEFNPOFUMJGZDPN
'FBUVSFTPG$BQBDJUPS(JUGSJFOEMZ
'FBUVSFTPG$BQBDJUPSDPSFQMVHJOT • "QQ • #BDLHSPVOE5BTL • #SPXTFS • $BNFSB •
$MJQCPBSE • $POTPMF • %FWJDF • 'JMFTZTUFN • (FPMPDBUJPO • )BQUJDT • ,FZCPBSE • -PDBM/PUJpDBUJPOT • .PEBMT • .PUJPO • /FUXPSL • 1VTI/PUJpDBUJPOT • 4IBSF • 4QMBTI4DSFFO • 4UBUVT#BS • 4UPSBHF • 5PBTU
'FBUVSFTPG$BQBDJUPS$PSEPWB1MVHJOTVQQPSU
'FBUVSFTPG$BQBDJUPS6*/BUJWF4IFMM /BUJWFͱ8FC7JFXͷ༥߹ .JYJOH/BUJWF6*BOE8FCXBDSPTTQMBUGPSN6*
'FBUVSFTPG$BQBDJUPS/BUJWF4VQQPSU
!SEMBCPDBQBDJUPSGBDFCPPLMPHJO
!SEMBCPDBQBDJUPSBENPC
!SEMBCPDBQBDJUPSGBDFCPPLMPHJOUVUPSJBM
)PXUPTUBSUGPSHFOFSBUFQMVHJO $ npx @capacitor/cli plugin:generate $ npm publish import {
Plugins } from ‘@capacitor/core'; Plugins.YourPlugin.accessMethod();
8FCJT.BJO8FC7JFX 8FDBOBDDFTT4XJGUBOE+BWB$PEFGSPN5ZQF4DSJQU 8FDBODSFBUF/BUJWF7JFXBOEUPCFBCMFDPOUSPMGSPN/BUJWF$PEF
8FC 18" /BUJWF BOE.PCJMF IUUQTXXXBGQCCDPNBSUJDMFT
"OHVMBSJTQMBUGPSN