見出し画像

【2020/02/04】 JavaScriptで『3つの箱』に動きを付けてみよう

今週のお題はJavaScriptになります。是非チャレンジしてみてください!

■ 本日の流れ

いつもどおりの流れです。

・21:00 課題発表
・21:30 課題提出締め切り、休憩
・21:35 コードレビュー開始
・22:00 番組終了

■ 3つの箱を作ってみよう

今回ですが、3つの箱を作って、JavaScriptで動きをつけてみてください。

画像1

今回の仕様は以下のとおりです。

・上図のような3つの箱をHTML/CSSで作ってください。
・1つ目の箱をクリックしたらスタイルが変わります。
・2つ目の箱をクリックしたら数値が増えます。
・3つ目の箱には自由なアイデアでなんらかの動きをつけてみましょう。
・なるべくモダンなJavaScriptで書きましょう(var禁止)。
・jQuery/React/Vueなどのフレームワークを使ってはいけません。
・サイズや色はご自身がもっとも美しいと思われるもので良いです。

なお、すぐに終わってしまった人はさまざまなバリエーションを出してみてもいいでしょう。

■ コードレビューを受けるには?

コードレビューを受けるには「256timesプレイグラウンド」をご利用ください。

使い方の詳細は「256timesプレイグランドの使い方」からどうぞ。コードレビューを受ける方法についても以下で説明しています。

・256timesプレイグラウンドの使い方|256times|note
https://note.com/256times/n/n9e81f49c8f5a

■ なにかあれば #256times まで!

その他、なにかあれば #256times でつぶやいてみてください。

・256times(@256times)さん / Twitter
https://twitter.com/256times

それではがんばってチャレンジしてみてくださいね!

この記事が気に入ったら、サポートをしてみませんか?
気軽にクリエイターの支援と、記事のオススメができます!
6
ドットインストールが展開するスパルタ方式プログラミングスクール『256times』の公式noteです。