34
Code_cademy でで でででで Tsuyoshi Motobe

Code cademyの学習方法

Embed Size (px)

Citation preview

Code_cademyでの

学習方法

Tsuyoshi Motobe

Code_cademy はプログラミングの基礎を

自習形式で学習するWeb サービスです。

無料で利用できます。

丁寧に作られているので初心者や初級者に

ちょうど良いサービスです

学習システム

新しい知識をインプット

課題が出る

回答をコードで書く

回答チェック

これを何度も繰り返します。

では、やってみましょう

www. codecademy.com

にアクセス

今回は、 facebook でログイン

HTML & CSS を選択

START

翻訳:全てのレッスンはここから始まります。説明を読んでから、下部のインストラクションに従ってください。もし行き詰ったら、“ヒント”を押してください。

翻訳:コードをここに書いてください。インストラクションに対する回答をここのエディターに書いてください。

翻訳:どうなったか見てください。あなたのコードがブラウザでどんな風に表示されるかここで見れます。

始まりました!

まずは、ここを読みましょう。ここでは、この回で学ぶ知識の説明と、課題が書かれています。

すべての Web ページは、 HTML と呼ばれる言語で書かれています。HTML はすべてのウェブページに構造を与える骨格と考えて良いです。このコースでは、 Web ページに段落、見出し、画像やリンクを追加するために、 HTML を使用します。

右のエディタでは、 test.html という呼ばれるタブがあります。これは HTML を入力しますファイルです。 < > s のコードを見てください。これあg HTML です!他の言語のように、固有の文法(コミュニケーション・ルール)があります。

「 Save and Submit 」を押すと、結果タブは、インターネットブラウザ( Chrome 、 Firefox 、 Internet Explorer など)のように動作します。ブラウザの仕事は、認識可能な Web ページにtest.html というのコードを変換することです!ブラウザは、 HTML の文法に従い、ページをレイアウトする事ができます。

翻訳

下にスクロールすると、インストラクションがあります。ここに手順が書いてあります。

01. 右側に test.html というファイルがあります。

02. 2 行目のテキストを変更します( <strong > と < / strong>の間)何でも好きなテキストに変更してください。

03. Save & Submit Code  を押すと、 test.html がブラウザでどのように見えるかを確認できます。見えましたか? <strong> < / strong> のタグは、私たちのテキストを太字にしましたよ!

翻訳

どうしても、詰まってしまったら、ヒントを押しましょう。ほぼ回答なので、できれば押さない方が良いです。

今回の課題は、 <strong></strong>の中身を変更することでしたので、

こんな感じに変えました。

こちらも変更されているのが確認できます。

Save & Submit Code を押してください。

正解すると、 Way to go! と表示されます。「 Start Next Lesson 」ボタンを押して次に行きましょう!

次の回に進みました。2/14 となっているのが確認できます。

次の回に進みました。2/14 となっているのが確認できます。

ここの数字を変更することで、違う回に行けます。

もし簡単すぎるようであれば、ここの HTML & CSS を押してください。

先程の進捗が表示されています。

より高度なコースに進むこともできます。

これを何度も繰り返します。

HTML & CSS の所要時間は平均 7 時間です。

自分で自習してもよいですし、他の人と一緒にやっても良いです。

一人ではモチベーションを継続するのが難しい場合は、何人かで一緒にやってみましょう。

オンラインでの勉強会に参加したい場合はこちらへどうぞ。https://remoday.com/

英語の翻訳についても、フォローを入れます。