エンジニアステップ

初心者・未経験エンジニア向けの技術ブログ

DAY7. 『Progate HTML & CSS 上級道場コース』 #30DAYSトライアル

DAY7. 『Progate HTML & CSS 上級道場コース』#30DAYSトライアルです。

» 参考:【初心者からサイト制作で月5万円を稼ぐための30日間トライアル】まとめ

www.engineer-step.com

 

DAY7. 『Progate HTML & CSS 上級道場コース』課題

DAY7. 『Progate HTML & CSS 上級道場コース + 復習・休憩』ということで、復習日です。 

だいたい30分くらいでできました(中級より簡単かも)

 

『Progate HTML & CSS 上級道場』感想

『Progate HTML & CSS 上級道場』の感想です。

 

clearの使い方を以前調べたおかげで、すんなりできました。

学習に詰まったところほど、しっかり勉強しておくと、後から楽になりますね(自戒)

clearでfloatを解除するテクニックが紹介されていました。

なにをやっているか分かりづらかったですが、簡単に言うと

  • float指定しているから「次の要素」は続けて(右側に)表示されてしまう
  • でもやりたいことは、「次の要素」を改行して表示すること
  • だから「clear:left指定の空タグ」=「表示されない回り込み用の要素」を入れて、無理やり改行させる。そうすれば、改行された後から「次の要素」が表示される

みたいな感じかなと思います。

DAY5.『Progate HTML & CSS 上級編』 #30DAYSトライアル - エンジニアステップ

 

今日はぶっちゃけ、息抜きの日でして、この上級道場以外は、エンジニア勉強できていません(別ブログ書いてました)

 

【余談】フロントエンドの全体像

ショーヘーさんから余裕がある人向けの課題も出ていたのですが、まだ取り組めていません。

※余裕がある人どうぞ

 

ちなみに、

HTMLの次はCSSが出てきて、更にはJavaScript!

何がどんだけあるの!?\(^o^)/

 

…って方は「フロントエンドの全体像(ロードマップ)」を見るとなんとなく雰囲気わかると思います。

 

下記の画像はロードマップの一部抜粋です。

今やっているのは前半のHTML、CSSあたりですね。

JavaScriptがHTML,CSSの次にあるのが分かると思います。

f:id:alpacajp:20190113213103p:plain

frontend roadmap

引用元:GitHub - kamranahmedse/developer-roadmap: Roadmap to becoming a web developer in 2019

 

ふんわり知りたい方はこちらの記事を、流し読みすると良いかも。

» 参考:Web Developer Roadmap 2018が2019年版になっていたので比較してみる - Qiita

  

以上、DAY7. 『Progate HTML & CSS 上級道場コース』というお話でした。

 

明日からもまた、がんばりましょう~~

 

【関連記事】

  1. DAY1.『Progate HTML & CSS 初級編(4章まで)』 #30DAYSトライアル 
  2. DAY2.『Progate HTML & CSS 初級編(7章まで)』 #30DAYSトライアル
  3. DAY3.『Progate HTML & CSS 中級編(3章まで)』 #30DAYSトライアル
  4. DAY4.『Progate HTML & CSS 中級編(7章まで)』 #30DAYSトライアル
  5. DAY5.『Progate HTML & CSS 上級編』 #30DAYSトライアル
  6. DAY6. 『Progate HTML & CSS 初級・中級道場コース』 #30DAYSトライアル
  7. DAY7. 『Progate HTML & CSS 上級道場コース』 #30DAYSトライアル

www.engineer-step.com