JavaScript 【🍎dotinstall③ 】〜🐾立ち止まって一旦復習👣〜

前回、dotinstallさんに導かれながら作成したコードはGitHubさんでも順調に公開できたので、今回はそこまでを（出来るだけ）自力で出来る様に書いていきます٩( 'ω' )و⭐️

【やり方】
今回は「Atom」を使用。（Visual Studio Codeとの違いに興味有）
動画を再確認したのち、自分で書いてみる。（伝家の宝刀・一時停止確認なし）

🍀Atom
　→相変わらず、「html」と書き出しただけで、bodyまでの雛形を全部自動出力してくれる😅
　　⚠️Atomさんの場合、書き出しを「！Doctype」にすると自力書き出しになる。
　→<style media="screen">
　　 media="screen”が自動出力されたので調べてみた👀

スマホ対応！CSSでメディアクエリの書き方【初心者向け】

　→色の出力が気になったので、インストールしてみた。

Atomでcssで使用している色を検索し、一覧を出力する方法

VSC↓

Atom↓

今のところ… VSCの方が良いかも…😅

「Atom 1.32」が正式公開 ～構文解析システム「tree-sitter」をついにデフォルト有効化／メインプロセスとレンダラープロセスでそれぞれ約45MBのメモリ消費量削減

と思って、調べてみて、「Use Tree Sitter Parsers」を解除したら、

カラフルになりましたとさ💛💚💙❤️💜

🌸flex-wrap :wrap ;

flex-wrap - CSS: カスケーディングスタイルシート | MDN

🍀const div = document . createElement ( ' div ' ) ;
　　　　　　　　　　　　⚠️定義時の最初は「create」

🍀document . body . appendChild(div);　←「bodyに対してdivを加えるよ」
   　　　　　　　　　⚠️ append→追加

🍀text-align:center;
　line-height:100px;　←⚠️「 line 」textにしちゃったので注意😱

🍀const num = 15;
　 const winner = Math . floor(Math . random ( ) * num);
　　　　　　　　　⚠️「 . 」と「( ) 」忘れに注意！😱

🍀transition　と　
　 transform scale → 要素の拡大・縮小

CSS トランジションの使用

transition - CSS&colon; カスケーディングスタイルシート | MDN

transform - CSS&colon; カスケーディングスタイルシート | MDN

🍎今回の記録

JavaScript Practice

【まとめ】
最初は③-1、2になるか⁈と思う程習得に自信はなかったのですが、意外と、2回目はスムーズに理解できるようになりました。もちろん課題は、今回出てきた武器（コーディング方法）をスムーズに使いこなせるかいかが？です。
また、html /css、JavaScript以外でも、dotinstallで基礎確認はしていこうと思いました。
では、
今回の関数と仲良くなろうの旅は一旦終了で、Progate様に戻って、JavaScriptのⅣからまた始めまーす٩( 'ω' )و⭐️☔️⭐️