React-Native( Expo )を使って作るアプリ開発の導入方法

アプリのインストール

まず初めに、Expoを使うのでスマホにExpoの公式アプリをインストールする。
インストールしてアプリを起動すると、アカウントを作るように言われるのでアカウントを作成する。

アプリのひな型を作成

作成したら次に、コンソールでnpmを使ってcreate-react-native-appをインストールする。


$ > npm i -g create-react-native-app

次に任意のフォルダーに入って、react-nativeのひな型を作成


$ > cd 任意のフォルダー
$ > create-react-native-app 任意のプロジェクト名

typescriptを使う場合は、以下を実行


$ > cd 任意のフォルダー
$ > create-react-native-app 任意のプロジェクト名 --scripts-version=react-native-scripts-ts

アプリを実行

上記で、ひな型を作成したら作成されたフォルダーに入って npm start をする。
するとコンソール上QRコードが出てくるので、それをスマホのカメラを使ってスキャンする。


$ > cd 任意のプロジェクト名
$ > npm start
/*
* ここのQRコードをスマホのカメラを使ってスキャンする
*/

QRコードをスキャンするとさっきインストールしたExpoのアプリが起動するので、そこでcreate-react-native-appで作成されたアプリを実行することができる。

デバッグ方法

デバッグなどは、スマホを振ると管理画面が出てくるので一番下にあるDebug Remote JSをクリックするとPC側でブラウザが起動するのでそこでデバッグすることができる。

設定や便利なnpmモジュール

vsCode

React Native Tools

npmモジュール

HerokuでSendgridのアドオンを設定するのにハマったので備忘録

  • SendGridのアドオンを追加するにはクレジットカード登録が必要
  • 環境変数のSENDGRID_NAME、SENDGRID_PASSWORDを先に設定しない
  • 先にSENDGRID_API_KEYを設定する

SendGridアドオン設定手順

  1. まずSendGridでAPIキーを作成、コピーする
  2. Heroku管理画面で、Settings > Config Vars で 環境設定のSENDGRID_API_KEYにさきほどコピーしたAPIキーを登録する
  3. Heroku管理画面で、Resources > Add-onsにSendgridを入力して一覧に表示された選択する
  4. Provisionのポップアップができるので、Provisionを押す
  5. 完了する

この時点でSENDGRID_NAME、SENDGRID_PASSWORDが設定されている

[Unity] AndroidでMeshFilterを生成するとFPSが下がる

Unityで、MeshをPointで生成しようとして以下の処理をスクリプトに記述。
Androidでビルドして実機確認したら、FPSが物凄く低下した。

MeshFilter meshFilter = GetComponent();
meshFilter.mesh.SetIndices(meshFilter.mesh.GetIndices(0), MeshTopology.Points, 0);

上記の処理が無い時のFPSは60FPS前後であるのに対して、
ある場合は、3FPSにまで低下した。

※原因がわかり次第記事にします。

herokuにGoogle domainsのドメインを設定する

Google Domains + HerokuでSSL通信を使ったオリジナルドメインサイトのための設定のための設定
https://qiita.com/hidehiro98/items/b1bf98e0921b0d47e2c2

こちらを参考に設定。

たぶん複数のappがある場合は、heroku cliで、


heroku domains:add www.yourdomain.com --app appname

と直接設定してあげる

追記:

Herokuに独自ドメインのSSL接続を無料で導入できるようになった話(有料Dynoのみ)
こちらの手順でSSLを有効にしてあげる

Unityのコード編集にVSCodeを使う

VSCodeがとても使いやすくて、「UnityでもVSCodeつかえないかなぁ・・・」っと思っていたらやっている人いたので自分もやってみることにした。

参考記事
今日からUnity + Visual Studio Codeを用いた快適な開発生活(随時更新中)

VSCodeでの設定

i. VSCodeの拡張機能から、以下のプラグインをインストールする。

ii. VSCodeのデバッグアイコンから歯車をクリックしたら、Unity Debuggerを選択。

操作説明

Debugger選択

デバッグするときにUnity Editorを選択するとデバッグできる。

Debug選択

iii. UnityからEdit -> Preference -> External Tools -> External Script Editor をVSCodeに変更。

iiii. 以上!

REALSENSE D415 を使ってUnityでモーションを取るまでのセットアップ

※今回はWindowsの説明だけしかしません。その他のOSは以下を参照↓
http://download.3divi.com/Nuitrack/doc/index.html
https://github.com/IntelRealSense/librealsense

モーションを取るのには、公式のSDKでは難しそうなので、NuitrackというSDKを使います。

公式のSDKも入れておいたほうがいいので、入れときましょう。
公式SDKのgithub
公式SDKのインストールファイル場所

公式SDKを入れたら、次にNuitrackを入れて行きます。

まず最初に、Nuitrackから、自分のOSにあったものをダウンロードしましょう。有料版と無料版があります。

無料版

有料版

ダウンロードしたら、次はインストールをしましょう。

ダウンロードしたファイルを解凍すると、OpenNI~~~ というインストールファイルがあるのでそれを実行してインストールします。

インストールが完了したら、次に解凍したファイルの中にnuitrackというフォルダーがあるのでそれをC:\直下にコピーします。( 人によっては D:\ )

コピー出来たら、今度はそれにPATH(環境変数)を通します。

PATHは二つ入れます。
一つは、” NUITRACK_HOME ” という名前で、値を C:\nuitrack にして環境変数にいれます。

もう一つは、環境変数のPathに C:\nuitrack\bin を追加してください。

以上でPathの登録は終了です。

次にUnityのSDKを入れます。
以下のDownload SDK and SamplesをクリックするとSDKをダウンロードできます。

ダウンロードしたら今度はそれを解凍したら、その中にある ” NuitrackSDK.unitypackage “をUnity(2017.3.1f1)にインポートしましょう。

以上でセットアップの完了です。

Firebase Hostingに Google Domains でサブドメインを設定する

ここからFirebase
1. Firebase の Hostingにもろもろデプロイする
2. Firebaseコンソールに入って、Hostingを選択
3. ドメイン > ドメインを接続
4. 設定しようと思っているサブドメインを入力(sub.mydomain.com)、「次へ」をクリック
5. Aレコードタイプが2つ表示される

ここからGoogle Domains
6.mydomain.comのDNSを選択
7.カスタム リソース レコードの@にsubを入力
8.カスタム リソース レコードのIPv4アドレスに、先ほどのFirebaseのAレコードタイプの1つ目のIPアドレスを入力
9.次に入力したIPアドレスの右にある「+」をクリックして入力枠を追加
10. 追加された入力枠に2つ目のIPアドレスを入力

ここからまたFirebase
11. ドメイン接続画面の「終了」をクリック
12. Hostingに戻ると、ドメイン欄のsub.mydomain.comのステータスが保留中に変更してあれば完了

Algoliaでネストされた値をフィルタリングする方法

Algoliaでindexからネストされた値をもとにフィルタリングするには、

AlgoliaのダッシュボードにあるdisplayタブにあるFaceting項目のAttributes for facetingに下のようにフィルタリングしたい値を設定して、

※ダッシュボードの変更は、セーブしないと適用されないのでちゃんとセーブしましょう。セーブボタンは、右上あたりに出てると思う。( 多分 )

index.search({
    facetFilters: ” ここにダッシュボードで設定したキーをいれる”
},
(err,content) => {
    if(err) throw err;
    console.log( content );
});
のように、facetFilters:” 設定したキー”で、フィルタリングした値が取れる。

[xcode] フレームワークの実機ビルドエラーとitunes connectのリジェクトを回避したときのメモ

carthageで入れたいくつかのライブラリで、実機ビルドでエラーがでたり、エラーを回避してもiTunes Connectでリジェクトされたりして、ハマったのでメモ。

SwiftyDropboox.framework
SocketIO.framework
Starscreem.framework

あたりをCarthageでいれてる。いろいろやったのでどれが効果があったのかはっきりよく覚えてないので、やったことをメモ。

Alamofire.frameworkで実機ビルドでエラー
=> Embedded FrameworkにAlamofire.framework追加して回避

Alamofire.frameworkがiTunes connectでリジェクト
=> Embedded Frameworkから外して、Run scriptでコピーで回避
=>Alamofire.frameworkのswiftmoduleからi_386,x86_64を削除