概要 以前、iOSでショートカット経由で共有シートからAPIを実行する方法を紹介した。今回はそのAndroid版をまとめる。 www.wheatandcat.me Androidでは Web Share Target API を実装するのが手軽なので、PWA化したWebサイトに組み込んで検証した。 Web Share…

Expo SDK 54にバージョンアップ + Expo GlassEffectを試してみる 概要 Expo SDK 54 がリリースされたので移行し、合わせて iOS の Liquid Glass 表現と expo-glass-effect を試した内容をまとめる。 PR github.com Expo SDK 54 expo.dev 実装 以下のコマンド…

概要 Claude Code の登場以降、自分専用の作業スクリプトや小さなアプリを作る機会が増えた。 スマホのブラウザで開いている URL を直接保存・参照したい場面があるが、iPhone から他サービスへ情報を渡すには Share Extension か App Extension の実装が必…

概要 前から対応していた memoir の最新化は無事リリース完了。 まとめ記事を Zenn に投稿したので詳細は以下も参照。 zenn.dev リリース後に「画面下部のボタンとナビゲーションボタンが重なって操作できない」という問い合わせが入り、原因を特定して修正…

概要 Expo SDKを最新版へ上げたところ、Androidで Edge‑to‑Edge がデフォルト有効化。 その影響で Expo Router のヘッダーが描画されなくなった。挙動を整理して対処した内容を残す。 Edge‑to‑Edgeとは Edge‑to‑Edgeを有効にすると StatusBar 領域までアプリ…

概要 Replit を契約していると毎月 25 ドル分のクレジットを使い切らないともったいないという心理が働き、結果として毎月アプリを作るルーティンが発生する。 今月は "GraphQL Client" アプリを作成。AI に実装を任せたところ、ローカルで起動した GraphQL …

概要 最近、AI系ツールで遊んでいたら失敗も含め学びがあったのでメモとして残す。 作ったもの リポジトリ github.com スクリーンショット アプリの説明 入力は Markdown。チェックボックス (- [ ]) を付けるとタスクとして認識 チェックボックスを ON にす…

概要 個人開発しているアプリをExpo SDK 52 → 53にバージョンアップした時に数点ハマった箇所があったので記事にする。 PR github.com Expo SDK 53の変更点 詳細な内容は以下の記事を参照。 expo.dev 影響があった主な変更点は以下の通り。 ベースのネイティ…

概要 Expo SDK 53が出たのでアップデートしたら、合わせてReact 19にアップデートされた。 以前から使用していたRecoilはReact 19をサポートしていないので、Zustandに移行したので記事にした。 github.com PR github.com Zustandとは zustand-demo.pmnd.rs …

概要 expo-router導入時に一旦Storybookは考慮せずに実装していた。 今回、storybook v6からv8へのバージョンアップと、expo-router対応の再導入を行ったため記事にまとめる。 PR github.com github.com 使用バージョン Expo SDK: 52 expo-router: 4.0.19 実…

expo-router に移行した際に、モー遷移を導入したので実装内容を共有する。 PR github.com 背景 expo-router による通常の画面遷移では、以下の画像のように左側から新しい画面がPushされる形式になる。 この形式だと、画面下部に配置されたボタンを押した際…

概要 以前はexpo/sentry-expoを使用していたが、Expo SDK 50以降で非推奨となった。現在は@sentry/react-nativeを使用する必要があるため、その手順を整理。 PR github.com github.com 実装 ローカル起動時の実装 以下の公式手順に従って@sentry/react-nativ…

過去にExpoでGoogleログインを実装したが、Expo SDK52では実装方法が変わっていたため、改めて記事にまとめる。 www.wheatandcat.me PR github.com 実装 使用するライブラリ 前回の実装からの移行方法を記載する。元の実装については以下の記事を参照。 www.…

概要 過去に開発していたmemoirを、最新のコードベースにリニューアル中。その途中経過をまとめる。 github.com アプリはExpoで開発。最新化に伴い以下を修正中。 Expo SDK 48 → 52にバージョンアップ ナビゲーションをReact Navigation → expo-routerに移行…

前回の記事では、バーコードを用いて商品画像を取得する機能を実装したが、以下の課題が浮上した。 バーコードから商品情報を取得できないケースがある バーコードが外箱に記載されており、画像から取得が困難な場合がある これらの課題を解決するため、OCR…

アプリの画面数が増えると、ホットリロードが効かない画面が出てきてUI改修が難しくなることがある。その対策として、Flutter版StorybookであるWidgetbookを導入した。以下にその実装内容をまとめる。 導入したPR 実際の変更内容は以下のPRを参照。 github.c…

Firebase App Checkへの対応について、 Firebase App Distributionで配信したアプリにApp Checkを対応させる際、いくつかハマりポイントがあったので記事にた PR github.com github.com 実装 Firebase App Checkを実装 firebase.google.com Firebase App Che…

引越しをしていて間が空いてしまったが、次から通常の更新頻度に戻る予定 在庫管理アプリの開発で商品の画像取得に商品検索（v3） - Yahoo!デベロッパーネットワークのAPIを使ってみたので紹介 PR github.com github.com 実装 実装のイメージは以下の通り - …

開発中のアプリでデータ共有で招待QRコードを発行して、スキャンでゲストログインできる仕組みを実装したので記事化 PR github.com 実装の概要 backend/アプリのゲストログインの実装 ゲストユーザーログインのトークンを発行してHeaderに設定して認証するミ…

QRコードからのゲストログインの機能を作成中。 標準のQRスキャンアプリでスキャンしたらゲストログインできる仕組みにしたかったので、ユニバーサルリンクを実装 PR github.com github.com 実装 ユニバーサルリンクは以下の記事を参考に実装 zenn.dev まず…

前回、GitHub ActionsでiOSアプリをビルドしてFirebase App Distribution にデプロイする方法を紹介したので、今回はAndroidの方を紹介 www.wheatandcat.me PR github.com 使用 アプリ: Flutter CI: GitHub Actions デプロイ先: Firebase App Distribution …

作っているアプリで実機検証をやりやすくすためにCIで自動でデプロイできるようにしたの記事化 今回はiOSアプリのみ、次回Androidアプリのデプロイ方法も記事にする予定 PR github.com 使用 アプリ: Flutter ビルド: fastlane CI: GitHub Actions デプロイ先…

今Flutterで開発しているアプリがある程度形になったので報告 リポジトリ github.com github.com 画面 使用している技術 Flutter NestJS Prism TiDB Serverless Cloud Run Firebase Authentication Firebase Storage 各画面で使っているライブラリ紹介 アプ…

Flutterで画像アップロード機能を実装したので記事にした PR github.com 実装 以下を使用して実装 - image_picker | Flutter package - image_cropper | Flutter package - firebase_storage | Flutter package まずはimage_pickerで画像選択部分を実装 初期…

前回記事の続き、今回はバックエンドとアプリの続きを実装 PR backend github.com アプリ github.com 実装 まずはbackendを実装 今回はNestJSのGuardの機能を使いFirebase認証を作成 docs.nestjs.com コードは以下のような感じ ■ src/common/guards/auth/aut…

4月は3週間の海外旅行に行っていたので久々の更新。 FlutterでFirebase Authenticationを実装してみたので記載。今回は純粋なアプリのログインのみ実装。 次回の記事でbackendの接続とアプリの状態保持を記載する予定。 PR github.com 使用パッケージ fireba…

以下の記事で紹介したが現在開発中のアプリでPlanetScaleを使用していたが無料プランがなくなってしまうので、代替のDBサービスを試してみたので紹介 www.wheatandcat.me PlanetScaleの無料プランがなくなる件 planetscale.com 5GBまでなら無料で使用できて…

現状FlutterでAPI接続するにはGraphQLが良さ気だったので実装してみた リポジトリ 以下で開発 ■ Flutter github.com ■ backend github.com 開発構成 Frontend Flutter Backend NestJS Prisma PlanetScale GraphQL Code Generator Cloud Run モチベーション F…

新しいアプリ開発でbackendをNode.jsでAPIをやってみようと思いタイトルの構成でAPIサーバーを作成してみたら、結構ハマりどころがあったので記事した リポジトリ github.com モチベーション 現在Flutterでアプリを作成中 FlutterでAPIのやり取りで型安全に…

前から記事で紹介していたサービスが公開できるレベルまで開発が完了。 コードがGitHubで公開しているので、諸々紹介 GitHub github.com URL oomaka.vercel.app 使用技術 web & サーバー T3 Stack Next.js App Routerで実装 tRPC Tailwind CSS TypeScript Pr…