はじめに
こんにちは！先日開催されたエンジニア向けイベント「フルスタックTypeScriptの現在地：3社が本音を語るハイブリッド勉強会」にて、「TS未経験から３ヶ月で新機能開発した話」というタイトルで登壇させていただきました。
この記事では、発表内容の概要と、フルスタックTypeScript開発で感じたメリットについてご紹介します。
発表資料
当日の発表資料はこちらで公開しています。詳細はこちらをご覧ください。
https://speakerdeck.com/haya1o/tswei-jing-yan-kara-3keyue-de-xin-ji-neng-kai-fa-sitahua
発表概要
どんな話？
プログラミング経験はあるものの、TypeScriptやモダンなフロントエンド・バックエンド開発は未経験だった私が、インターンとしてトグルホールディングス株式会社にジョインし、3ヶ月間でフルスタックTypeScript（React, Hono, Prisma, Zodなど）を用いた開発に挑戦し、最終的に新機能開発まで担当した経験についてお話ししました。
3ヶ月の道のり
限られた時間（週15時間）の中で、以下のようなタスクに取り組みました。
-
最初のタスク（フロントエンド改修）:
- 簡単なボタンのデザイン変更からスタート。
- GitHub Codespaceやホットリローディングのおかげで、1営業日でPull Requestを作成。
-
2つ目のタスク（バックエンド改修）:
- 「タグ更新時に更新日時が変わらない」バグの修正。
- バックエンド経験ゼロでも、フロントエンドと同じTypeScript（Hono, Prisma）だったため、構文の壁がなく学習に集中できた。
-
様々なバグ修正:
- PDF出力、権限チェック漏れ、エラー表示など、複数のバグ修正を担当。
- フルスタックTypeScriptだとフロントエンドからバックエンドまで一気通貫で見通せるため、原因特定や修正がしやすいと感じた。
-
集大成：新機能開発:
- ユーザー利用状況（物件登録数、VC実行数）を集計・表示する機能の開発を担当。
- 要件理解からフロントエンド・バックエンド実装まで一通り経験。
- Zodによる型定義と型推論のおかげで、API境界での不安が少なく開発を進められた。
フルスタックTypeScriptで感じたメリット
今回の経験を通して、特に以下の3つのメリットを強く感じました。
-
学びやすい！
- フロントエンドとバックエンドで言語（TypeScript）が共通なため、学習コストが低い。
- 環境構築が容易（GitHub Codespaceなど）。
- ホットリローディングで試行錯誤しやすい。
- Reactなどのモダンなフレームワークは、Web開発の基礎があればキャッチアップしやすい。
-
全体像の把握がしやすい！
- フロントエンドからバックエンドまで同じ言語・型で追えるため、処理の流れや依存関係を理解しやすい。
- バグ発生時も、問題箇所の特定が比較的容易。
- レイヤードアーキテクチャなどを意識した設計の理解も進む。
-
型定義が怖くない！
- TypeScriptの静的型付けにより、開発中のエラーを早期に発見できる。
- 特にZodを使ったスキーマ定義と型推論は、API境界でのデータの整合性を保つのに非常に役立ち、安心して開発を進められた。
まとめ
TypeScript未経験からスタートしましたが、フルスタックTypeScriptという技術スタックのおかげで、3ヶ月という期間で多くのことを学び、新機能開発まで達成することができました。
フルスタックTypeScriptは、学習コストの低さ、開発効率の高さ、コードの堅牢性といった面で、個人開発にもチーム開発にもおすすめできる選択肢だと実感しています。
詳細や具体的なコード例については、ぜひ上記のSpeaker Deck資料をご覧ください。
最後までお読みいただきありがとうございました！
懇親会
懇親会にて、多くの方とお話しさせていただきました！AIエージェントによってエンジニアという職業がどうなっていくのか？というのは新卒の自分としては考えておかないといけないテーマだなと感じました。
AIツールのキャッチアップをしっかりしつつ、爆速で開発できるエンジニアを目指していきます！