やってみたよVueNative

やってみたよ Vue Native 2019/11/21 @v-sendai #4 ヒツジハネタ

自己紹介高橋翔太 hitsuji-haneta LasTrust株式会社 h1tsuj1_haneta https://lastrust.io 元はフリーランスでした・ブロックチェーン証明書の発行・証明書の管理アプリの開発
（ヒツジハネタ）

ちょっと宣伝を

▪1/16(木) 19:00 ~ ブロックチェーンハンズオン ▪12/19(木) 19:00 ~ git ハンズオン

本題

Sendai Frontend Meetup の二次会にて…

React Native使ったことあります？

Vueにもありますよね。 Vue NativeとかNative Scriptとか。

知ってるけどやったことないなぁ。！

次のLTテーマ決まったでこれ

Vue Nativeとは何か？ ✋

JavaScriptでアプリ作る隊 Cordova (Ionic) ReactNative (Expo) NativeScript VueNative PWA クロスプラットフォーム！

Cordova (Ionic) NativeScript VueNative Vueに対応してる人たちビルドめんどくさそう ReactNative (Expo) 兄貴！ちょー簡単

$ npm install —-global expo-cli vue-native-cli $ vue-native init <projectName>
$ cd <projectName> $ npm run start どんな感じで作る？コンソールに出るよ！

Expo簡単すぎ

<template> <view class="container"> <text class="text-color-primary">My Vue Native App</text> </view> </template>
<style> .container { background-color: white; align-items: center; justify-content: center; flex: 1; } .text-color-primary { color: blue; } </style>

何を作った？

写真とったら画像解析してくれるアプリ

デモ

構成図 Firebase Storage Firebase Function Cloud Vision Firestore ①画像 ②フック
③解析 ④結果 ⑤読み込み

意外と簡単！ Cloud Visionやばす

苦労したこと Expoの仕様変更に VueNativeの公式サイトが追いついてなかった

苦労したこと情報が少なすぎて自分で考えなきゃいけないことが多い設計とかプラグインとか

苦労したこと iOSで開発してたら Android特有のバグに最後まで気づけなかった

苦労したこと楽しすぎて仕事そっちのけで作りたくなってしまったプッシュ通知やりたかった！

まとめ・VueNative意外と簡単・Expo最高・Cloud Vision最高・他のもやってみたい！

ありがとうございました

やってみたよVueNative

やってみたよVueNative

hitsuji-haneta

More Decks by hitsuji-haneta

Other Decks in Programming

Featured

Transcript