0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【初ハッカソン】技育CAMP2024 ハッカソン vol.14に出場しました!

Posted at

はじめに

こんにちは。RyutaroMです。

タイトルにもあるように、9月14〜15日にオンラインで開催された「技育CAMP2024 ハッカソン vol.14」に出場してきたので、そこで得られた知見をまとめます。

テーマは「祭り」で、プログラミングで作っていればなんでもOKというルールでした。

夏休みで時間があるし何かみんなで作ってみないと研究室で話していたことをきっかけに、研究室の1つ上の先輩と2人で出場しました。

自分の中での出場のモチベーション

出場のモチベーションとして、何かを作ってみたいという思いももちろんありましたが、それよりも他の人と関わることで刺激を受けたいという思いの方が強かったです。

自分は長期インターンをしていて始めてから1年半くらい経っていたため、このタイミングで新しい視点を取り入れ、さらなる自身の成長のきっかけにつなげたいと思っていました。

作ったもの

ハッカソン前に2人で話していく中で、「Reactを使ってかっこいい・ワクワクするようなWebサイトを作りたい」ということになりました。

テーマの「祭」をどう消化しようかと話し合った時に、「祭→夏→夏の終わりの懐かしさ・切なさ」という話になり、レトロ感のあるゲームができるWebサイトを作ろうということになりました。

最終的にこのようなWebサイトを形にするところまでもっていくことができました。

image.png

工夫点

CSSを使った自然なコンポーネント埋め込み

image.png

この画像のように、コンポーネントをテレビの枠に自然に埋め込みました。
埋め込みにはCSSのperspectiveプロパティを用いました。

タイプライター風アニメーションを用いたレトロコンピュータの表現

タイプライター風アニメーションを使ってレトロコンピュータを表現しました。
アニメーションにはreact-simple-typewriterのReactライブラリを使いました。

Firebaseへのデプロイ

今回はFirebaseへデプロイしました。
思ったよりも簡単にデプロイできました。以下の記事を参考にしてデプロイしました。

テスト版を動かす時にはとても便利だなと思いました。

新たに学んだこと・身についたこと

まず大前提として他の人と何か1つのものを作り上げるのは大変だということを学びました。
その上で、誰かと協働するときには自分の中で何を作りたいのか・どうしたいのかを固めておく必要があるなと思いました。

反省点

アイディアが固まらずに迷走した感じがありました。

アイディアが固まらないと役割分担もできないため、今度出場するときはどんなものを開発するかをもっと早めに決めたいなと思いました。

さいごに

とても大変でしたが、当初の目標通り刺激になってよかったです。

もっと他人のアイディアに触れることでアイディアの生み出し方に慣れていけそうな気がしたので、これからもハッカソンに参加していきたいなと思います。

最後まで読んでいただきありがとうございました。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?