HTMLの表示方法

Atomで作ったHTMLを実際にChromeで動かす方法を紹介します!

Atomのパッケージを利用してAtom内で表示することもできますが、自分はデベロッパーツールをよく使うので、Chromeで毎回確認しています!

自分は画面を2つに分割して、左側がChromeで右側がAtomのように作業しています!

前回作ったコードを実際にChromeで実行するのでコードを作っていない人、コードの作り方がわからない人は前回の資料を確認してください!

HTMLの基本構造

HTMLの表示方法

作成したコードがしっかり保存できているか確認しましょう!

保存ができていないとChromeで表示しても反映されないので気をつけてください!

また、Atomでの保存は

Ctrl + S

で簡単に保存できるので保存する習慣をつけましょう!

では、HTMLをChromeで表示しましょう!

めちゃくちゃ簡単です!

保存されているフォルダをエクスプローラーで開きましょう!

あとはHTMLファイルを普通にクリックするだけ!

自動的にChromeが立ち上がりプログラムを実行します!

もし、このアイコンがChromeでは無い場合、ファイルを右クリックで選択しメニューを開き、プロパティを選択
プログラムの変更のボタンを押してChromeにアイコンを変更しましょう”

このように表示されればOKです!!

また、Atomで同じファイルのプログラムを編集した場合、
保存後、Chromeの更新 F5 を押せば自動的に反映されます!

いちいちファイルを開くことは無いです😊

0