Slide 1

Slide 1 text

WEBアプリ ハッカソン チーム名:rookies [メンバー] 〇〇〇〇 [報告日] 2026年9月21日

Slide 2

Slide 2 text

目次 ①アプリ概要 ②メンバーの役割 ③技術スタック ④システム構成 ⑤デモ ⑥アプリの展望・課題 ⑦感想・学び

Slide 3

Slide 3 text

アプリ概要 紙名刺がなくても、すぐに交換ができる デジタル名刺アプリ(Meetolio) 利用シーン ・就職 / 転職活動で自分のポートフォリオ を見せたい! ・交流イベントで名刺交換するほどではな いが気軽に自己紹介をしたい! 主な機能 ・名刺画像のアップロード ・自己紹介ページの作成 ・写真から名刺画像の生成 ・名刺の相互交換 / 管理

Slide 4

Slide 4 text

メンバーの役割 おおた これまでの経験 今回の役割 メンバー① ・TS(個人開発) ・実務経験なし ・新卒研修で少し ・フロントエンド (typescript,React) ・インフラ (docker) メンバー② これまでの経験 今回の役割 ・Kotlin(約半年) ・プログラミング自体は ・大学の授業で少し ・バックエンド(java) これまでの経験 今回の役割 ・アプリ/インフラ運用(1年半) ・Java(約半年) ・React Native(個人開発) ・全体管理 ・フロント/バックエンド/イ ンフラサポート

Slide 5

Slide 5 text

フロントエンド Typescript 5.8(React 19)/ Vite バックエンド Java 21 (Spring Boot 3.5) / Gradle データベース PostgreSQL 16 インフラ Docker その他 GitHub Project / Notion / VSCode / GitHub Copilot 技術スタック

Slide 6

Slide 6 text

システム構成 Docker React Spring boot PostgreSQL アクセストークン発 行依頼 ORマッパーを使用 したデータベース アクセス アクセストークン発 行(JWT) APIリクエスト APIレスポンス データの返却

Slide 7

Slide 7 text

デモンストレーション これからデモンストレーションを お見せします。

Slide 8

Slide 8 text

デモンストレーション(資料では画面をお見せします!)

Slide 9

Slide 9 text

アプリケーション課題・展望 改善策 機能追加 ・名刺画像の生成 ・QRなどによる即時共有 ・相互に交換できる機能 ・UIの充実 ソースコードリファ クタリング ・フォルダ構成・アーキテクチャ設計が不十分 ・保守運用を考慮したエラーハンドリング、ログ設計 ・CI/CD、コード規約の導入 ・HTTPS通信対応 ・IP制御/ファイアーフォール設定 ・JWTのリフレッシュトークン対応 セキュリティ強化

Slide 10

Slide 10 text

感想・学び メンバー② 【計画性】 ・タスクの振り分けが十分にでき ず、進捗を想定以上に進めること ができなかった。 ・現状把握と適切なタスク分担の 重要性を実感した。 ・限られたリソース・時間の中 で、計画的に設計・開発を進める 力が必要だと学んだ。 【技術力】 ・技術的なサポートができなかっ た部分が多々あった。 おおた 【計画性】 ・フロントに関しては全てのAPI を接続することができた。 ・ブランチの切り方の理解が不足 しており、レビュー側の負担を増 やしてしまったので、要改善。 【技術力】 ・今度はデプロイまでできるよう に。 ・AIが作成したフォルダ構成を理 解するのに苦しんので、今後は自 分で考え、実装するようにする。 メンバー① 【計画性】 ・時間の管理をうまくすればもっ と稼働時間を増やせたと思う。 ・設計から担当する予定だった が、予定通りに進められず大部分 をサポートしてもらう形になって しまった。 【技術力】 ・後の実装を見通しての設計がで きなかった。 ・テストの部分でつまり、単純な 経験値不足を実感した。

Slide 11

Slide 11 text

全体まとめ デジタル名刺アプリを通じて、フロント・バック・インフラを連携させる開発経 験を積むことができた。 即興メンバーで限られたリソースの中での、開発・コントロールの難しさを痛感 した。 今後は機能追加・セキュリティ強化・コード整備を進め、より実用的なアプリに 発展させていきたい。 この経験を今後の学習や開発に活かしていく。