Firebase

firebase Auth の JWT (id token) を header に乗せて GraphQL のクエリを発行するメモ React-Query + GraphQL request で JWT token を使う方法 環境 graphql 16.6.0 graphql-request 6.0.0 @tanstack/react-query 4.29.3 import { useQuery } from 'react-query'; import { GraphQLClient } from 'graphql-request'; function MyComponent() { cons…

表題のまま。Firebase Authentication を使ってログインした際に返される user を Recoil の atom に保存すると、signout や再度 signin が実行された際にエラーになる 環境 react 18.2.0 recoil 0.7.7 firebase 9.20.0 😱 TypeError: Cannot assign to read only property 'currentUser' of object '#<AuthImpl>' 下記の例では Firebase で Google ログインを監視して useEffect 内で Recoil の us…

初めまして、GreenSnapのエンジニアの澤田です。 以前、当ブログにてご紹介したshopifyの在庫切れ通知によって、リアルタイムでどの商品が売り切れたか把握することが可能になりました。 ですが商品が売り切れる度に、担当者がshopifyにログインし在庫変更の操作をする必要がありました。 こちらが運用上の負担となっていたため、在庫切れ通知機能を拡張しslack上からshopifyへ在庫を変更できる機能を実装しました。 今回はそちらについてご紹介したいと思います。 在庫切れ通知の実装手順は下記の記事を参照ください。 greensnap-tech.hatenablog.com 仕様 在庫切れ通…

今回はiOS・AndroidでのFirebase関連の設定についてです。 Firebaseのサービスを使ってアプリを開発することは多いと思いますので、この機会にまとめようと思います。 プッシュ通知 プッシュ通知はFirebase Cloud Messagingを使うと思います。 プッシュ通知に関しては、次の記事でまとめていますので確認してください。 kumaskun.hatenablog.com kumaskun.hatenablog.com クラッシュログ調査 次にFirebase Crashlyticsについてです。 Firebase Crashlyticsはリリースされているアプリがクラ…

注意事項 この記事は、Notion AIに対して 問題と解決策の概要 例示用のコード を渡して生成した実験的な記事になります。 作ったサービス 入力した情報を元に、ブログのアウトラインと要点を生成してプレビューしてくれるサービスです。 wordy.zuki.dev かなり雑に作っているので、使い勝手がいいとは思いませんが、元々の目的は達成できたので問題ありません。 モチベーション Open AIのAPIと連携させて、ほぼ100%でJSONを吐かせる Firestore触ってみたい Firebase AuthenticationとCloud FunctionsでAPIを楽に作れるのかを確認したい…

「感謝祭クイズ！」についておさらい DX事業本部の小松です。 以前投稿した「感謝祭クイズ！」アプリ【前編】の記事では、技術構成に関する簡単な説明と、どんなアプリを作ったのかについて紹介しました。 おさらいすると、「感謝祭クイズ！」はリアルタイムクイズを開催するためのアプリです。管理画面でクイズを作り、進行画面でクイズ大会を進め、参加者画面でクイズに解答することができます。 管理画面でクイズを作成 進行画面でクイズ大会を進め、参加者画面が自動で切り替わっていく 参加者画面でクイズに解答する そんな「感謝祭クイズ！」は、主にSvelteKitとFirebaseを用いて以下のような構成で開発されてい…

「感謝祭クイズ！」についておさらい DX事業本部の小松です。 以前投稿した「感謝祭クイズ！」アプリ【前編】の記事では、技術構成に関する簡単な説明と、どんなアプリを作ったのかについて紹介しました。 おさらいすると、「感謝祭クイズ！」はリアルタイムクイズを開催するためのアプリです。管理画面でクイズを作り、進行画面でクイズ大会を進め、参加者画面でクイズに解答することができます。 管理画面でクイズを作成 進行画面でクイズ大会を進め、参加者画面が自動で切り替わっていく 参加者画面でクイズに解答する そんな「感謝祭クイズ！」は、主にSvelteKitとFirebaseを用いて以下のような構成で開発されてい…

プライバシーポリシー アプリ運営者（以下「提供者」）はアプリ利用者（以下「利用者」）の利用者情報を目標マネージャー（以下「本アプリ」）にご提供いただきます。 個人情報の管理を徹底し、利用者が安心して本アプリを利用していけるように努めます。 １お問い合わせ お問合せ時に回答返信のため利用者のメールアドレスをご提供いただく場合がありますが、これによって取得した情報を第三者に提供することはありません。 ２広告配信、クラッシュ解析 本アプリでは広告配信のためGoogleAdMob、クラッシュ解析のためFirebase Analyticsを使用しております。AdMobが広告配信のために利用者のIDを自動…

初心者がflutterでのAndroidアプリの開発で躓いた所を書きます flutterの環境構築をしていざアイデアを具現化してアプリを作ろう！ってなったときまず設計でuiを考えますが、レスポンシブデザインについてどのように対応するか考えてしまいませんか？ 特にAndroid端末は機種が無限にあり、解像度が豊富なだけでなく、機種依存の独自機能が盛り込まれていることも多いです。 ContainerやCardの親ウィジェットが配置が自由だしとりあえず殆どContainarで配置できれば楽だと思ったんですがレスポンシブに対応していません。解像度が変わると配置が全て変わってしまいます。 そのためRow…

Software Design 2023年6月号を読んで、ちょこっとずつ感想を書いてます。 gihyo.jp いつも参加しているSoftware Design輪読会に向けての予習でもあります。 softwaredesign.connpass.com 第1特集 正しく理解したい クリーンアーキテクチャとは何か？ 開発に活かせる設計のエッセンスを探る 第1章：クリーンアーキテクチャの背景 ブログ記事、書籍、時代背景から用語の意味を押さえる ......田中 ひさてる 有名な円の絵ですが…わかるようなわからないような…でした。 依存関係をユースケースから外側へ…というのが主張らしいです。 MVC、そ…

本日の気になった技術ブログ Tips リンク集です。 【Unity】VRIKとHumanPoseHandler.SetHumanPoseを併用するとプルプルする問題の備忘録 Unity BuildSettingsからシーン（Scene）の名前を取得する方法 【Unity】WheelColliderを自作した 【Flutter】Flutterの勉強アプリがリリース！ Firebase App Distribution のフィードバック機能を試してみる ウェブとアプリをまたいだトラッキングの現状とこれから 【メタバース論】仮想空間での営みは人生やアイデンティティにいかなる影響を及ぼすか UE5やC…

設計から学ぶFirebase実践ガイド 「設計から学ぶFirebase実践ガイド」発行主旨・内容紹介 「設計から学ぶFirebase実践ガイド」目次 「設計から学ぶFirebase実践ガイド」Amazonでの購入はこちら 「設計から学ぶFirebase実践ガイド」楽天市場での購入はこちら※電子書籍版です 設計から学ぶFirebase実践ガイド インプレスグループでIT関連メディア事業を展開するインプレスは、押野泰平、長谷川健史氏、岡田菜摘氏著書による、Firebaseを用いてSaaS開発を行ったノウハウを満載した一冊「設計から学ぶFirebase実践ガイド」を発売した。 押野泰平Profile…

★技術関係 ・flutter javaを学んでアプリを作りたいと思い、Javaの資格であるJavaSilverを取りましたが、元々一人で作りたいと思っていたので工数を減らせると考えチャレンジしてみました。 試行錯誤してなんとかビルドまで到達し、androidアプリをいくつか作れましたがJavaSilver合格直後の知識だけで作るのは本当に大変でした、また開発していく中で日常的に使っているアプリでも多くの工程があり、沢山の人がみんなで分担作業をすることで初めて作れるようになることに気がつきました。 １人分の時間しか投下できないので、資金と時間が必要なリッチなものを作るのではなく、リッチでなくても…

こんにちは。4月にヘンリーに入社したSWE / アーキテクト / SETのsumirenです。 弊社ではレセコン一体型クラウド電子カルテの Henry を開発・提供しています。 今回、HenryのフロントエンドをReact + ViteからNext.jsに書き換えました。 この記事では、最初にNext.jsへの切り替えによってもたらされたユーザー体験の向上について説明します。次に、このユーザー体験の向上がどうして生じたのか、その背後にある技術的な要素をエンジニア向けに詳細に解説します。最後に、フロントエンドアーキテクチャに対する我々の長期的なビジョンについて述べます。 対象読者 Next.js…

何となく個人開発のwebサービスを作成したくなってきた。細かいツールはたくさん作ってこのブログに載せてきたが、webサービスのようにちゃんとしたものは、まだ作ったことがないので。とりあえず以下の方針。 自分の仕事や生活に役に立つ ちょっとニッチな領域 シンプルな機能 なるべくフレームワークとか使って楽をする。firebase とか。 新しい技術の勉強になる こういうのは、開発中にモチベーションを保つのが大事なので、それを満たすような開発ネタを探したいと思いながら日々過ごそうと思う。

はじめに バグ修正 パフォーマンスとアセットの最適化 ブラウザの互換性 プロダクションモードでビルドする サーバーの設定 ドメイン名とSSL証明書 セキュリティの確保 CRAで個人開発する際のポイント 最後に はじめに Reactは現在、Web開発において広く使用されている主要なライブラリです。 しかし、アプリケーションを公開する前に押さえるべき重要なポイントがいくつかあります。 Reactアプリケーションを公開する前には、初心者にとっても重要な事項です。 個人開発であっても、実務でのアプリケーションを公開する手順はほぼ同様です。 したがって、Reactアプリケーションを公開する際には、実務で…

こんにちは、エンジニアの栁です。 今回は私が担当するアプリにBitriseを導入したので、こちらに記事を書きたいと思います。 Bitriseの導入を検討した背景 弊社ではソースコードの管理にGitLabを利用していたのでCI/CDもGitLab CIを使っていましたが、メンテナンスに掛かる手間と時間が課題でした。 例えば、OSのアップデート、各種ツールのインストール＆アップデート、端末の物理的な管理、端末の買い替えなどによる初期セットアップ、サーバメンテナンス時は利用不可等々。。。 考え始めると色々とありますが、そういった課題や負担を減らすためにBitriseの導入検討を行いました。 Bitr…

こんにちは。 エキサイト株式会社の三浦です。 アプリにpush通知を送る方法はいくつかありますが、FirebaseのMessaingはその中でも比較的簡単な方法の1つです。 今回は、Java・Spring Bootを使用して、Firebase Messaging経由でアプリにpush通知を送信する方法を紹介します。 事前準備 アプリケーションコード実装 最後に 事前準備 まずは事前準備として、認証用の秘密鍵を取得します。 Firebaseのコンソールの「プロジェクトの設定」を開きます。 プロジェクトの設定を開く 「サービスアカウント」のタブに移り、「新しい秘密鍵の生成」を行います。 サービスア…