どうも、ひろです。
今回は、AIにサイトを作ってもらい、その後に課題をもらいます。
私は、AIが作成してくれたコードをいじって課題をクリアしていきます。
もらった課題は、1記事ずつ書いていきます。
理由は、より細かくHTMLとCSSを学ぶためです。
私は「はじめに」に書いてあるとおり、web系の専門学校には行ったのですが、色々事情がありスキルを活かせる仕事に就いたことがありません。
しかも、専門学校を卒業してから20年以上経っているので、もうスキル自体ありません。
つまり、私の立ち位置は
「学んだことはあるけど、ほぼ覚えていないし使えない」
初心者以下です。
なので、AIからもらった課題も場合によってはAIからアドバイスをもらい、クリアしていきたいと考えています。
※今回はJavascriptは使いません。
AIサイトを作成してもらい、課題をもらう
今回、AIにお願いしたものは
・自己紹介のサイトを作ってください
・初心者でもクリアできる課題をください
です。
AIは、この様なサイトを作成してくれました。

ピンクの背景に桜の絵。
下には、私の名前が書かれています。
その下には、私が今勉強している言語が書かれています。
最後に、「ブログを見る」の文字が書かれているボタンが配置されています。
今回出された課題

出典元:O-DAN
①文章の色や文字の変更
私の自己紹介のサイトなので、私の名前は変えず色のみ青に変えたいと思います。
その代わり、文字の変更は勉強中のところを趣味に変えたいと思います。
②背景色の変更
ピンクの背景を変えてくださいとのことです。
今回は、ピンクから黄色に変えたいと思います。
どこかに「back ground」というコードがあると思うので、そこの色を変えていき変わるのを確かめたいと考えています。
③花の種類を変更
🌸を🌻に変えたいと思います。
ここは、🌸の文字がどこかにあるので、比較的に簡単なんじゃないかなと思います。
④ボタンの色を変更
ボタンの色を濃いピンクから濃い黄色に変えたいと思います。
今回、私が1番不安なところです。
AIも1番の課題だと感じているはず。
ですが、どこかに「button」のタグがあると信じて変更していけたらと思います。
悩んでいるところ

出典元:O-DAN
以前、HTMLは家でCSSは家具と表現したことがあります。
しかし、今回AIが作成したサイトを見て課題をもらい思ったことは、家と家具に区別がよく分からないです。
家が枠組みだとしたら、中の文字や絵文字は家具なのかな?
なら、CSSで書いてあるのかな?
でも、文字はHTMLの方で書いていたと思う。
また、やはり1番の悩みは「ボタンの色の変更」です。
普段の色は変えられたとしても、カーソルがボタンの上に置いた時の色変更がどこにあるのか見当もつきません。
少しずつコードを変えていき、クリアしたいと思います。
終わり

始めは自分でコードを変えクリアしていきたいと思っています。
しかし、どこを変えてもクリアできない場合は、おとなしくAIさんにアドバイスをいただこうと思います。
ただ、初心者向けの課題なので、今まで学んできたら今回の課題はクリアできるとAIさんも言っていたので、なるべくはアドバイスを貰わずにクリアしたいです。
次回は、「文章の色と文字を変える」を行なっていきたいと思います。
もしかしたら、分からなすぎてAIにPythonでコードを書いてもらって遊んでしまうかもしれません。
その時はご容赦ください。
ご覧くださりありがとうございました。
