React Nativeで複数画面の共通変数管理

ReactNativeで複数画面間の共通変数を扱うことを考える。

共通の定数ならグローバルで用意して読み込めばいいけど変数は少し厄介だった。

複数画面の管理はReact Navigation、設定保存などにはAsyncStorageを使う。

React Native 0.60 Expo v34 react-navigation 3.12.0

続きを読む React Nativeで複数画面の共通変数管理

React Native, Expoでアイコンを使う

Expo Managedでアイコンを使ったり、アイコンを含めたボタンを作成します。

参考にしたリンクは以下。

React Native 0.60 Expo v34

続きを読む React Native, Expoでアイコンを使う

React Native, ExpoでドラムロールUI入力

モーダルを出さずにくるくる回して設定するUIをExpoで使いたい。

マザー2の影響かドラムロールUIって言ってしまいますが、一般的にはwheelらしいです。spinnerって言ってるのもありましたが、これは他にも色んな意味を指しすぎなので使いにくい(ローディング、時計など円状のUI、数値入力の横の▲▼など)。

続きを読む React Native, ExpoでドラムロールUI入力

React Native, Expoで端末内の画像取得と保存

画像系のアプリを作ろうと思ったら、端末の画像を読み取ったり保存したい。

出来たらExpoで完結したいので色々方法を調べてみた。

制限に沿わない場合はワークフロー見つつBareに切り替えることも考える。

React Native 0.60 Expo v34

続きを読む React Native, Expoで端末内の画像取得と保存

React Native, Expoを使ってみる

React Nativeを使ってアンドロイドのテストアプリを作ってみます。

ネイティブな部分は後回しにするとしてExpoを使って簡単に。

続きを読む React Native, Expoを使ってみる

javascriptでメタタグの作成と編集

HTMLヘッダ内のメタタグ(<meta name="" content="">)を編集(ない場合は作成も)をするスクリプトを書いてみました。

以前にOGPなどの外部表示設定を確認したのでスクリプトで動的に変えてみたかったのが理由です。

ただツイッターなどのサービスではOGPのためのアクセスでスクリプト実行までしてなさそうなので、サーバーサイドで書き換える必要があります。

なので今回のスクリプトはnode.js向け、あるいはタイトルのみの編集向けです。

続きを読む javascriptでメタタグの作成と編集

ReactでDataTablesを使う

Reactアプリ内でjQueryプラグインのDataTables.jsを使うためのメモ。

ReactとjQueryはあまり相性が良くないので$は最低限使うだけです。

合わせて使う方法からコンポーネント化まで。

続きを読む ReactでDataTablesを使う

【GO】gin+Reactのルーティング

Golang製Web Framework「gin」とjavascriptライブラリ「React」を合わせてウェブサービスを作ることを考えます。

ルーティング部分でちょっと詰まったので覚書き。

続きを読む 【GO】gin+Reactのルーティング

GO→WebAssembly→React→Cordova

前回やった内容で「golang webassembly」と検索してもあまり情報がなかったけど、ReactやCordovaとWebAssemblyの組み合わせは全く出てこなかった。

React+Cordovaでアプリを作るテストもしていたので、せっかくだから手探りでアプリ化までしました。

今回はその備忘録です。

続きを読む GO→WebAssembly→React→Cordova

Reactで非同期処理をするタイミングと画像キャッシュ対策

ファイル読み込みや書き込みなんかの非同期処理をするときにReactだとどこに書いていいかわからないことがあります。

読み込みに関してはcomponentDidMountなどで呼び出せば配置後に1度だけ呼び出すことはできますが、更新処理でちょっと困ったのでメモ。

続きを読む Reactで非同期処理をするタイミングと画像キャッシュ対策