見出し画像

JavaScriptが楽しすぎる件について

お疲れ様です。コノタビデザインです。

昨日まででやっとphpのカリキュラムを終えることができました。
もちろん終わらせることが目的ではないので、ここからが勝負なんですが(笑)

phpに関しては、二ヶ月前くらいに一度、カリキュラム取り組もうとしたんですね。でも、なぜだかそのときは、変数と定数のところでバカつまづいちゃって、サイトとかで「php 変数」とかで調べまくってそれでも挫折したんです。

でも、なぜか最近もう一度やってみようと思い立って、初めてみると、なんであんなことにつまづいていたんだろうと思うくらいに、進む進む!

距離を置いてみるということの大事さを知りました(笑)
これを言ったら。「彼氏かよ!」と突っ込まれたのですが(笑)

プログラミングにおいても恋愛においても、一旦離れてみるのが大事かもしれません。

私はphpを学んでどんなことができるようになりたいかと言うと、WordPressのオリジナルテーマを作成できるようになる!今は有料テーマで、お仕事も対応しているのですが、カスタマイズすらできないのは、悔しいし、WEB制作者としてどうなんだ!と思ったんですね

phpで苦戦したところはまた今度記事にしてまとめますのでお楽しみに

そんなこんなで今日からカリキュラム的にはJavaScriptに入りました!

いやー楽しい楽しい。なにが楽しいかってやっぱり目に見える形で動きをつけられることです。今日なんかはめちゃくちゃ簡単な動きをソースコードで書いたくらいですが

こちら、日清のサイトなのですが、これは有名なので知っている方もいるかも?こんなホームページ作れるデザイナーとエンジニアまじで尊敬です。恐れ多い。。。

JSは要素に動きをつける言語ですが、コードを書いたり読んだりする上で重要なことを学びました

なにかをきっかけとしてAという動作が起こる

document.getElementById('target').addEventListener('click',()=>{
            document.getElementById('target').classList.add('circle')
        });

これだけ見ても、は??ですよね。
実際に書くときはJQueryを使って書くので、ここまで長いコードは打ちませんが(今日JQuery学んだ人ここにいます)(笑)

document.getElementById('target')

という指定した要素に対して

addEventListener('click',()=>{

その要素をクリックすると(きっかけ)

document.getElementById('target')

この要素が

classList.add('circle')

こうなるよ!と。
circleという指定された要素はどうなるか記述せんとですね

これがかなりばちーーんと私の中ではまりました!

明日もやるぞ。

#JavaScrept #WEB制作 #プログラミング #フリーランス #独学
#社会人の勉強 #WEBデザイナー #フロントエンドエンジニア

この記事が気に入ったらサポートをしてみませんか?