🌍世界をつなぐ言語交換アプリ — フルスタックで挑戦
お久しぶりの投稿です。最近、プログラミングの学びや気づきをもっと記録していこうと思い、ブログを再開することにしました。
今回は、フロントエンドのシニアエンジニアの友人と一緒に、言語交換のWebアプリを立ち上げました。フロントだけ、バックエンドだけではなく、フルスタックで開発することで、より深く全体像を理解したいという思いから始まったプロジェクトです。
まずは、以下のようなことからスタートしました：
- 予算・機能・スケジュールのバランスを整理
- スケーラビリティや可用性など、技術的な優先事項の確認
- ユーザーストーリーの作成と機能への落とし込み
- システムアーキテクチャの検討
- チーム内のコミュニケーションや進捗管理ツールの選定
🌐 なぜ言語交換アプリ？
僕たちはどちらも複数の言語を話すので、「言語を学びたい人同士がつながれる場を作れたら面白いよね」という話になりました。ユーザーは自分の住んでいる場所を選び、学びたい言語を設定して、パートナーを探すことができます。今のところ、やり取りはメール形式で、ペンパルのような体験をイメージしています。
💻 MERN + TypeScript を選んだ理由
今回の技術スタックは MERN（MongoDB, Express.js, React, Node.js）＋ TypeScript にしました。JavaScriptベースで統一されているので、開発の流れがとてもスムーズです。
- フロント〜バックエンド〜DBまで、すべてJSONでやり取りできる
- Reactのコンポーネント設計で、UIの再利用性と保守性が高い
- Express.jsは軽量で柔軟、API設計にぴったり
- モノレポ構成にすることで、フロントエンドとバックエンドの管理がしやすくなり、開発・デプロイの効率も向上しました
🧠 プロジェクトの整理と標準化
MongoDBのスキーマ設計を担当したあと、プロジェクトの初期設定にも力を入れました。最初から整理された状態で進めることが大事だと思い、`/docs`フォルダを作って以下のようなドキュメントを用意しました：
- coding-standards.md（コーディング規約）
- git-workflows.md（Git運用ルール）
- copilot-instructions.md（GitHub Copilot向けの指示ファイル）
PrettierやESLintも導入して、コードの品質を保つようにしています。
✨ 小さな喜び、大きなモチベーション
個人的に嬉しかったのは、PostmanでAPIをテストして、`200 OK`のレスポンスが返ってきた瞬間。「ちゃんと動いてる！」って思えて、すごくテンション上がりました。
最後に、Next.jsのコンポーネント構成に関して優れたセンスを持つ友人にも感謝しています。彼の設計を間近で見ながら学ぶことが多く、自分の視点や考え方にも良い刺激を受けています。
このプロジェクトはまだ始まったばかりですが、楽しく進められています。今後も進捗をWantedlyで共有していく予定です。
最後まで読んでいただき、ありがとうございます！
引き続き、よろしくお願いします。
アリ 🐜
Last Note:
仕事とプログラミングのあと、フロントエンドエンジニアの友人とひと休みしているときの写真です。久しぶりにサッカーをしたので、かなりヘトヘトでした（笑）
