ハッカソンを開催・参加して「アウトプット共有アプリ」を作った話

## はじめに
Qiita初投稿になります,[株式会社var](https://var.co.jp/)インターン生のreimeiです.
先日株式会社varが運営しているITスクールの[RareTECH](https://raretech.site/)でハッカソンの開催・参加をしたのでまとめてみました.

## 背景
RareTECHが提供するコンテンツや講師陣が充実することでインプットの質は向上していた一方で,アウトプットをする機会があまりないことが気になりました.また,最近個人開発があまりできていなかったので時間を強制的に確保するためにも開催してみました.

## 概要
-  3 ~ 4人で1チームのハッカソン
-  テーマはRareTECH内で役立つアプリ(作りたいものが他にあればテーマに合わなくても大丈夫)
- 期間は約1ヶ月
- ハッカソン終了後の発表会で各グループの成果報告と講師陣から審査の結果発表

## スケジュール
- チームを決めるためのアンケート(締め切り5/13)を実施し,5/14(金)にチーム発表
- 5/14~26 準備期間としてグループ内でどんなアプリを作るか決定,技術選定,使用技術のチュートリアル(TODOアプリ作成など)などを各自で実施
- 5/26(水)ハッカソン開始
- 6/23(水)ハッカソン終了・講師陣から審査の結果発表と総評

## 目的
- アウトプットの機会を増やす
- 開発スキルの向上
- 就活でアピールできる経験や成果物を作って就活に役立てて欲しい

## 目標
- 作られたアプリがハッカソン後もブラッシュアップされるなど開発が続いて欲しい
- 作られたアプリが利用され,RareTECHにいる人たちが学ぶための環境がより良いものになって欲しい
- 今回のハッカソンや今後のブラッシュアップなどによって気軽に開発経験を積めるようになって欲しい

## メリット
- 開発経験を得られる
- 開発しないといけない環境に置かれるので開発スキルが上がる
- 作成したアプリをポートフォリオとして就活でアピールできる
- チーム開発の経験や実現場で利用されているアプリを作成した経験などを就活でアピールできる
- スケジュール管理やメンバーのタスク管理などを通してPMの経験を得られる

## ハッカソン開始
![image.png](https://user-images.githubusercontent.com/84213832/122702029-e8a2b400-d291-11eb-9cf8-0e9301c41bc5.gif)

[GitHub](https://github.com/Reimei1213/RareStudy)
オリジナルのリポジトリは公開用でDBの設定上ローカルでは動作しないので,forkした僕のリポジトリを利用してください.
※暗号化に使用する文字列を設定していないのでsettings.pyのSECRET_KEYに文字列を設定する必要があります.<br>また,オリジナルの方はMySQLを使用していますが,こちらはデフォルトのsqlite3を使用しています.

僕のグループは4人グループで以下のような役割分担でした.

- 数ヶ月の開発経験がある僕 : PM・HTML/CSS・フロントエンド・バックエンド
- 数ヶ月ITに関する勉強をしてきた方 : インフラ・HTML/CSS・バックエンド
- 完全初心者の方 : デザイン・HTML/CSS・簡単なバックエンド
- 完全初心者の方 : HTML/CSS

制作したものは**RareStudy**というグループ内でアウトプットを共有するアプリケーションです.

RareTECH生と駆け出しエンジニアをターゲットとして設定し,解決すべきユーザーの課題はアウトプットするモチベーションがないもしくは続かない,ブログはハードルが高い,知らない人にアウトプットは見られたくないことだと考えました.
そして,これらの課題の解決方法として以下の3点を機能に組み込もうとしました.

- 称号や知り合いからのコメントによるモチベーションの向上
- アウトプットの気軽さ
- 心理的安全性の確保

### 使用技術
- フロントエンド
    - JavaScript
    - jQuery
- バックエンド
    - Python
    - Django
    - ライブラリ
        - mysqlclient
        - django-bootstrap4
        - django-mdeditor
        - Markdown
- インフラ
    - Amazon EC2
    - Amazon RDS
    - MySQL
    - Apache
- バージョン管理
    - git
    - GitHub

### 設計
以下モデルの設計です.
Djangoが提供している機能も使用しているためuserモデルのプロパティが少し冗長的になってしまいました...
![RareStudy.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/680126/e7cb43c3-8d44-c7df-848f-58feebddd18a.png)

以下インフラの設計です.
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/680126/c181ab45-10d1-78d9-5f4c-ae2d7e9e45ed.png)

### 実装機能
- アカウント作成・削除・編集
- ログイン・ログアウト・アカウントのパスワード変更(Djangoが提供している機能)
- 記事一覧・詳細表示
- 記事作成・編集(md利用可)
- 記事投稿数による称号設定
- コメント作成・編集(md利用可)
- アカウント投稿一覧表示
- twitter投稿

### 工夫点
- UUIDの使用(セキュリティ向上が目的)
- Djangoが提供するViewクラスを使用したコードの簡略化
- セッター・ゲッターの使用やユーザーが使用するアイコンのパスをメソッドにまとめるなどオブジェクト指向プログラミングを意識した実装
- 一つのページが長くならないようにページネータを実装
- DBへアクセスするためのユーザー情報やパスワード,DBにパスワードなどを暗号化して保存する際に使用する文字列を別ファイルとして作成し,それらを.gitignoreファイルに追加

### 今後の実装予定機能
- グループ機能　← 一番重要な機能を実装できてなかった:sob:
- 検索機能

### 所感
- DB設計やオブジェクト指向プログラミングなどインターン先で学んだことを生かすことができた
- インターン先では絶対にできないPMっぽいことをしてみて改めて人を動かすことの難しさを感じた
- インターン先とは異なり前提知識が人それぞれ違うので,前置きをするなどコミュニケーションは工夫する必要があると感じた
- ハッカソンに参加する上で事前に勉強することは大変重要だと痛感した<br>(事前勉強をした人としていない人だと進捗を生む頻度や成長速度に明らかな違いがあった)

## 最後に
ハッカソンを開催・参加することで自分を含め,参加したRareTECH生にアウトプットをする機会が生まれ,大きく成長することができてよかったです.また,現在2回目のハッカソンの準備期間中なので今回学んだことを生かしてより良いハッカソンの運営をすることができたらと思います.