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
160
Reactフレームワークプロダクトを モバイルアプリにして、もっと便利に。 ユーザに価値を届けよう。/React Framework with Capacitor
rdlabo
0
310
プライベートプロダクト戦略 - フロントエンドカンファレンス沖縄 / private_product_frontend
rdlabo
3
4.4k
GitHubをCMSとして使う話/ using_github_as_CMS
rdlabo
0
450
JavaScriptから デバイスの力を100%引き出すための Web APIとCapacitor入門 / power_from_javascript
rdlabo
0
550
Capacitor4_release
rdlabo
0
620
Web技術で稼ぐため選択肢を俯瞰しよう/options_to_earn_web_technology
rdlabo
0
140
Ionicモバイルアプリ制作入門/get_started_with_ionic
rdlabo
0
140
JavaScript から デバイスの力を 100%引き出すための Capacitor と Angular でのはじめかた。
rdlabo
2
1.8k
Other Decks in Business
See All in Business
セーフィー株式会社(Safie Inc.) 会社紹介資料
safie_recruit
6
350k
FERMENSTATION Recruitment
fermenstation
0
390
三井物産グループのデジタル証券〜銀座〜徹底解説セミナースライド(20250630)
c0rp_mdm
PRO
0
2.1k
ベタートラップと夏
mosa_siru
8
3.4k
c-slide_サービス紹介資料テンプレート
coneinc
0
720
日本ロボット工業会:講演「中国のヒューマノイド・ロボットの開発と利用の最新動向」 20250625
takasumasakazu
1
2.3k
採用説明資料
recruit_mitsukaru
0
1.5k
株式会社kubellパートナー 会社説明資料 (MINAGINE事業版)
kubell_partner
2
410
アディクシィ株式会社 会社資料
adixi
0
1.8k
5年勤めた印刷屋から ITエンジニアに転職した話
ichigats
0
160
KINTOテクノロジーズ OsakaTechLab説明資料 / ktc-osakatechlab-introduction.pdf
ktc_creative
0
360
【新卒採用ピッチ資料/営業職】(株)キャリアデザインセンター
cdcsaiyo
0
1.7k
Featured
See All Featured
Designing for Performance
lara
610
69k
Why Our Code Smells
bkeepers
PRO
336
57k
Optimizing for Happiness
mojombo
379
70k
Producing Creativity
orderedlist
PRO
346
40k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
44
2.4k
Unsuck your backbone
ammeep
671
58k
Intergalactic Javascript Robots from Outer Space
tanoku
271
27k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Typedesign – Prime Four
hannesfritz
42
2.7k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
60k
Thoughts on Productivity
jonyablonski
69
4.7k
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