こんにちは。mito(@mito_works)です。
今回はコーディングのスキルアップのために挑戦している#30DAYSトライアルの記録を書きます。
30DAYSトライアルは、独学を前提としたプログラミング学習プログラムです。
#30daysトライアルとは何?どうやって始めるの?といった疑問をお持ちの方、こちらをご覧ください。
#30DAYSトライアル
2nd DAY29,30:実践コーディング
今までの知識を総動員させてとなんとかできましたっ!!
うれしい♪♪♪「できるものなんだ!」ってすごく自信になったけれど、
もう少し余裕を持ってできるようになりたい!!
(約4~5日かかりました。) pic.twitter.com/U9Sj1tF2FR— mito@ひよっこwebデザイナー (@mito_works) October 21, 2019
30DAYSトライアル 2ndでどんなことが学べるのか気になる方
30DAYSトライアル 2ndのコンテンツに興味ある方
2nd前半の学び
コードの書き方からアニメーションの使い方まで幅広くインプットできました。
2nd後半
学んだことを試す場。前半で学んだSassやjQueryやJavaScriptを使って実践です。
人から「これポイントですよ!」と教えられたことよりも、実践の中で「これはポイントだ!」と気づいたことでは、「めちゃくちゃ重要なことだ!」という切実さが違います。
そして知識としての定着率も変わってくることを実感しました。
ほんとに今更だけど、bootstrapは煩雑になりがちなcssのコードを減らすために使うものと気づいた。(私の見解)
便利〜と思って、本来の目的わからず闇雲に使うの良くないな><。#30DAYSトライアル— mito@ひよっこwebデザイナー (@mito_works) October 17, 2019
BootstrapはCSSフレームワーク(骨組み)なので、ワイヤーフレーム時点で必要な箇所に必要な分だけ使うようにする。
計画的な使い方が大事なんだと学びました。
最終課題の学び
#30DAYSトライアル
2nd DAY27,28:実践コーディング
残すところレスポンシブ対応。
背景デザインが一色のベタ塗りではないので、「これどうやって実装するんだろう?」と悩み、positonを多用することに。divの囲み方含め試行錯誤したので勉強になりました!あと少し〜。 pic.twitter.com/lo7ScgDwjF
— mito@ひよっこwebデザイナー (@mito_works) October 21, 2019
3日で終わらせるのがベストという演習を4~5日かけました。
https://twitter.com/mito_works/status/1186476124886298624
それから「このデザインよく見ている気がするけれど、どこで見たか思い出せない・・」というものが結構ありました。
実装方法の引き出しを増やしていきたいと思います。
まとめ
1stから約2ヶ月間取り組んだ #30DAYSトライアル。
2ヶ月前には、今は当たり前のように使っているテキストエディタVscodeも知らなかったし、BootstrapもScssも知らなくて。。
0から10以上になった知識。ふりかえると、毎日の積み上げてきたもの、感慨深いです。
知識のインプットからそれを使ったアウトプットまで止まることなく一気通貫で取り組めてスキルアップできるものだと思います。
全力でオススメします!
- コーディングはワイヤーフレームを書いてから行う。(Bootstrapは計画的に使う)
- 日頃からサイトを「私だったらこのパーツをどうやって実装するか?」という視点でみる