異業種からITエンジニア、ブロガー転換を目指す４０歳おじさんの勉強ノート。
スキル書き溜めとして、簡潔まとめ。
レッスン内容
Chromeブラウザを導入しよう
VS Codeエディタを用意しよう
プログラミング用フォントを導入しよう
ファイルの拡張子を表示させよう
ドットインストール HTML/CSSの学習環境を整えよう より
身につくスキル（これが出来る）
- ブラウザのインストールが終わる
- テキストエディタの基本設定が終わる
- ソースコードが見易くなる
- 拡張子表示でファイルの種類が一目で分かる
勉強になったこと
① テキストエディタ：VS Code
マイクロソフトが無料で提供しているテキストエディタ
良いところ：次のレッスン「はじめてのHTML」で実践しながら学べる。
＞ 過去の反省点
- ドットインストールを知らなかった頃の自分はMacのAppStoreから無料エディタを探し回った
- 自分で見つけたテキストエディタはVS Codeではなかった
- 探し回る時間や他のエディタの使い方を覚える時間がムダだった
② プログラミング用フォント：Ricty Diminished
- プログラミング用フォントの１つ
- 全角スペースが可視化される
- スペースが全角か半角か、見分けがつく
- 全角スペースの混入はバグの要因！
説明不足と思ったこと、調べたこと
① Ricty Diminishedの良さ
- 混同しがちな文字や記号 が見やすいフォントデザイン
- 半角と全角の大きさが１：２
- 文字の縦並びが揃って見やすくなる（等幅フォント）
② テキストエディタ、ソースコードとブラウザ自体の説明がない
＞ テキストエディタ
- プログラミング言語で「何を」「どのように」表示するのかをソースコードとしてテキストエディタに書き込む
- ソースコードをファイルとして保存する
＞ ブラウザ
- ソースコードを記述したファイルを読み込む
- ソースコードの指示に従って、ブラウザ上に内容を表示する
WEBページが表示される仕組み よく分からない人は
イメージとして予備知識があった方がいいと思います。
Amazonで試し読みで勉強できるのでリンクを貼っておきます。
- WEBページが表示される仕組み
- HTMLとCSSの役割
