1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

プログラミングど初心者のHTML学習まとめ その3

Posted at

本日の学習進捗

私が現在学んでいる教材はUdemyの「ウェブ開発入門完全攻略コース - HTML/CSS/JavaScript. プログラミングをはじめて学び創れる人へ!」です。

本日は
セクション4.新・HTMLの基本を知ろうの20.技術ドキュメント MDNの使い方を知ろうから
セクション4.新・HTMLの基本を知ろうの24. Live Serverの使い方を知ろうというチャプターまで見ました。

ノートに取ったメモ

MDN:ウェブ開発に関する技術情報を公開しているサイト。
実務でよく使うのはGoogle検索の方!「mdn html p」のように検索する。結構詳しく出てくるらしい。

ソースコードを記述する際のポイント:改行やインデントなしでも見た目は変わらない。とは言え、人間がソースコードを書く時は見やすいようにインデントや改行を行う。
                   ⇓
        見やすいコードは理解しやすく、保守性が高い!

Visual Studio Codeの設定をしよう

よくある質問について
Q.「!」+「tabキー」でHTML文書の雛形が作成されない
A.ドキュメントの拡張子が「.html」になっているかどうか確認。「!」は半角であるか確認。

補足
・管理→設定→検索「evpantion」→チェックボックスにチェックを入れて保存、VSCを再起
・lang="en"を"ja"に
 管理→設定→variables→項目の追加→項目をlang、値にjaを入力してOK
Shift+alt+Fで見やすく表示される
・エラーを~線で表示されるように設定。エラー内容は英語で出るのでコピーして翻訳
・全角スペースは▢、半角スペースは・で表示されるように設定

Live Serverの使い方を知る

・ ファイルを保存したタイミングで自動でページをリロードしてくれる拡張機能。リアルタイムでの開発が容易になる。
・ローカルで動作するサーバーを簡単にセットアップできる。開発中のウェブサイトやアプリケーションを実際のサーバーと同じ環境で表示が可能。

本日のまとめ(というより個人的な感想)

・ワードのように誤った箇所を表示してくれるのは純粋に便利だなと思いました。

・ショートカットで見やすく表示してくれるのも助かります。
・Qiitaで記事を書いていて改行が反映させたりされなかったりするのは何故なんでしょう…(下の画像のようになりました)
image.png
・普段使わない部分の脳を使っているせいか、最近やたらと眠いです。

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?