はじめに
独学でnode.js, react, typescriptを勉強してUdemy講座をみながら制作したことはありましたが、自分で考えてデプロイまでしたことは初めてやりました。
DBの設計図・UIワイヤーフレーム
どんなものを作るかを考える際に考えて作ってみたDBの設計図とUIワイヤーフレームです。作りながらDBもUI少しづつ変わりましたが、大体の部分を図で書いてから進んだので、自分が作りたいものの全体像をイメージしやすく、また進行中に修正が必要になった場合でも対応がスムーズにできたと考えます。
Achivoとは
「達成したい目標（goal）、目標を達成するための計画（plan）、さらに計画を分解して小さしたタスク（task）に分解して効率的に目標を達成、管理できるアプリ」になります。
何か始める時なにから進めばいいのかわからないときに、目標を細かく刻んで目標達成を助けられるアプリになります。URLは以下になります。
なぜかiphoneではログアウトができない現象があるので、PCでの操作を推奨します。
開発環境
- バックエンド: Node.js + express + typescript
- フロントエンド: React + typescript + tailwind
- ホスティング: Vercel (フロントエンド), Render (バックエンド)
- DB: Mongodb
修正点
-
Googleログイン機能
ローカル環境ではGoogleログイン機能を実装出来ていましたが、なぜか本番環境ではpassport-google-oauthでprofileがundefinedでしか返されてなくてログインに失敗するエラーになってました。本番環境でもできるように修正したいと思います。 -
iPhoneでのログアウト不具合
iphoneログインするとログアウトができない状況になのでこの点も修正し全てのデバイスで正しく動作するようにしたいと考えています。
まとめ
デプロイは成功してもローカル環境で出来ても、本番環境ではできないことも多くあったのでそれらを修正してある程度動くようにできるまでも1日以上かかったと思います。
デプロイしながら学んだこともあったためそれについても整理して残したいと思います。