はじめに
私は開発もマークダウンでの記載も何もかも初めてです!
色々試行錯誤しながらやっていこうと思いますので、間違いやお見苦しい部分が多いかと思いますが、何かあれば教えてください!
目的
・一カ月Udemy等で学んだアウトプットのため
・発信する習慣作り
・個人開発での実績作り
何を作るのか
趣味で多言語を切り替えながら話す機会があるので、直ぐに別の言語で挨拶や自己紹介を思い出せるようなものを作りたいと思ってます。
使用予定技術
- Next.js 14
- TypeScript
- Tailwind CSS
- Zustand
- Tanstack Query
- Supabase
今日やったこと
実装
- 技術選定
- ロードマップの作製
- UI等のアイデア出し
イメージ
明日やること
- フェーズ1
- フェーズ2
- フェーズ3の状態管理について理解する
今後のロードマップ(AIに出力してもらいました)
🛠 フェーズ1: プロジェクト初期設定
npx create-next-app@latest lingua-app
🎨 フェーズ2: UI/コンポーネント開発
Tailwind CSSで基本デザイン
Shadcn/UIコンポーネント活用
🔧 フェーズ3: 状態管理
Zustand設計
🌐 フェーズ4: データ連携
Tanstack Query
🔒 フェーズ5: バックエンド/データベース
1.Supabase準備
2.テーブル設計
・translations
・user_phrases
3.RLS(Row Level Security)設定
4.認証機能検討
🧪 フェーズ6: テストと品質改善
1.Jest/React Testing Libraryでテスト
2.ESLint/Prettierで静的解析
3.パフォーマンス最適化
React.memo
useMemo/useCallback
🚢 フェーズ7: デプロイ
1.Vercelにデプロイ
2.GitHub連携
3.継続的インテグレーション