Slide 1
Slide 1 text
やってみたよ
Vue Native
2019/11/21
@v-sendai #4
ヒツジハネタ
Slide 2
Slide 2 text
自己紹介
高橋翔太
hitsuji-haneta
LasTrust株式会社
h1tsuj1_haneta
https://lastrust.io
元はフリーランス
でした
・ブロックチェーン証明書の発行
・証明書の管理アプリの開発
（ヒツジハネタ）
Slide 3
Slide 3 text
ちょっと宣伝を
Slide 4
Slide 4 text
■1/16(木) 19:00 ~
ブロックチェーンハンズオン
■12/19(木) 19:00 ~
git ハンズオン
Slide 5
Slide 5 text
本題
Slide 6
Slide 6 text
Sendai Frontend Meetup
の二次会にて…
Slide 7
Slide 7 text
React Native使ったことあります？
Slide 8
Slide 8 text
Vueにもありますよね。
Vue NativeとかNative Scriptとか。
Slide 9
Slide 9 text
知ってるけどやったことないなぁ。
！
Slide 10
Slide 10 text
次のLTテーマ決まったでこれ
Slide 11
Slide 11 text
Vue Nativeとは何か？
✋
Slide 12
Slide 12 text
JavaScriptでアプリ作る隊
Cordova
(Ionic)
ReactNative
(Expo)
NativeScript
VueNative
PWA
クロスプラットフォーム！
Slide 13
Slide 13 text
Cordova
(Ionic)
NativeScript VueNative
Vueに対応してる人たち
ビルドめんどくさそう
ReactNative
(Expo)
兄貴！
ちょー簡単
Slide 14
Slide 14 text
$ npm install —-global expo-cli vue-native-cli
$ vue-native init
$ cd
$ npm run start
どんな感じで作る？
コンソールに出るよ！
Slide 15
Slide 15 text
Expo簡単すぎ
Slide 16
Slide 16 text
My Vue Native App
.container {
background-color: white;
align-items: center;
justify-content: center;
flex: 1;
}
.text-color-primary {
color: blue;
}
Slide 17
Slide 17 text
何を作った？
Slide 18
Slide 18 text
写真とったら画像解析してくれるアプリ
Slide 19
Slide 19 text
デモ
Slide 20
Slide 20 text
構成図
Firebase
Storage
Firebase
Function
Cloud Vision
Firestore
①画像 ②フック
③解析
④結果
⑤読み込み
Slide 21
Slide 21 text
意外と簡単！
Cloud Visionやばす
Slide 22
Slide 22 text
苦労したこと
Expoの仕様変更に
VueNativeの公式サイトが
追いついてなかった
Slide 23
Slide 23 text
苦労したこと
情報が少なすぎて
自分で考えなきゃいけない
ことが多い
設計とか
プラグインとか
Slide 24
Slide 24 text
苦労したこと
iOSで開発してたら
Android特有のバグに最後まで
気づけなかった
Slide 25
Slide 25 text
苦労したこと
楽しすぎて仕事そっちのけで
作りたくなってしまった
プッシュ通知やりたかった！
Slide 26
Slide 26 text
まとめ
・VueNative意外と簡単
・Expo最高
・Cloud Vision最高
・他のもやってみたい！
Slide 27
Slide 27 text
ありがとうございました