概要
ReactNative Expoに興味があり個人アプリを作ってみました。どんなものかというと英語学習を当時していたのでフラッシュカードのアプリでも作ってみようと考えたのが始まりですね。
それがこちらです👇
まだリリースはしてない。iOS26になってデザイン変わったので新しいスクリーンショットがいる💦
作った技術構成についてはこちらに記載しております。
https://izanami.dev/post/bdfa06d8-4159-47ef-90d9-1aea0f3b5d6e
izanamiの解説から引用
state管理は、zustandを使用しました。Reduxだと複雑だし小さなアプリには向いてないなと思い選びました。アクションもストアもいらない。楽だった。
覚えたい単語を保存するために、ローカルDBを使うのですが、Drizzleを使うと直接SQLを書くよりはコードを書きやすいというのもあり使用しました。
タブで画面を切り替える機能は、Expo Routerの機能を使用しました。画面の移動はこれだけしかない。ページも複数作ろうと思ったのですが、今回は見送りました。
当時作ったソースコードは、突貫工事だったのでよくはなかったです💦
appディレクトリを使ってなくて、タブの切り替えは別の方法でやっていた。これだと、iOS26のLiquid glassに対応できないと思った。。。
Native Tabsに対応したかったので、リファクタリングをした!
最近使い始めた、Gemini3を使ってみました。意外と精度良かった！
当時使ったclaude-codeよりいいかも？？？
AIツールは、Gemini CLIを使用して開発をしました。
やったこと！
- iOS26に対応したTabの実装方法を調べて学習
- Gemini CLIを活用してnpm packageのupdate
- Expo53 SDKからExpo SDK54へのupdate
npmの依存関係のエラーで詰まることが多かったですが、AIの力を使って回避した。Gemini3は精度がChatGPTよりも上なのではないかと口コミ見たので、試してみたらまさかの想像以上の活躍をしてくれました。ありがたい。
Liquid glass対応するとこんな感じになりました！
Flutterだと専用のpackageがいるらしい？。SwiftUIだとビルドしたらオリジナルなので作ってくれる。
最後に
Gemini3を使った感想ですが、スムーズに開発が進みましたね。TypeScriptとは相性がいいのかな？
npm packageの依存関係のエラーの解決からupdateまで行ってくれました。期待以上の性能でしたね。ぜひお勧めしたい！
ReactNative Expoは生成AIと相性が良いのか単純なアプリなら早く開発してくれました。生成AIは使うけどコツは必要でしたね。コンテキスト・エンジニアリングってやつかな。明確な指示をひたすら与えて、ここ違うなってところは、自分でコーディングしたり設定してましたね(^_^;)
ReactNative Expoは、今伸びているので是非是非個人開発されている方々使ってみてください。claude-codeに、$100払わなくてもGemini3の$20ぐらいでも十分でした。