3
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

iCARE DevAdvent Calendar 2021

Day 4

CSS学習サイト3選

Posted at

この記事はiCARE Dev Advent Calendar 2021カレンダー2の4日目です。

私は現在、フロントエンドエンジニアとして株式会社iCAREで働かせていただいております。
フロントエンドエンジニアですが、CSSがとても苦手です。
CSSと仲良くなって得意分野と言えるように、学習を続けていきたい所存です。
今回はCSS学習サイト3選というお題です。
私がCSS学習する上で利用しているサイトを3つご紹介したいと思います。

FLEXBOX FROGGY

1つ目はFLEXBOX FROGGYです。ご存知の方は多いと思います。
flexboxを学習できるサイトです。
CSSコードを書いて、カエルのキャラクターを蓮の葉の上に乗せるゲームです。
レベル1〜24まであり、レベルが上がるにつれどんどん難しくなっていきます。
レベル24をクリアできたらflexboxマスターになれる気がします。
flex_box_floggy.png

Free Code Camp

2つ目はFree Code Campです。
CSSだけではなくプログラミングについて無料で学ぶことができるサイトです。
CSSについては、基礎から応用まで学ぶことができます。
一度の学習ではなかなか身につかないので継続し利用していきたいです。
海外のサービスのため日本語には対応していませんが、英語学習もできて一挙両得感があります。
free_code_camp.png

Markup

最後にご紹介するのは、Markupというサイトです。
レイアウトに特化した無料のCSS学習サイトです。
STEP1〜STEP4まであり、順番に学習もできますし、自分が学習したいSTEPだけを勉強することもできます。
Webサイトのスタイリングをしていく感覚で学習できます。
markup.png

まとめ

今回はCSSの学習サイトを3つご紹介させていただきました。
普段CSSフレームワークを使って開発していると、ついついCSSの書き方が分からなくなってしまいがちなので、これからもこれらのサイト活用して学習を続けていきたいと思います!

3
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?