ReactNative

僕の場合、Expoでアプリを開発する時は、Firebaseを使うことがほとんどである。認証周りとかFirestoreとか便利だし。 ただ、それぞれ別々のリポジトリとして管理していると、いちいちフォルダ間の移動が大変だったりどこにどのファイルを作ったかを忘れたりと面倒なことが多々起こる。ファイルを探すのに指を使うのはエネルギーを消費するので、極力疲れることは避けたい。 なので、monorepoとして管理できたら、たびたび発生するめんどうくさい問題は解決するのではないかと考えた。 いろいろ調べた結果Lernaを使うと良いらしいことがわかったので、今回はLernaを用いてExpoとFirebaseの…

androidでビルド時に Failed to apply plugin 'com.android.internal.application'. Android Gradle plugin requires Java 11 to run. You are currently using Java 1.8. が出て、 この辺のもできない場合、 ここにあるように11をbrewでインストールして設定すると直る。

ReactNavigationを使うと上下にタブを作ってくれるが、これがあるとDimensionsで取れる高さは変わるのか気になったのでメモ。 使用機種はIPhone11 import {Dimensions} from 'react-native'; const {height} = Dimensions.get('screen'); console.log(height); 結果どちらも896 変化はなかった。

こんにちは、株式会社カミナシのエンジニア @imu です。 はじめに テスト駆動開発(以下、TDD)は知っているけど、業務でTDD使ってみようと思ってもリリースに追われてしまい、時間が取れなかったりしてチャレンジ出来ていませんでした。今回は時間に余裕があったのでTDDを実践してみました。 環境構築 ExpoCLIのインストール npm install -g expo-cli インストールが終わったらひな形を作成しましょう。 今回はManaged workflowのblank（TypeScript）を利用します。 expo init tdd_regexp テストのパッケージをインストール 公式ド…

day.js インストール yarn add dayjs github.com day.jsの設定 下記の処理はdayjsを日本時間に設定するための処理 import dayjs from 'dayjs' // dayjsの タイムゾーンの設定 dayjs.extend(require('dayjs/plugin/timezone')) dayjs.extend(require('dayjs/plugin/utc')) dayjs.tz.setDefault('Asia/Tokyo') カウントアップする処理 下記の２つの関数を利用してカウントアップする処理を実装している var countD…

参考記事 AsyncStorageは非推奨らしいので使う際はお気をつけて. reactnative.dev コード 利用するためにパッケージをimportする import { AsyncStorage } from "react-native" 下記はローカルにデータを保存するための関数 const setStoreData = async (key, value) => { try{ await AsyncStorage.setItem(key, value); }catch(error){ console.log(error); } } 起動時にデータを取得してデータが存在しなかったらデ…

参考ページ 下記のパッケージを利用すると簡単にQRコードを生成することができる github.com インストール yarn add react-native-svg react-native-qrcode-svg コード import QRCode from 'react-native-qrcode-svg'; // QRコードに表示するアイコンを指定する let logoCatFile = require('../assets/cat.png'); <QRCode value={ `http://www.yahoo.co.jp/?${ uuid }` } logo={logoCatFile…

ReactNativeのリリースビルドでタイトルのようなエラーが出て対処したのでメモ。デバッグビルドでは出なかった。 これはどうやらReactNative0.63.3で発生しているエラーっぽくて、自分もモロ0.63.3を使っていた。 使用しているわけではないが、このgithubに書かれている対処法を参考にした。 PROJECT -> Build settings -> Library Search Pathsの "$(TOOLCHAIN_DIR)/usr/lib/swift-5.0/$(PLATFORM_NAME)" の中のswift-5.0を swift-5.3 に変更する。 ただ、たぶんR…

ReactNativeでタイトルのようなエラーが出たのを対処したのでメモ。 TARGETS -> Build Phases -> Copy Bundle Resorcesからエラー出てるファイルを全て - で削除する。

はじめに キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました！ はじめに React Native アドベントカレンダー 2021 Hermes がデフォルトになるために React Nativeへの最適化 Fabric用の新しいガーベッジコレクターの構築 パフォーマンス上の問題点を克服 垂直統合の先駆者 コミュニティ全体を巻き込む サマリ Recoil v0.5 release Hook for refreshing selectors Atom effect improvements Loadable factories JavaScript用…

ReactNativeでwebのGoogleMapを使う必要があったのでそのメモ。 セットアップ yarn add react-native-webview cd ios pod install // android/gradle.propertiesに以下2行追加 android.useAndroidX=true android.enableJetifier=true 使用 <WebView source={{ html: `<iframe src="<url>" width="100%" height="100%"></iframe>`, }} /> iframeを使う必要があったので s…

はじめに 概要 インターン活動内容 内定者アンケート ・就活中に感じたREAZONのイメージ ・最終的にREAZONを選んだ決め手 ・メインのプログラミング言語や分野 ・短中期的に習得したい技術や分野、言語など ・どういうエンジニアになりたいか ・今後の目標 インターンへの追加アンケート ・インターン参加後のREAZONの印象 ・インターン自体の印象 ・未来の就活生やインターン生へのメッセージ 最後に はじめに こんにちは！menuバックエンドエンジニアの渕上です。 僕は22卒内定者として、7月8月と内定者インターンをしたのち、9月より早期正社員登用を受けて現在menuに所属しております。 先…

react-native を触っているがちょいちょい詰んでるので、各情報の備忘録としてここに保管しておく。 ※随時更新 www.virment.com blog.ryou103.com qiita.com github.com reactnative.dev github.com

えにあです。 WindowsでReactNative入門～アプリ開発編～の3日目です。 前回はコードを修正するための前準備として、アプリのエントリポイントの変更を行いました。 今回は実際にアプリを修正していきます。 今回の目標 ニュースの一覧画面を作成する処理を分割して考えると、以下のようになります。 News APIからニュースを取得する 取得したニュースの件数分ループを回す ニュースを1件ずつ表示する 今回は1の部分を実装します。 News APIのアカウント作成 まずはNews APIの公式サイトでアカウントを作成します。 newsapi.org 諸々入力して、利用規約に同意してSubm…

えにあです。 WindowsでReactNative入門～アプリ開発編～の2日目です。 前回は空のアプリケーションを作成し、エミュレータ上で以下の画面が表示されるようにしました。 今回はプロジェクト構成の理解と、ディレクト構成の変更を行っていきます。 目次 環境 プロジェクト構成の理解 1. App.tsx 2. app.json 3. assetsディレクトリ 4. node_modules 5. babel.config.js 6. package.json 7. tsconfig.json ソースコードのディレクトリを変更する package.jsonの変更 ソースコードの移動と修正 ま…

北原です。10月2日に React Native Matsuri 2021 にて React Native in Nature というタイトルで発表を行いました。 reactnative-matsuri.com Nature では2018年当時に iOS, Android それぞれ開発を行なっていましたが React Native を用いた開発に移行しました。 当時の話や、最近行った hermes への移行の結果などについても話しました。 speakerdeck.com こちらは hermes 移行時の内容です。Android 64bit 対応を行った後から Android JSC の中で起動…

表題の通りのことをしようと思ってたんだけど、いまいち使いづらいだけのモノになりそうな気がしたのでちょっとコードだけ整理して一旦ここで供養としておこうと思う。 flutter desktopで複数ウィンドウ開くためのアレコレをしてみたけど使いづらい感じのサムシングという感じに落ち着いてしまった— kyusuke (@8140i2865_3) 2021年9月29日 21.10.02時点でflutterはレンダリングエンジンの都合で複数ウィンドウに対応していないっぽいんですけど、各プラットフォーム側でゴニョゴニョすればそれっぽいのが出来るみたいだったので試してた macosで実現できればいいかなって…