react-nativeをとりあえずすぐ実機で動かしてみる

← 1日目 centos7+nginx+php-fpm+php7な新しい感じの環境を構築

potproject.net Advent Calendar 20162日目の記事です。


とりあえずreact-nativeをすぐ使いたい記事。

環境は一つ前のMacBook Proです。

https://facebook.github.io/react-native/docs/getting-started.html

とりあえずはここに沿っているだけなのでこの記事見るよりこっちのほうがいいかも。
で、ハマったところを紹介していきます。
こういうの、あまり使ったことないと時間かかったりすると思うので。

brew install node
brew install watchman
npm install -g react-native-cli

Androidビルド

export ANDROID_HOME=~/Library/Android/sdk
export PATH=${PATH}:${ANDROID_HOME}/tools
export PATH=${PATH}:${ANDROID_HOME}/platform-tools

Android SDKなんかがうまいこと設定されていればこれで準備OK。

丁寧にパスを通す方法も載ってます。やさしいですfacebook。

ちなみにANDROID_HOMEは通してなかった場合も結構あると思うので、ちゃんと通しましょう。

通さないとビルドに失敗します。ここもハマりポイント。

react-native init testreactnative
cd ./testreactnative
react-native run-android

testreactnativeというフォルダが作成され、テンプレ状態のものが作られるので、そのままビルド。
で、駄目。

A problem occurred configuring project ':app'.
> failed to find Build Tools revision 23.0.1
BUILD FAILED

どうやら、現状はbuild tool 23.0.1でしか動かないっぽい。
つーか普通に書いてあったがな。単なる見落とし。
つか普通にbuild.gradleを変更すればできる気がしますが、素直に23.0.1を入れて再挑戦。

Execution failed for task ':app:installDebug'.
> com.android.builder.testing.api.DeviceException: com.android.ddmlib.InstallException: Failed to establish session

今度はなんだろう。インストールに失敗した模様。ちゃんとUSBデバッグもやっているのだが・・・

と思ったらこれはOS特有問題で、MIUIのデフォルト設定の場合こうなるとのこと。

ちょうどMIUI8のredmi note 3 proを使っていました。

com.android.ddmlib.InstallException: Failed to establish session react-native

Developer OptionのTurn on MIUI optimizationをオフ。これは外部からのインストールを防ぐ機能なのですが、今回はそれが邪魔した模様。

testreactnative

他に、-bash: adb: command not foundとか出てたのでPATHが設定できてなかったという問題もありました。
後はAndroidもiOSも初回は起動しても表示に多少時間がかかる模様。早とちりだと見落とします。
まあいいや、次はiOSだ!

iOSビルド

react-native run-ios
reactnative-ios

iOSはXcodeの新しいものが入っている環境なら、問題なくエミュレータが立ち上がりました。

しかし、実機の場合はXcodeから実行しないと駄目なようです。

testreactnative/ios/testreactnative.xcodeprojをXcodeで開き、プロビジョニング設定後そのままRunすればOK。

特に詳しい設定もいらなそうです。ちょっと試すならこっちが楽ですね。

また時間があったら試してみます。ネタを続けるために次回に続く。


3日目→

2週間くらいSwiftを触ってみた話

swift

何故か現在SwiftでiOS開発のためよく使っているので、それに関しての雑記。

ちなみに、Swiftを2週間くらいと書いてますが、2週間前はMacすら使ったことなかったです!
なのでつまり、iOSアプリ開発自体初めてです。Objective-Cももちろんわからないです。今もわかりません。

Swiftは、Appleさんが作った新しい言語です。iOS開発のための言語と言っていいでしょう。

公式には、

Swiftは、iOS、Mac、Apple TV、Apple Watch向けのアプリケーションを開発するためにAppleが作ったプログラミング言語です。 この直感的でパワフルな言語は、今までコードを書いたことがない人でも簡単に使うことができます。 Swift – Apple(日本)

とあります。本当でしょうか。

書き方としては、kotlinとすごく似てます。元々kotlinは少しだけやったことがあったので、なんとかすんなり抵抗なく使えてます。
変数に!や?を付けるのは最初はナニコレと思うかもしれませんが、kotlinと似た感じなのですんなりいけました。
とりあえず、?はnilの可能性がある、!はnilの可能性はほぼ無しってことらしいですよ。大体Xcodeがすごく指摘してくれるのでなんとかなります。
なので、Android開発はkotlin、iOS開発はswiftとすることでかなり捗るんじゃないですかね。どっちがどっちかわからなくなりそうですが。
Objective-Cと比べれば、かなり今風な新しい言語だとは思う。でもやはりアップルの悪い癖が少しあるような言語だとも思う。

その他、使ってみてなんか思ったこと。
・変更しない変数(定数)は全部letにしないとXcodeさんから怒られる
変更しないであろう変数は全部定数宣言。
let hoge="huga"みたいな。まあ、確かにそっちがわかりやすいですな。

・ログ出力がswift1.xはprintln、swift2.0からprintに
この辺、1.xと2.xで仕様とか変わっているようです。新しく始める自分にはなんのことやら。
ググっても古いソースだと混ざっていて、最初はちょっとだけ焦ります。

・swift3.0からCっぽいfor文が廃止
for var i = 0; i < 10; i++ {}
・++や–といったCライクなインクリメントデクリメントも廃止
var i = 0
i++

これが廃止されます。なんというか、swiftは完全にCからの脱却を狙っているのかなあと思います。
やはり新しい言語は新しくわかりやすい書き方でっていうことなんでしょうか・・・
でも、多分完全に素人じゃないなら元々の書き方がわかりやすいなあ。

これらはこういう風に書き直されます。
for i in 0..<10 {}

var i = 0
i= i+1

あと、新しい言語らしく関数型っぽい書き方もできるとか。

【Swift】SwiftでC-styleのforループがなくなる話

【Swift】Swiftの++, –がなくなる話

ここで書いてるところはかなり初歩ですが、Xcodeの保管機能が優秀なおかげで割とガリガリ書けてます。
まあ、やっぱり問題点としては、当然ですけどWindowsでは使えない。
この記事もWindowsで書いているため、あまり詳しいことが書けないというジレンマ。

しかし、これで晴れてAndroid/iOSどっちもいけるエンジニアにレベルアップしました。
まだまだSwiftは新しく情報も少ないですが、iOS開発では変数名なんかはほぼ共通なので、Objective-Cのコードを見ながらSwiftで書いていけば何とか書けます。
いい言語だとは思うので、iOS開発なら積極的に使っていきたいです。

iPhone6Sを購入しました

という画像をiPhone4Sで撮ってます
メール・・・

個人的にはとてもiPhone4Sが気に入っていたので、あまり変えたくなかったのですが・・・
時代の流れとスペックには勝てなかったよ・・・
というか元がiPhone4Sなので、これももう4年前なんです。4世代もの交代を成し遂げ、
iOSのバージョンは5から9に。

最初はこんな大きいの使えるか!(iPhone4Sは3.5インチ、6Sは4.7インチ)と思っていたのですが、
次第に慣れてきちゃいました。慣れって怖いですね。

やはり最新機種ということもありかなりサクサク動き不満なんて全くありません。すごいです。
しかし、iPhone4Sを購入した当時も3GSと比べてすげー早いと言っていたので、また4年ほどしたらこれもスペック不足になるのでしょうか。
最近のスマホのスペックインフレはすごいっすなあ。一部ではもう8コア製品も出てきてますし。


grass

iPhone6Sのレビューはこれくらいとして、今回の本題としてはこちら。
中国大好きドスパラ上海問屋さんから買ってきた、中華な保護ガラスシート。

Screen Protector Glass。iPhone6用ですがデザインサイズ共に同じなのでiPhone6Sでも使えます。

こちらの製品、当然のように裏には販売元も書いてませんが、Made in Chinaだけは書いてます。怪しいです。
amazonなんかでも結構売ってますがこういう製品は賭けとしか言いようがありません。まあ、ドスパラなら大丈夫かなあ。

こちらを買ったわけは、値段です。なんと990円(税込)とお安い。(値札すら無かったけど
しかも外側を見る限り結構な高性能で、9Hガラス製、厚さ0.2mmと結構薄い。
・・・まあ、本当にガラスなのかは調べず貼ったのでわかんないんですが
iPhone5s用の強化ガラスフィルムを買ったらガラス製じゃなかった件

そして、目玉であるタッチ個所を追加して戻るボタンとして使えるようになります。下部の場所を読み取り、上部の戻るボタンを押したこととして反応するようになります。
amazonでも1000円以上するので、多分最安だし、保護シートを探してたので、せっかくだしということで。

こちらの商品、安いですが、中身に拭き取るための布、ウェットシート、ドライシートがついていてかなり親切でした。
戻るボタンの反応は・・・ちょっと押し込まないといけないですがちゃんと反応します。それはいいんですが
その犠牲として一部、絶対に押せない個所が上部にできてしまいます。
ゲームなんかを頻繁にする人はこれ、たまに致命的欠陥になりえますのでそれが怖い人はやめたほうがいいでしょう。

以上。使いこなしていきたいですね。