Skip to main content

コード編

目標#

Progateの『JavaScript I』をクリアする

そもそもウェブサイトは何でできている?#

ウェブサイトは、HTMLとCSSというプログラミング言語で作られています。 具体的には、HTMLでは文字や画像などのウェブサイトの中身の部分、CSSでは文字の色や配置などウェブサイトのデザインの部分が書かれています。

例をみてみましょう!

この図では、左側のHTMLのコードが右側がウェブサイトで書かれています。「コードで書かれている」というのはどういうことでしょうか?

(左側)HTMLコード (右側)ウェブサイト

よくみてみると、「左側のHTMLで書かれている文字が右側のウェブサイトに表示されている!」ということに気づきます。どうやら、文字はそのまま表示されるようです!

JavaScriptは何ができる?#

JavaScriptを学ぶと、「動き」のあるウェブサイトを作成することができます。

例えば...

  • ただ画像を表示するだけではなく、スライドショーとして順番に表示することができる
  • 現在の時間を表示できる(時間が進むと表示も変わる)
  • おすすめの紹介のうち、ランダムでおすすめを表示できる

ProgateでJavaScriptを練習しよう!#

Waffle Camp当日は、実際にJavaScriptを使って、「動く」ウェブサイトを作ります。 まずは、最初の準備としてJavaScriptの書き方に慣れる練習をしましょう!

この課題は、Progate(プロゲート)というオンラインのプログラミング学習ツールを使って行います。以下のリンクからProgateを開き、手順に沿って登録して下さい。

ここをクリックしてProgateを開く

1.「今すぐはじめる」をクリックします。

2.「アカウントを作成」という画面が出てきたら、名前(ニックネームも可能です)とメールアドレス、パスワードを設定して「新規登録」をクリックします。これで登録は完了です。

3.一度登録したら、以下のリンクから「JavaScript」のページを開いて下さい。#

ここをクリックしてProgateのJavaScriptのコースを開く

「JavaScript」のコースへ行くと、1~6が並んでいます。
今回の宿題は「JavaScript I」です。「レッスンを始める」をクリックして早速始めてみましょう!(所要時間:2時間)

「JavaScript I」のレッスンが完了したら、事前学習コード編は完了です!#

つまずいたことや質問があれば、メール(camp@waffle-waffle.org)または、Discordの#camp-prepチャンネルで聞いてくださいね!