自分メモ

dayjs.duration().format()で24時間以上を正しく扱う

やりたかったことはss秒をHH時間MM分という形式に変換して表示したかっただけ。 dayjsのdurationプラグインを使用して最初はこんな風に実装していた。 function formatDuration(seconds: number): string { return dayjs.duration(seconds, 'seconds').forma…

OpenStreetMapとNominatim APIで行政区の境界線を取得する

市や区の境界線の座標情報をJavaScriptで取得したいと思ったのでそのメモ。 今回はOpenStreetMap(OSM)を使ってやる。 OSMにはNominatimというものがあり、これが住所によるOSMのデータ検索やその逆を提供してくれます。詳細はこちら。 JA:Nominatim - OpenSt…

Google CloudのAPIキーからプロジェクト番号を確認する

メモ代わりの小ネタ とある事情でGoogle CloudでAPIキーはわかるけどその持ち主のプロジェクトが不明という状況が発生して困っていたところ、Twitterにて以下のコマンドでわかると教えてもらいました。 gcloud alpha services api-keys lookup <API_KEY> Google Cloud</api_key>…

【挫折】React NativeでカーナビみたいなUIを実現してみる【未完】

メモです。でも結論からするとうまく行かずに挫折。この投稿はその失敗の記録である。 はじめに タイトルどおりなんですが、Mapboxにはカーナビみたいなturn by turnのナビゲーションを実現するためのNavigation SDKというものが存在しています。でもiOSとAn…

【SQL】月別で集計するときに値がない月は0と表示したい

SQLに関するメモ。前提としてPostgreSQLを使っています。 以下のようなTimestamp型で日時の情報を持つテーブルがあるとする。 id: integer timestamp: timestamp with time zone 1 2022-01-01 00:00:00+00 2 2022-02-01 00:00:00+00 3 2022-10-01 00:00:00+0…

MapboxのDirections APIを試してみる

メモです。 Mapboxというのは地図情報のサービス。地図の点だけで言えばGoogle Mapとかと同じようなものと言えば同じようなものなのだけどカスタマイズ性の高さとビジュアライズ周りに強みがあると思っている。なので地図をベースにしたいろんな表現が可能に…

React Nativeで開発中にローカルサーバにアクセスしたい

久しぶりのReact Nativeの小ネタ React Nativeでアプリを開発していてシミュレータなり実機でデバッグするときにローカルで起動したAPIサーバにアクセスしたいときってあると思う。 axiosなりfetchでの接続先を単にlocalhostとかにしてあげればつながるかと…

Nest.jsで認可処理を実装したい

今作ってるAPIでは初めてNest.jsを使ってるんだけど、認可処理をどうしようかと考えたのでそのメモ。 ちなみにこの投稿では簡単な定義として認証(Authentication)とは利用者の本人確認、つまり通信の相手が誰であるかの確認とする。一方、認可(Authorizatio…

令和時代のページネーションを考える (REST API編)

今回はバックエンドAPIでページネーションをどうやるかについての話なので、よくある無限スクロールUIのようなフロントエンド側の実装に関する話はしない。あくまでもAPI、もっと言えばRESTfulなAPIのリクエスト・レスポンスにおけるページネーションの話。 …

既存のデータベースでPrisma migrateする。しかもPostGISを使う

既存のデータベースをPrismaでマイグレーションできるようにしたくなった。理由はいろいろあるがやはりローカル環境 → 開発環境 → ステージング環境 → 本番環境へとDBの定義を反映していくのが手作業はさすがにないなと思えてきたからだ。もちろん実際には毎…

脱Firestoreするために考えていること(追記あり)

FirebaseのFirestoreをやめることにしたので雑なメモを残しておく。なお、まだ走り始めたばかりなので、内容には間違いや考慮不足も多数含まれる可能性があるので読む人はその点注意を。あと、あくまでも雑なメモなので細かいところは書いていない。 なぜ脱F…

一意な識別子の生成でUUID/ULID/CUID/Nano IDなど検討してみた

最近、一意な識別子について検討することがあったのでその検討メモ。 一意な識別子とは つまり、重複しない、ユニークな識別子(Identifier, 以下id)のこと。ここではRDBのテーブルにおける主キーとして使うことを想定かつ前提としている。したがって、主キ…

AWS AppSyncのスキーマ情報からAmplify以外の方法でTypeScriptの型を生成する

メモです。 最近、GraphQLを使い始めた。AWSのAppSyncを使っている。 GraphQLではスキーマの情報をschema.graphqlとかschema.jsonとかってファイルで定義する。AppSyncをマネージメントコンソール上でポチポチと作った場合もこのファイルがダウンロードでき…

Ubuntuのコンテナにwatchmanを頑張って入れる

メモです。 元はServerless Frameworkでserverless-appsync-simulatorとserverless-offlineを使おうと思ったら Error: spawn watchman ENOENTっていうエラーが出て起動できず、ぐぐったらwatchmanをインストールすればいいってことでその対応。 MacならHomeb…

Remote Container 間で通信する

Remote Containerで実行している環境間で通信をする場合についてのメモ。 状況としては開発中のプロジェクトAとプロジェクトBがあって、それぞれ同じマシン上でRemote Containersを使って開発をしている状況。 プロジェクトAがREST APIを提供するプロジェク…

react-intlでReact Nativeアプリの国際化対応をする

はじめに だいぶ前にReact Nativeで開発中のアプリを国際化するにあたってreact-intlを使ったのでそのあたりのメモをブログに書いていたが、下書きのまま公開していなかった。今回、改めて別のアプリで同様のことをする必要があって過去の自分の下書きを見つ…

Amplify ConsoleでCORSの設定を行う

AWSのAmpify ConsoleでCORSの設定が必要になったんだけど、やり方についてググっても意外とドンピシャな情報がなかったのでメモ。 結論から言うと特段それようの設定があるわけではなくベタにヘッダを指定するだけだった。これはAmplify Consoleのカスタムヘ…

huskyとlint-stagedでコミット前に確実にLintを実行していく

はじめに コミット前にlint系のチェックをしたいケースってあると思います。特にチーム開発とかの場合、全員がlintをちゃんと実行してほしいとかあるかと。そういったときのためにコミットのタイミングでlint系のコマンドを実行するための仕組みとしてhusky…

Amazon Cognito Identity Poolの外部プロバイダとしてFirebase Authenticationを使う

はじめに AWSには認証・認可のサービスとしてAmazon Cognitoというものが存在します。ややこしいのですが、認証のためのコンポーネントがAmazon Cognito user pools(以下、user pool)で認可のためのコンポーネントがAmazon Cognito identity pools (以下、id…

React NativeでAWS Amplifyを使わずS3にファイルアップロードしたい - マルチパートアップロード編 -

はじめに マルチパートアップロードをするには さっそく実装する まとめ ソースコード はじめに こちらの投稿の続きにあたります。 React NativeでAWSのS3にファイルアップロードする処理を実装するにあたり、AWS Amplifyを使わずにAWS SDKを使って実装しよ…

React NativeでAWS Amplifyを使わずS3にファイルアップロードしたい

はじめに AWS Amplifyでアップロードする場合 なぜAWS Amplifyを使わずにアップロードしたいのか さっそくReact Nativeからアップロードしてみる 実行 まとめ ソースコード はじめに AWSのS3にファイルをアップロードするにあたり、今だとAWS Amplifyを使っ…

AWS Amplifyを使ったReact NativeなアプリをBitriseでビルド

はじめに 今回、React Nativeで開発しているとあるアプリでAWS Amplifyを使ったのですがBitriseでビルドしたりチーム開発で使うにあたってちょっと困ったりしたのでメモ。 はじめに 前提 なぜAmplifyを使ったか Bitriseでビルドする ではどう対応するか Bitr…

New Relic CodeStream をNext.js & Remote Containersな環境で使ってみた!(だが時間切れで断念した => できてました!)

本記事はNew Relic Advent Calendar 2021の8日目です。結論から言うとタイトルにある通り時間切れで挫折しました。 なのでここからのブログの内容は最終的に時間切れで挫折に至るまでの戦いの記録です。あまり参考にはならない。 => 見るべき場所を間違って…

BitriseでCocoaPodsのバージョンが古くてBuildが失敗するときは

React Nativeのアプリを開発してるんですが、そのビルドにBitriseを使ってます。 最近、そのプロジェクトにFirebase Analyticsをセットアップしたんですが、その際にCocoaPodsのバージョンが古いと言われてアップデートしていました。 さて、そのプロジェク…

Macで使うVS CodeとRemote Containerの性能を大幅改善

はじめに なぜ遅いのか 何をやるのか 計測 名前付きボリュームを使ってない場合 Named Volumeを使う場合 Macからどう見えているか 結論とまとめ はじめに 以前からいろんなところで話していますが、僕は普段、手元のMacには言語系のランタイムとかは入れてお…

React NativeでMapboxを使ってみる

メモです。 これまでReact Nativeでの地図として、react-native-mapsを使ってきた。これを使うとiOSではAppleのMap、AndroidではGoogle Mapsで地図が表示される。 地図そのものの表現はこれでも特に問題はなかったものの、ビジュアライゼーションとかナビゲ…

React Navigationで画面遷移時に再レンダリングする、しかも簡単に

ちょっと悩んだのでメモ。 まず、画面AとBがあってA→BにReact Navigationを使って遷移しているとする。 AにはとあるXという値が表示されていて、変更ボタンを押したらBに遷移してBでXをY変更したらAに戻ってくる、みたいな状況。 そして、Aに戻ってきたとき…

patch-packageでnpmにパッチあてる。しかも簡単に

React Nativeのアプリにとあるライブラリを入れたところビルドが失敗するようになってしまった。 実はこのライブラリってのがもうあまり活発に動いていないライブラリなんだけれど、同様の機能を持つ有償パッケージを入れるか、自前で作るかみたいな事情なの…

Remote ContainersのNode.js環境でGitの補完を設定する

小ネタ。 知ってる人も多いと思いますが、GitにはGitのコマンドやブランチ名のタブ補完ができるような設定が同梱されてます。 それを自分が使ってるMacとかの開発マシンに設定するだけですぐに使えるようになって便利なので設定していきます。 ただ、MacやWi…

VS Codeで執筆環境を整えるメモ

自分メモです。 Visual Studio Codeで記事や書籍等を執筆するにあたっての環境を久しぶりに整えようと思ったのでせっかくならまとめておこうと思います。 vscode-textlint vscode-textlint は著名なテキスト校正ツールであるtextlintをVS Code上から実行する…

©Keisuke Nishitani, 2023   プライバシーポリシー