高専の文化祭で使うスタンプラリーをPHPで作った話

# 0. はじめに
この記事は、[長野高専 Advent Calendar 2023 6日目](https://qiita.com/advent-calendar/2023/nnct) の記事となります。

昨日の[Crysta1221](https://twitter.com/cr1sta_dev)さんの記事「[文化祭でクラス企画のシステムを作った話](https://qiita.com/Crysta1221/items/627ae9b51f662b52946b)」に引き続き、私も長野高専の文化祭についての記事を書きたいと思います。

私は、1年の時から3年の現在に至るまで、過去3回の長野高専の文化祭（工嶺祭）のスタンプラリーのWebアプリを開発・運営をさせていただきました。

この記事は、あまり技術的なことは書かずに、その当時に思ったことを中心に書きたいと思います。（**ソースコードはないよ！**）

さて、この記事が投稿される12月6日は、1982年に東京地裁が「**コンピュータのプログラムは著作物に該当**」という初の判断をした日です。（**せめてものIT要素**）

基本的に私は、あらゆるソーシャルメディアにおいて、「**見る専**」なので、文章を書くのは慣れてない、かつ苦手意識があるので、大目に見ていただけるとありがたいです。

# 1. 自己紹介
はじめまして！長野高専3年の [まっしぃ](https://x.com/massy1102) です！
**「日本史好きの理系」** を勝手に名乗っているひとです。
私は日本の近現代史が好きなので、日本史に興味がある方は話しかけていただけると喜んでオタク化します。（この記事には関係ない）


# 2. コンテストと1年目のスタンプラリー

私が高専1年生の時に、文化祭で使うスタンプラリーの**開発コンテスト**がありました。

当時の私を説明すると、[Scratch](https://scratch.mit.edu/)[^scratch]にハマった中学生がそのノリで高専に入学した、よくある感じでした。[^learned_lang]

当時の私は、
「開発コンテスト？　めっちゃ長い夏休み？　**やるしかない！！**」
と思い、一念発起しプログラミングを学び始めました。

スタンプラリーアプリは、**Webアプリでの実装**という要求がありました。

そこで私は **「PHPで書こう！」** と思いたち、長い夏休みを使って勉強しながら、システム開発を行いました。

PHPを採用した理由は、**PHP+MySQLでログインの実装が簡単そう**、**今後いろいろなWebアプリ開発に生きそう**などなどです。


そして、何とか動くアプリが完成し、応募して**採用**されました。

![fig_site_2021.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3045371/f5d2f402-865f-6d57-2e73-f0ad4d93333e.png)
（左のモザイク部分は2021年工嶺祭のポスターの画像。中央の弊校の写真は開発時のもので実際のものではありません）

上の画像は、頑張って見つけた3枚のスクリーンショットです。

QRコードをアプリ内の**カメラで読み込み**、スタンプを押すアニメーションが流れ、画像がだんだん見えるようになり、規定数を超えたら**抽選に参加できる**といったシステムです。

QRコードを読み取るカメラには、「**jsQR.js**」を使いました。今ソースコードを見返すと読み取りの処理の部分にかなり無駄があり、そのせいで読み取りに時間がかかっているようでした。その時に参加してくださった全ユーザーの皆さん、**ごめんなさい！**

プログラミング歴が約2か月の若造が組んだシステムは、（コロナで規模が小さかったことと、学内のみであったのもあり）なんとか無事に役目を果たせました。




# 3. 2年目のスタンプラリー

2年目(2022年)は、1年目と仕様はほぼ同じでした。

1年目と違う点は、長野高専学生に加え、「一般来場者（要予約）」が来るようになったことです。

そのため、一般来場者は、予約時に割り当てられた「入場ID」と「メールアドレス」でログインができるようにしました。

また、当時5年生の方から相談があり、そのクラスの企画のゲームをクリアしたら、そのクラスの場所のスタンプが自動で押されるといったAPIを作ったりしました。

他人と共同してプロジェクトをするのは、何気にこの時が初めてなので、とてもいい経験でした。**ありがとうございました！**



# 4. 3年目のスタンプラリー？

3年目(2023年)は、スタンプラリーが**完全アナログ化**されました。

これにより、私のシステムは使われなくなるかと思いきや、「**長野高専開校６０周年企画**」[^nagano-kosen-begin]として、「課されたミッションを達成していく」といった内容のWebアプリを作ることになりました。

ということで、一部活用ができる部分もありながら、可読性が悪い部分、非効率な部分が多かったので、**ゼロから作り直すことにしました**。

![mi_fig.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3045371/cd1553b3-857b-ec8f-452f-429943291020.png)

上は、トップページと一般来場者及び長野高専学生・教職員のログインページのスクリーンショットです。

フレームワークは[Bulma](https://bulma.io/)を使いました。


![mi_fig_2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3045371/07291df4-7f7f-39d6-0bd0-bad9879536ad.png)

上はマイページのスクリーンショットです。

残り景品数を**スーパーのチラシの値段風**に表示したのが地味なこだわりポイントです。

また、開発時のテストで作成したロゴがそのまま採用されましたが、デザインも勉強したいですね。

今年は、Dockerを使う必要が出てきたのですが、私自身初めて使うツールで、工嶺祭まで1週間を切っているなか、親身に教えてくれた[@RSa1t0](https://twitter.com/RSa1t0)君に感謝申し上げます。



# 5. 終わりに

私はまだ3年で、来年も工嶺祭を在校生として迎える予定です。3年間のWebアプリ開発で、色々と反省したい部分もありますが、3年目にもなると、自分の作りたい機能が実装できるようになるなど、「**プログラミング楽しい！**」という、初心者のころに感じていた幸せを、再び味わうことができ嬉しいです。

最後に、自分の認知できる範囲で実際に使用してもらい、フィードバックを頂ける状況というのは、**お金に換えられないもの**で、このようなプロジェクトに参加できたのは非常に貴重なことだと感じています。ありがとうございました！



[^scratch]: Scratch（スクラッチ）は、非営利団体Scratch財団がマサチューセッツ工科大学（MIT）メディアラボ ライフロングキンダーガーデングループ（MIT Media Lab Lifelong Kindergarten Group）と共同開発する、8歳から16歳のユーザーをメインターゲットとする無料教育プログラミング言語及びその開発環境、コミュニティサイトである。（Wikipediaより引用）だいすき。
[^learned_lang]: 実は、テキストでコードを書くプログラミング言語として、Scratchの後は「Java」、「JavaScript」を少しかじった。**（C言語はやってなく高専入学後に初めて学んだ）**

[^nagano-kosen-begin]: 長野高専は1963年に開校。