前編(授業の内容について)中編(各生徒チームの内容と成果物について)に引き続き、授業を進めるために活用したCloud9Firebaseについて説明します。

Cloud9はプログラミングの開発環境です。学校のパソコンは、セキュリティ保護や、生徒の学習に不要な機能へのアクセス拒否などの設定がされているため、アプリ開発には制約が多いです。今回は高校のパソコンルームにあるノートパソコンを利用しましたが、後述するようにアプリ開発のためには幾つかの問題がありました。その問題を解決するために今回はCloud9というサービスを使うことにしました。Cloud9の説明と利点などについて説明します。

Firebaseはアプリの開発に必要な機能を提供してくれるサービスです。今回の授業に参加する生徒は、2学期にJavaScriptの学習を行ってきました。そこで、JavaScriptのスキルを効率的に活用できるように、今回はFirebaseを使うことにしました。

学校のパソコンの課題

学校で使われるパソコンは、セキュリティ保護や生徒が安全に利用できるように、以下のような制約がある場合が多いです。

■ パソコンをシャットダウンすると、パソコンローカルの環境が初期化される
・ローカルに保存したデータは削除される(制作物は共有フォルダに保存するように指導しています)
・npmなどで開発に必要なパッケージをセットアップしても削除されてしまいます(涙

■ アプリのインストールができない
・許可をもらってインストールすることは可能だとは思いますが、手続きは大変です。

■ 環境変数の設定などができない
・gitやその他コマンドラインツールの初期設定も毎回実行する必要がある

昨年度の同じ授業ではローカルに開発環境を作るために、nodejs、gitなどをインストール頂いて開発を行ったのですが、これらの制約のため手間がかかり、本質的な作業以外のところで時間を取られてしまい、とても困りました。

今回はそれらを解決する方法として、開発環境はパソコンのローカルにセットアップするのではなく、クラウド上(ブラウザ)しました。様々なクラウドの開発環境を検討した結果Cloud9を使うことにしました。

Cloud9

学校のパソコンは、上述のようにローカルシステム上で開発環境を構築するのが非常に困難でしたが、Web上で開発環境が構築できるCloud9を採用することで解決することができました。(学校によっては、インターネットアクセス制御で、Cloud9にアクセスできない場合もあるかと思いますが、今回は大丈夫でした)


上図はCloud9の画面の説明です。ブラウザ上でチームでプログラミングできる統合開発環境で、ファイル管理やコードエディタ、コマンドが実行できるエリアなど、開発・テスト・デプロイができる環境になっています。Webページですが、ローカルにインストールして使う環境として、遜色のない機能が提供されている上、同時編集やチャットなど、チームで作業するのに効果的な機能も搭載されています。

また、管理側としても、各チームの開発環境を簡単に用意することができます。

 

Cloud9のチームページ

ログイン機能やデータベース操作などのサンプルコードを仕込んだアプリを一つ作り、その開発環境で後述するFirebaseの設定や、gitなどのセットアップを行った開発環境を用意します。それをクローンして開発環境を増やすことができるので、各チーム分の開発環境を簡単に用意することができます。

生徒は、開発をスタートするタイミングですぐにサンプルアプリが動く開発環境が使えるので、環境設定で時間が取られることはなくなりました(昨年度は環境設定だけで2コマ消費したのです・・・)。

 

現在はCloud9はAmazon Web Serviceに統合され、少し画面の様子は違うと思いますが、基本的には同じことができると思います。

Firebase

今回のアプリの環境としては、Firebaseを採用しました。

FirebaseはGoogleが提供しているWebやスマートフォンアプリの開発のバックエンド(ログインやデータベース、ファイル管理、ホスティングなど)を提供してくれる、BaaS(Backend as a Service)と呼ばれているものの一つです。

今回の授業で使うアプリで共通に必要となるような、ログイン認証の機能や、データベースやファイル管理などはFirebaseの機能として提供できます(正確には、Firebaseの機能を使ってベネッセがアプリに組み込んだものを提供しました)。それにより、生徒は自分たちのメインアイデアの機能や画面を作り込むことに注力できるようになりました。

また、Firebaseを使い始めるためには、Firebaseのユーザー登録(無料)や、開発環境でのツール群のインストール(node.jsや関連するパッケージ)が必要ですが、Cloud9であらかじめ環境のセットアップをしておけば、生徒がそれぞれセットアップする必要がなく作業が開始できました。

 

 

まとめ

Firebaseでアプリの基盤をつくり、Cloud9上に開発環境をセットアップすることで、生徒は本来注力すべき機能開発に専念することができました。

本当なら開発環境のセットアップや、様々なツールの設定、インフラの学習、それらの選定なども重要な学習なので、省くのは心苦しい面もあったのですが、それだけで数日かかってしまうため、今回のような形式で授業をすすめました。

まだまだ改善したい点もあるので、これがベストというわけではないですが、学校でプログラミングを行うときの一つのアイデアとして参考にしていただければ幸いです。