Web 入門
Web 入門用の資料です。
加納研究室のメンバであれば、ユーザアカウントを作成してログインすることで、オンライン学習用のソースコードエディタを利用することができます。
エディタの利用方法
基本操作
エディタでは、*.html / *.css / *.js ファイルの作成・編集・実行ができます。
エディタ左上の アイコンを押すと、各種シュートカットコマンドを確認できます。
- ：新規作成 (Ctrl + E)
- ：保存 (Ctrl + S)
- ：実行 (Ctrl + R)
- ： コード解説 (Ctrl + M)
エディタ左上の「Settings」を押すと、エディタの設定を変更できます。
コードの実行
*.html ファイルを実行すると、エディタ右上の実行ウィンドウに結果が表示されます。
- ：実行の停止
- ：リロード
- ：デプロイ
エディタ右下にはコンソールウィンドウがあります。コンソールへの出力や、エラーメッセージ（クライアントサイド）を確認することができます。
- ：コンソールの消去
AI アシスタント
本エディタは、以下の AI アシスタント機能を搭載しています。 (model: gpt-4o-2024-05-13)
コード解説
エディタ上でソースコードを選択し、「コード解説」のリクエストを送ると、コンソールに解説が表示されます。一度に送信できるコードは最大2000文字です。コード解説のリクエストは以下のいずれかの方法で送信できます。
- エディタ左上の「コード解説」ボタンを押下
- コンソール上部の「コード解説」ボタンを押下
- エディタ上で右クリックし「コード解説」メニューを選択
- ショートカットコマンド (Ctrl + M)
エラー解説
エラー発生時、コンソールのエラーメッセージ右側に表示されるロボットアイコン（エラー解説）を押すと、エラーの概要と解決策が表示されます。
解説レベル
「コード解説」と「エラー解説」は、解説のレベルを三段階から選択することができます（コンソールウィンドウ右上部分）。
- Level 1：簡潔な解説を行います（Default）
- Level 2：標準的な解説を行います
- Level 3：詳細な解説を行います
また、「コード解説」「エラー解説」のメッセージの下には、 （役に立った）アイコンと （役に立たなかった）アイコンが表示されます。 システム改善のため、回答にご協力ください。
演習進捗チェック
エディタ左側の「演習進捗チェック」欄にある各種演習ボタンを押すと、ソースコードが演習の要件を満たしているかどうかの判定を行い、結果をコンソールに出力します。
- 演習進捗チェックは適切に命名された JavaScript ファイルに対して行われます。第7回目の演習であれば、「ex07.js」が評価対象となります。
- 評価は 100点満点で行われ、70点以上を獲得すると、演習ボタン上の アイコンが に変化します。
- AI による評価は完全なものではないため、参考に留めるよう注意してください。
節度あるご利用をお願いいたします。