Codepenを使ってHTML、SCC、JavaScriptの技術を磨く

1 min read読了の目安(約800字

なんでやろうと思ったか

せっかくHTML、SCC、JavaScript勉強したのに、いざ使うとなったら全然手が動かない…😥
そもそも実際にこの3つを組み合わせて何が作れるの???
みんなどう書いてるの???
というモヤモヤを解決したくて始めることにしました

Codepenとは

HTML、CSS、JavaScriptのコーディングができるサイトです
書いたものが片っ端から動いてくれるので、めっちゃ分かりやすいです👌
詳しくはこちらをご覧ください😀

https://goworkship.com/magazine/codepen/

何が良いか

良いなと思ったポイントはこの3つ
・❤の数で人気なものが分かる
・その場で動かせる
・無料で使える

どうやるか

1 Trendingから❤が多くて試してみたいお手本を探す

こんな感じで世界中の人が投稿してくれたコードがあるので、やってみたいものを探します

2 Forkして自分の所に持ってくる(うっかりお手本をおかしなことにしないため)
3 Forkしたものをいじったり、自分で一から写経してとにかく手を動かす

これが実際の画面です
Forkして中身をいじって変化を見たり、自分で初めから書いて勉強するのも良さそうです

4 これを積み重ねる!

毎日ちょっとずつ書いて、GitHubにアップしてモチベーション保つと良さそうですね🥰

まずは手始めに、この写経をしてみたいと思います😁