大学生がオンラインハッソンに 出場して入賞してきた話

2020/0701 「DevRel Meetup in Tokyo #53 〜オンライン・ハッカソン〜 」(https://devrel.connpass.com/event/178456 )の登壇資料

Transcript

1. 大学生がオンラインハッソンに 出場して入賞してきた話 茨城大学 @takahiro
2. 自己紹介 ・石塚 崇寛(Twitter: @taka0110_) ・茨城大学 工学部 電気電子工学科 4年 ・複数社にてWeb系のエンジニアインターンを経験 ・株式会社TechBowl バックエンドエンジニア(2020/02~)
3. はじめに ← この経験についてお話します ( して頂けると嬉しいです。) https://qiita.com/takahiro_ishitsuka/items/de94f3d6a6890442a132
4. どんなハッカソンに参加してきたの？ • 4/25~26に オンラインにて開催 • 9チーム, 約30人参加 • 開発テーマ 「リモートワークの時代に 必要になるツール」
5. 開催時の流れ • チャット ◦ Slack • 当日の開発部屋 ◦ Discord • ハッカソン全体での通話 ◦ Zoom
6. 何を作ったの？ • 自分の興味のある話題でマッチングできるオンライン飲 み会のプラットフォーム。 • 気軽な飲み会を実現するために、通話の場も提供。 • Google ログイン連携を導入することにより、ユーザーの 信頼性を担保
8. 入賞
9. 使用技術は？
10. 開発の進め方は？ • チャット ◦ Slack • メンバー間での通話 ◦ Whereby • 作業部屋 ◦ Discord • タスク管理 ◦ GitHub
11. オンラインハッカソンで重要だと感じたこと • 短期間で動くものを作り上げる • メンバー間のコミュニケーションを大切にする
12. 開発の上で意識したポイント • 便利なツールをひたすら活用する • タスク、進捗を積極的に共有する • コードレビュー、ペアプロを取り入れる
13. 便利なツールをひたすら活用する • バックエンドにBaaS(Firebase)を用いた • 必要最低限のデザイン • Next.jsとVercelを連携する • ビデオ通話にSkyWayを用いた
14. バックエンドにBaaS(Firebase)を用いた 手間のかかるバックエンド構成を全てFirebaseへ
15. 必要最低限のデザイン Googleスライドにて画像を生成して流用 CSSフレームワークを利用 ( Material UI)
16. Next.jsとVercel(ホスティングサービス)を連携する デプロイフロー
17. Next.jsとVercel(ホスティングサービス)を連携する 各プルリクエストがVercel上へデプロイされるように
18. ビデオ通話にSkywayを用いた ビデオ通話部分はほぼSDKを利用 P2P
19. タスク、進捗を積極的に共有する • Slackに細かなことでもつぶやく • 細かなことでもGitHubのIssueを立てる
20. コードレビュー、ペアプロを取り入れる • PRベースで進捗を把握 (PRもこんな数に、、、) • Discord, Wherebyの画面共有にてペアプロ
21. おわり 皆さんもぜひオンラインハッカソンへ 参加しましょう！
22. P.S. ぜひ登録して下さい