新人エンジニア達がQiita Hackathonで出てみた

今年からエンジニアになった私たちがHackathonというイベントに出場しました。
私は業務では主に生成形AIなどを扱っています。
LaravelやReactは趣味として書いたことはある程度です。

Hackathonとは

プログラムの改良を意味するハック（hack）とマラソン（marathon）を組み合わせた造語。
与えられたテーマに対して、定められた期間に集中的にソフトウェアやサービスを開発し、アイデアの斬新さや技術の優秀さなどを競い合うイベントのことです。

出場理由

短期間でテーマに対してどの程度のクオリティの物が出来るのか挑戦してみたく出場しました。
メンバーは
大学の友人 2人 (フロントエンド & バックエンド)
学生時代にインターン先で出会った学生エンジニア 1人(バックエンド)
自分 1人 (フロントエンド & バックエンド)
の４人でチームを組みました。

当日

• 10:00 テーマ発表
• 10:30 ~ 12:00 ブレスト　成果物決定
• 13:00 ~ 翌日 12:00 設計＆開発
• 12:00 ~ 14:00 発表資料、デプロイ & デモ
  当日のタイムスケジュールは上記の通りになります。

テーマ発表

10:00からZoomでQiitaさんからテーマ「つながり」が発表されました。

ブレスト

「つながり」のテーマに関してチームでブレストを行いました。
色々な案が出たりしたのですが、問題という問題が見つからず成果物を決めるのに時間がかかりました。
決定手段としては、実際に自分たちで身の回りで使えるものを使おうということで、
新人エンジニアの私たちは上司や同僚、これからできる後輩と円滑にコミュニケーションを取ることに課題を抱えており、その人達の趣味などを知る事さえできれば、お昼の時や飲み会などでも話題が生まれたり話しやすくなるだろう。という結論になりました。
ということで、私たちは、グループ毎にテーマを生成し、そのテーマに関して画像やテキストを使い投稿することで、グループ内の人に見てもらい、コメントやリアクションもらう事で親しみやすさや趣味などを把握することができると考えました。

開発

技術構成としましては、Docker Laravel Vite(React)にしました。デプロイはherokuで行いました。
私は主にフロントエンド分野を担当しました。
フロントエンドでは、Reactは書いたことがあったので、ViteやLaravel内蔵されたReactは開発したことがなく、挙動やルーティング周りの理解に多少時間がかかったのですが、何とかうまく完成まで持っていくことは出来ました。
ReduxなどのエラーやSPAのページ遷移でreact-router-dom以外ものを間違えてインポートしてエラーになったりと自分達がの技術不足ですごく時間ロスはしてしまいました。

デプロイ

デプロイはHerokuを使っておりGithubのmainブランチにmergeすることでデプロイすることができ、スムーズにデプロイすることができました。 <-デプロイに関しての知識がなさすぎて何も役に立てなかった

感想

1.5日という限られた時間での短期開発は初めて、時間管理やスケジュールをもっとしっかりと決めるべきだったな反省しました。
また、アプリに関しても機能もモリモリにしてしまったので、スタイルが間に合わなかったり技術力的に実装時間がかかってAPI連携が最後の最後までできない場所などが生まれバタバタした開発になってしまいました。
しかし、1.5日で要件定義からデプロイまでを経験できたことはとても良かったです。
普段からもっとReactやコンポーネントの設計なども勉強しておけば、、、と後悔しました
次回以降もHackathonなどがあったら出たいと思いました。