最終成果発表前にやっつけで書きます。 (大学の提出物に追われており時間がないので紹介だけで、そのうち詳しい紹介ブログを書きます) 詳しい話やデモを見たい方はぜひ成果発表にお越しください!!
何を作ったのか
マシンに攻撃したり、セキュアコーディングを学んだり、それらを学ぶために必要な基礎知識を学ぶことのできるアプリケーション・基盤を作りました。
なぜ作ったのか
これを作ろうと思った当時、セキュリティを学ぶサークルに所属しており、初心者の環境構築に悩んでいました。 大学だとWindowsとMacの人がおり、共通する環境構築のガイドを作ったりするのが非常に難しかったです。そもそもM1 Macだと動作しないソフトウェアも当時は多くありました。また、Windowsの場合だとWSLを導入するか仮想環境を用意しないことには何もできないようなことがよくありました。かといってその環境構築を初心者がスラスラできるわけもなく、僕が付き添いでやることが多かったです。
その他にも課題がありました。
- 学習者が十分なスペックのコンピュータを持ち合わせていない場合や、そもそもコンピュータを持っていない場合に学習ができない場合がある
- 特定のソフトウェアやツールなどを利用する場合、バージョンアップや配布場所が変更されるたびに資料の更新が必要となったり、動作がOSなどに依存するため特定のOSで動作しないなどの問題が発生する。それに対応するためにOSごとの説明を用意する必要があり、教育者側の負担が増える。
- 環境構築時に学習者に対して一定の知識を要求することになり、学習を始める前に挫折してしまう可能性がある。
そこで、ブラウザというデフォルトで入っている共通ソフトを使って学べるようにすれば良いのでは?と考えたのが始まりでした。
SecHack365に応募した
ただし、それを思いついた当時はプログラミング歴1年程で、HTMLとCSSとバニラのJavaScriptがちょっと書けるだけだったので考えるだけに止まっていました。(ちょっと作ってみたことはあったのですが、PHPやPythonなどを使って開発するという方法を正直知らなかったのでHTMLファイルを大量に生やしてコンテンツを作る的なことをしていました)
大学3年になったときにSecHack365というものを知ったことで本格的に開発を始めました。応募時点である程度の構想などを伝えたかったのでいろいろ書きました。ちなみにこのときも、Reactというものを知らなかったのでLaravelとbladeテンプレートエンジンを使って作ってました。今じゃ考えられないですね。
実際に作ったもの
さて、実際に作ったものですが、ここで話すよりデモ動画を見てもらった方が早いので動画を貼っつけます。
ユーザーの動き
大まかなユーザーの動きは以下の通りです。
- ブラウザからアプリケーションへアクセス
- 学習するコンテンツを選択する
- 説明などを見る。見終わったら環境構築ボタンを押す
- 学習に必要な環境が作成され、学習ページに遷移する
- 学習を行い、学習を完了するために必要なタスクをクリアする
- 学習を終了する
「どうでしょう? 面倒な環境構築ないでしょ?」 といったところが売り文句です。
セキュアコーディングを勉強するコースも用意しており、その場合はこんな感じに説明を見ながら右側のエディタでコードを書きます。
(ずんだもんがいるのは、紹介動画から引っ張ってきたからです)
意識した点
主に意識して開発した点は以下の通りです
- 面倒な環境構築を必要とせず、ブラウザさえあればPCだけでなくスマートフォン・タブレットなどでも学習を始められるようになること
- セキュリティ人材を志す方が、セキュリティの基礎から応用までを学ぶことができる学習アプリになること
- エンジニアが本アプリでの学習を通してセキュアな開発や設計を意識付けられるようになること
- 基盤技術を汎用的に利用できるようにし、様々な形で活躍するようになること
ただ、この1年で完成したのは基盤の一部で、結局コンテンツなどの作成に取り掛かることができませんでした。 また、現状認証などの機能がなかったり、技術構成が確定しておらず本番運用がまだできていません。 課題が無限にあるのでそれらを解決するためにもう1年ほど必要になりそうです。
なので卒業研究として取り組むことで、大学の課外を解決しつつ、このアプリを完成させるという方針を今考えています。
まとめ
内容が薄くなってしまいごめんなさい。 そのうちデモ体験ができるように整備して公開します。
