はじめに
本稿は初心者エンジニアがWindows環境でiosアプリを開発するものです。
かなりフランクに書こうと思っています。
初心者を言い訳にしたくないですが、わかりづらかったら大変申し訳ないです。
ただ少しでもこの記事が役に立つことを願って書きます。
どんなアプリか？
NW構成図を見たらわかると思いますが、かなりシンプルな作りとなっています。
〇使用コードエディター
・VScode
〇フロントエンド
・Node.js
・ReactNative
・Expo
・TypeScript
※私用携帯がiPhoneのため、Windowsで開発時エミュレーターはExpoを利用
〇バックエンド
・CloudFlare Workers(API Callに利用)
・CloudFlare D1(Database)
・TypeScript
・drizzle(SQL作成してくれるすごいやつ)
こんな感じです。
まだ開発中のため、変更はあるかもしれませんが。
前提条件
お使いのiPhoneにExpo.goをダウンロートしておきましょう。
iPhoneのQRコードリーダーで読み取ると書かれているコードがiPhone上でどのように動くのかわかるすんごい代物です。
環境構築
フロントエンドの環境構築でかなりてこずった・・
公式ドキュメント最強ってことですね。
1.まずはNode.jsのインストールから
インストールが完了したら以下のコマンドをVScodeのターミナルにて実行してバージョンを確認する。
(バージョンがわかればインストールは無事に完了)
node -v
実行結果
v20.12.0
このように表示されるはずです。
2.Expoの新しいプロジェクトを作成
こちらのコマンドをターミナルにて実行する。
npx create-expo-app@latest
そうするとTemplateも含めたExpoのフォルダが作成されるはずです。
完了したら、Expoを動かしてみましょう。
以下のコマンドをターミナルにて実行する。
npx expo start
そうするとターミナル上にQRコードが作成されているはずです。
iPhoneのQRコードで読み取ってみると・・・
TemplateのコードがiPhoneにて動作しているのがわかると思います。
一旦はここまでにしておきます。
ちなみにQRコード読み取りまでは公式ドキュメントを参考に(というかその通りに)やってみただけです。
こちらです。https://docs.expo.dev/get-started/introduction/
続きも書きますが、基本的には公式ドキュメントに沿って書いていくので、早く開発したい！という方はリンクの公式ドキュメントからやっていけば結果は同じかと思います。。。
つたない文章ですが、ここまで読んでくださりありがとうございます。
完成するまで書き続けますので、どうぞよろしくお願いいたします。