• es
  • de
  • ja
  • fr

コーディング演習

Java Script,、CSSそして HTMLの全コースに コーティングの練習が出来るようになりました。独自で作成したもの、または当社のテンプレートをご利用いただいても構いません。学習しながら実践的な演習を行うという、受講生にとっては最高の学習体験のはじまりです。

演習をあなたのコースに追加する方法はこちらをご覧ください。

コーディング演習を設ける意義とは?

コーディング演習は受講生をコースに集中させる素晴らしい方法です。演習を活用する受講生達はあなたのコースにもっと時間を費やし、より高い満足感を得ることでしょう。

それぞれのコーディング演習の目標は?

それぞれのコーディング演習において、何かひとつ新しいコンセプトまたは課題を受講生達に促してみましょう。初めから正しくやる必要はありません。ご存知の通り、コーディングは失敗を積み重ねることによって上達します。

コーディング演習の必須事項は?

コーディング演習にはタイトル、コースの説明、指導内容、そして次の3つのファイルが必要です

1. 受講生が演習を始める際に必要なコードを含むファイル1つ
2. 受講生が解答法が必要な際に見るファイル1つ
3. 受講生の提出物を評価するためのコードを含むファイル1つ

 

 

タイトル


タイトルの目的は?

1.各コーディング演習を差別化するため
2.受講生にこれから学習する課題に対する心構えを促すため

必須項目

良いタイトルは短くコーディング演習の目標を簡潔に表現していること。

タイトル例:CSSをHTML文書に関連づける方法

 

コースの説明


コース説明の目的は?

コース説明はタイトルの詳細です。カリキュラムのどの段階で演習を行うのが適切か、そして演習を受ける段階に到達したかを見極める方法を説明します。

必須項目

1.文数は1〜3文
2.演習を終了するためにに知っておかなければならないこと、及びどの段階で必要事項を習得したかを見極める方法を説明すること。

コース説明の例:この演習では、関連付けられたスタイルシートについて学んだことを、タグの作成やスタイルシートのセットをHTML文書に関連づけるためのコードの記載に応用します。この演習を完了させた時、どのタグを使うのかを調べたり、それぞれのリンクに実装する構文を調べることなく、必修のスタイルシート全てを関連づけることができているはずです。

 

指導内容

 

指導内容の目的は?

指導内容は受講生が演習を開始する時に読むものです。簡潔でわかりやすく、すぐに実行に移せるよう促すことを目的としています。

必須項目

1.簡潔に書く(専門用語は使わない)
2.わかりやすい説明をする(必ずしも受講生が質問できるるとは限りません)
3.可能であれば、数名の受講生に指導内容がわかりやすく、実行可能なものか試してみましょう。

 

指導内容例:HTML文書と複数のCSSスタイルシートを送りました。スタイルシートを探し、それぞれのスタイルシートがHTML文書に関連付けられていることを確認してください。HTML文書に参照される全てのスタイルも適切なスタイルシートで定義されることを確かめてください。もし必要でないスタイルシートがあれば、それは使用しないでください。

 

ファイル

必要なファイル

1. 演習開始時に必要なものを示すファイル
2. 行き詰まった時に、受講生が参考にする解決法を示したファイル
3.  受講生の入力を検査する評価コード、正解の確認、エラーメッセージの定義を含むファイル

それぞれのファイルの必須事項は?

・受講生用スタートファイル ー このファイルは受講生が演習を終了させるのに必要な以下のもの全てを含む必要があります。
・演習に必要な全てのコード
・学習に役立つインラインコメント
・受講生が自力では作成できないファイル/フォルダー構造

・解答用ファイル ー このファイルはコーディング演習の実践的な解答法を含まなくてはなりません。必要な解答法は1つだけですが、その解答法は
・実行時に機能するもの
・それがあれば、自分の力で作成できるはずのもの(受講生に馴染みのない技術を含む複雑またはオーバースペックな解決法は避けること)

・テスト用ファイル ー このファイルは受講生の提出物を評価するコードを実行しなくてはなりません。以下を含むこと。
・受講生のコードがどのような条件で正解なのかを確認する評価コード
・テストに合格しなかった際に、適切なフィードバックで受講生に理解を促すエラーメッセージ

コードファイルがうまく機能することを確認する方法は?

コーディング演習ファイルをアップロード後、受講生として演習をプレビューし、試しに正しいコードと間違ったコードを入力し、ファイルがうまく機能するかを確かめましょう。

 

 

サクセスメッセージ

サクセスメッセージの目的は?

サクセスメッセージは演習を終了した受講生へのご褒美です。

必須事項

  • 受講生が何をうまくやったのかを明確に伝えること(「演習を終了しました」のような一般的な表現は避ける)
  • 自信を与えるような言葉のトーン(例:「よくできました!」)

サクセスメッセージの例:「よく頑張りました!全のスタイルシートを正しく関連付けることができました。お疲れ様でした!」

 

 

ヒント


ヒント集の目的は

それぞれのヒントの目的は受講生が行き詰まった際に、自力で次の行動が起こせるようにするためです。受講生が次のステップに進むのに、必要な最低限の情報を与えるのが良いでしょう。

必要事項

与えるヒントは簡潔で分かりやすいものにしましょう。質問形式や、シンプルな文章を使いましょう。

ヒントの例:

ヒント1
タイトル:どのドキュメント要素を見つけるかを知るために
説明:HTML文書で使用される要素がわかりましたか?

ヒント2
タイトル:CSSファイルをチェックするには
説明:どのCSSファイルが必要で、どのファイルが必要でないかを確認しましょう。

ヒント3
タイトル:スタイルシートのリンクを作成するのに必要なタグを思い出す
説明:<link>タグを使って、スタイルシートをHTML文書に組み込みます。

ヒント4
タイトル:リンクが機能することを確認する
説明:フォルダー構成を正しくナビゲートしましたか?

 

 

次のステップ

これで御自分のコースで、コーディング演習を始めるための必要事項がお分りいただけたと思います。次のステップは自由に以下のオプションからお選び下さい。

すぐに開始したい方は自分のコースに進み、先ほどのインストラクションに従ってください。

または、コーディング演習の実践例をご覧になりたい場合は、こちらをご覧ください。

または、受講生の学習をテストするための評価コードの書き方についてもっと学びたい方は、こちらの評価コードの例をご覧ください。

Java Script 演習
HTML演習
CSS演習