本日はWeb枠です。
Glitchについて触っていきたいと思います。
〇Glitchとは？
Glitchはウェブブラウザのオンライン上で動作する統合開発環境(IDE)です。
主にウェブアプリを動かすことを目的としており、ウェブページを作るためのプログラムであるhtmlファイルやJavaSctiptを実行可能です。
これらウェブブラウザでプログラミングをして実際に動かすためにはサーバーを使用してウェブページとして公開する必要がありますが運用も含めたコスト面などを考えた場合、ハードルがあります。
VSCodeなどを使用すればLive Serverなどによってローカル環境にサーバーを立てることもできますが、例えば身内やコミュニティなどのチームで作成したページをシェアしたい場合などは問題となることがあります。
Glitchを使用することである制約下ではありますが、基本的に無料で使用、実行、共有することができます。
〇Glitchのライセンス
Glitchは月8ドルの有料プランと無料プランがあります。
〇無料プランの場合
・プロジェクトおよびコードは公開される
・フルスタックアプリは５分以上アクティブではない場合スリープ状態になる
・常時稼働する無制限の静的サイトが作成可能
〇有料プランの場合
・無料プランに加えプライベートプロジェクトが利用可能
・より処理が高速化
・アクセス制限が可能
・常時稼働するフルスタックアプリを最大５つまで利用可能
・プロジェクト時間の増加とレート制限の解除
加えてログインしない状態で利用することもできますがこの場合プロジェクト時間が120時間、プロジェクトは5日で消失、アクティブではない時間が５分続くとスリープ、ディスク容量の制限や１時間当たりのリクエスト数（4000）などに制限があります。
プロジェクト時間とはGlitchの提供するサービス時間を指し、プロジェクトが編集されている時間、サイトに誰かがアクセスしている時間に消費されます。
無料ユーザーは毎月1000時間、有料ユーザーは毎月4000時間が提供されます。
コミュニティイベントや個人開発レベルでは無料プランで問題がなさそうです。
ただし、無料プランの場合アクセス制限がなくすでに全世界に公開されているような形で進行するため絶対に機密情報や個人情報を載せないでください。
〇Glitchを使えるようにする
Glitchを利用するためにはGoogleアカウントなどを利用してsign-upを行う必要があります
アカウント作成後ダッシュボードへ入ります。
ダッシュボードでは自分自身のすべてのプロジェクトが管理できます。
このProject Hoursがプロジェクト時間を指します。 例えば一番上部のプロジェクトでは13時間消費したという意味になります。
プロジェクトを選択し開くと次のような画面になります。
プロジェクトのプレビューを見るには画面下部のPREVIEWを選択します。
Open preview paneを選択します。
これによって画面右側がリアルタイムのプレビュー画面になります。
最後に公開方法ですがこちらも簡単で上部のShareボタンを選択し表示されるURLを公開します。
以上がGlitchの使い方になります。
無料、ツール等のインストール無しでブラウザ上だけでエディタから公開までできるので個人開発や勉強には最適だと思われます。
Webに関してもWebXRとしてBabylon.jsなど勉強したいことが山積みなので環境構築がわかるとより取り掛かる意欲がわきました。
本日は以上です。
