今年はおうち時間が長かったこともあり、家でお勉強したり、本を読んだりする時間が格段に増えたと感じています。その中で、一つ学んだことを共有します。

今年の春から夏にかけて、コーディングの知識を深めよう！！ということで、1人コーディングブートキャンプを実施していました。

毎回、その日学んだこと、つまづいたところ、そして、明日以降進めたいところをesaに書きながら勉強していきました。コーディングしながらここにひたすらメモをしてく。振り返ると、全部で第40回にわたる勉強会となりました....!　

今回の勉強会の条件は以下にしました。

・既存サイトの模写をする。

・セマンティックな構造で書く。

・CSSの記法をFLOCSSで書く。

・あくまで構造を知るためなので、デザインの細部までは気にしない。

・トップページのみつくる。

・１週間１サイト

・毎日小さなことでも１つ、知識をアップデートする！

今回はあくまで、構造と記法を理解するというところだったので、クリエイティブの細かいところはそこまで気にせずとしました。

サイトを選ぶ条件は、自分が好きなデザインか、というところを軸に、よくあるサイト構造をチョイスしました。

・・・

本当にくだらないくらい小さいことでも、学んだことをメモしていくことで、モチベーションを保つことができたなと感じています。

だいたい２ヶ月くらいで、６サイトほどのサイトを実装。当初10サイトが目標でしたが、調べ物をしたりする時間が結構あり、思うように進まず。。。

あとはスタートのエンジンをかけるのに少し時間かかっちゃったかなぁ〜という気がします。

・

しばらくして、デザインだいぶ変わっちゃったのも多いのですが.......

airbnbのサイト

↓模写したサイト

bakeのサイト

↓模写したサイト

wordpressテーマ SANGOのデモサイト

↓模写したサイト

というような感じで完璧に同じデザインではないのですが、サイト構造をみて反映していくことを意識して行いました。

このコーディングブートキャンプを通して、

FLOCSSで書くということに抵抗感がなくなり、他のサイトもやってみたいと思えてきました。コーディングはもくもくと進められるので楽しいですね。次回からは条件をもう少し厳しくして挑もう。

これから、もし1人で勉強はじめようと思っている方に、何かしら参考になったら嬉しいです。

ということで、今年後半も引き続きやっていきます。そのときはまた、こちらにまとめようかなと思います！！！