【ReactNative開発】ScrollViewが動作しない？！
こんにちは。今日もReact Nativeを使った開発です。 本日は、React NativeのScroll Viewに関するとラブルシューティングです。 それでは参ります。 問題 以下のようなコードを書いて、画面をSc...
ReactNativeTypeScript
ReactNativeReactNative【ReactNative開発】再レンダリングしても画像が更新されない
こんばんは。今日は、画像の扱いに関するトラブルシューティングです。 それでは参ります。 問題 ReactNativeのアプリで、画像を更新した後、更新後の画面を強制再レンダリングしても更新前の画像が表示され続けている。 ...
ReactNative【ReactNative開発】プラットフォーム(iOS/Android etc)毎に処理を分岐する方法
こんばんは。この記事では、React Nativeアプリでプラットフォーム毎に、レンダリング等の処理を分岐する方法についてまとめておこうと思います。 ちなみに、今回なんでこんな処理が実装したくなったかと言いますと、以下の...
ReactNative【ReactNative開発】入力キーボード上に完了ボタンを表示させる方法
こんばんは。今晩もReact Nativeと戦っております。今日は、入力キーボード上に完了ボタンを表示する方法について整理しておきます。 どいうことか、もう少し説明します。 React Nativeで入力フォームを作成し...
ReactNative【ReactNative開発】Functionを跨いでStateを更新しようとすると”Warning: Cannot update a component while rendering a different component “エラーが出る
こんばんは。今夜もReact Nativeと戦っております。 前置きも省略し、早速本題に参りたいと思います。 前提 以下の構成ですが、今回のエラーは単純にReact Nativeのエラーのようです。 React Nati...
ReactNative【ReactNative開発】Fetch APIでJSONをBodyにセットするとNetwork request failedエラーが発生する
こんばんは。引き続きReact Nativeのトラブルシューティングです。参ります。 前提 React Native Expo Type Script Android エミュレータでデバッグ 問題 今、React Nat...
ReactNative【ReactNative開発】フェードしながら画面遷移させる方法
こんばんは。今晩もReactNativeと終わらない戦いを繰り広げております。 今日は、画面遷移でフェードさせる方法について調べてみました。 前提 React Native Expo TypeScript React N...
ReactNative【ReactNative開発】Expo Google Sign Inをローカルでテストしようとすると”expo-google-sign-in is not supported in the Expo Client”エラーが発生する
こんにちは。会社でもらった夏休みを使って、引き続きReact Nativeと苦闘しております。 問題 React Native + ExpoでGoogle Sign Inを使うためのライブラリ”expo-go...
ReactNative【ReactNative開発】Azure Blob StorageのClientを作成しようとしたら”undefined Unable to resolve module XXXX”エラーが出る
こんにちは。今週は、１週間会社の夏休み休暇中なのですが、引き続きReact Nativeと格闘しております。今日は、Azure Storgeとの連携に際して発生した問題のトラブルシューティング。 いやあ・・かなり時間を食...
TypeScript【2021年度最新版】これからJavaScript/TypeScriptを学ぶ人におすすめの学習コンテンツ
こんばんは。今日はJavaScript/TypeScrptを学ぶために役立つ学習コンテンツをまとめておこうと思います。 私自身、今React.jsやReactNativeでアプリケーションの開発をしているのですが、土台と...
ReactNative【ReactNative開発】カスタムフォント（Googleフォント）を適用する方法
こんにちは。今日は、React Nativeのアプリに、カスタムフォントを適用する方法について整理しておこうと思います。 今回は、カスタムフォントとして、Google Fontのフォントを使えるようにします。 カスタムフ...
Functions【Microsoft Azure】Azure Functions (Node.js)でCosmosDBのDocumentをDelete(削除)する方法
こんばんは。今日は、Azure FunctionsでCosmosDBのDocumentを削除する方法についてまとめておこうと思います。（ぶっちゃけ解決方法はAzure Functionsに限った話でもないですが） いやー...
Functions【Microsoft Azure】Azure Functions (Node.js)におけるcontext.logとconsole.log
こんばんは。今日は、Azure Functionsのロギングでつまづいたポイントについて、記録に残しておこうと思います。 問題 Node.jsのAzure Functionsで、ログを残そうとconsole.log(&#...
React.js【React+TypeScript開発】画面遷移時にパラメータを渡す方法
こんばんは。今日は、React+TypeScriptのアプリケーションで画面遷移時にパラメータを渡す方法について整理しておこうと思います。 実現したいこと 以下のことをできるようにすることで、画面Bの内容を動的に変更させ...
React.js【React+TypeScript開発】最初の画面(HelloWorld)を作成する
こんばんは。今日は、ReactNativeの開発を少しお休みして、Reactでアプリ開発をしております。 ReactNative開発を始める前に少し触っていたのですが、時間が開くとすっかり忘れてしまうものですね笑 記憶の...
ReactNative【ReactNative開発】Fetch APIの戻り値がundefinedになる原因と対処法
こんにちは。今日もReact Nativeのトラブルシューティングが続きます。 問題 以下のように、fetch APIを使用する関数から戻り値を受け取るコードを書いて実行したところ、戻り値がundefinedになってしま...
ReactNative【ReactNative開発】画面遷移時に再レンダリングさせる
こんばんは。今日は、画面遷移時に再レンダリングさせる方法のメモです。 例えば、プロフィール等の更新画面で情報を更新したのち、前の画面に戻った時に更新後の情報を表示させたい、といった場合にどうにか強制的に再レンダリングさせ...
ReactNative【React Native開発】Functionでしか使えない機能をClassでも使えるようにする方法（力技）
こんにちは。今日は、タイトルの件について、対処法をメモに残しておこうと思います。 背景 もともと、React Nativeで、各コンポーネントをクラスベースで開発していたのですが、そんな時、ある機能がFunctionでし...
ReactNative【ReactNative開発】画面遷移中にNon-serializable values were found in the navigation state のワーニングが発生する
こんにちは。今日もReact Nativeのトラブルシューティングは続きます。 前提 React Native + Type Script + Expo 画面遷移にはReact Navigationを利用 問題 画面遷移...
ReactNative【ReactNative開発】パッケージのインストール時ににつける@typesとは？【TypeScript】
こんにちは。今日も今日とてReactNativeに染まる週末です。 私は今、TypeScript+ReactNativeで日々開発をしているのですが、最近、パッケージをインストールしてもimport時にNot found...
ReactNative【ReactNative開発】Error: useTheme: theme is undefined. Seems you forgot to wrap your app in
こんにちは、今週末もReactNative開発のトラブルシューティングメモです。今回は、Native Baseライブラリをアップデートしたことでハマりました・・・。 前提 React Native + Type Scri...
ReactNative【ReactNative開発】Fetch APIで画像をアップロードしようとするとNetwork request failedエラーが発生する
本日３本目のトラブルシューティングはこちらの問題です。いやーつまった・・・。 問題 前提 React Native + Type Script + Expo Android エミュレータでデバッグ 今、React Nat...
ReactNative【ReactNative開発】Native-Baseのバージョンを上げたら”Unable to resolve module native-base/Fonts/Roboto.ttf”エラーが出るようになった
こんにちは、今回もReact Native開発におけるトラブルメモです。エラーばっかりでめげそう笑 問題 Native-Baseのモジュールを直近化したところ、ReactNativeアプリが以下のエラーを吐いて起動しなく...
ReactNative【ReactNative開発】fetch APIの戻り値 (response) がundifinedになる
こんにちは。今日も今日とてReactNativeでの開発に苦しんでいます。ReactNative、というかJavaScriptの根本的なところで苦しんでいるのですが・・・笑 今日もまたひとつ躓きがあったので、記録を残して...
ReactNative【ReactNative+TypeScript開発】画像をアップロードする機能を作る（前編）
こんにちは、今日は、React Nativeのアプリ上で、画像をアップロードする機能を実装してみます。 前提 React Native (TypeScript) + Expo 画像アップロードの実装を効率化するライブラリ...
ReactNative【ReactNative開発】API呼び出しの結果が{“_U”: 0, “_V”: 0, “_W”: null, “_X”: null}になる
こんにちは。今日は、React Native (Java Scriptも同様）でのAPI呼び出しで躓いたエラーについて、解決方法と合わせて整理しておこうと思います。 問題 React Nativeで、APIを呼び出して結...
ReactNative【ReactNative開発】”Couldn’t start project on Android: No Android connected device found ….”エラーが発生
こんにちは。今日は、手短にタイトルのようなエラーが発生した時の対処方法についてまとめておきたいと思います。 どういう時に発生するか 私は、Expo+React Nativeで開発したアプリをAndroid Simlato...
ReactNative【React Native開発】Expo+TypeScript+React Nativeの最初のプロジェクトを作成する
こんばんは。今日は、Expo + TypeScript + React Nativeで最初のプロジェクトを作成するまでの手順を残しておこうと思います。こちらの記事はMac OSでの開発を前提としていますが、もしReact...
ReactNative【ReactNative開発】Expo×ReactNativeアプリをビルドする
こんばんは。今日は、Expo+React Nativeアプリをビルドする方法について整理しておこうと思います。 ビルドの前準備 最初のReact Nativeアプリをまだ作成していない場合は、以下の記事をご参照ください。...
ReactNative【ReactNative開発】Expo×React Nativeの最初のプロジェクトを作成する
こんばんは。今日は、Expo + React Nativeで最初のプロジェクトを作成するまでの手順を残しておこうと思います。こちらの記事はMac OSでの開発を前提としていますが、もしReact Nativeの開発環境が...
Profile
初めまして。
東京で働くデータ分析屋兼アプリケーションエンジニアです。旅行とカメラと江戸時代が趣味です。日々勉強したこと、趣味のことについて、自分の記録も兼ねて。
もともとは旅行記残そうと思って始めたブログですが、いつのまにか技術の話ばっかりに・・
＊記事はすべて個人の見解で、かつ記載時点の情報に基づいています。
