元Webデザイナー兼コーダーの備忘録

学びを形に:プログラミングとウェブデザインの勉強メモ

 ãƒ¡ãƒ‹ãƒ¥ãƒ¼

» HTML|入門ガイドはこちらです。

トップ > エディタ > AtomにLiveServerを追加してコーディングを効率化する

AtomにLiveServerを追加してコーディングを効率化する

エディタ

今回は、LiveServerについて書きます。色々と調べていたらLiveServerというものに出会いました。ウェブサイトを制作する方にとって便利な機能なので導入してみると良いです。

コーディングの流れ

  • 編集
  • æ›´æ–°
  • 確認

上記のような流れでコーディングすると思います。ここで面倒なのが、エディタからブラウザに切り替えて更新する作業です。特にCSSの編集をしているとこの作業を頻繁に行います。LiveServerを使うと自動でブラウザを更新してくれるので、エディタからブラウザに切り替えて更新する手間を省けます。

LiveServerの追加

  • atom-live-server-plus

上記のパッケージをAtomに追加します。これは、ファイルが更新されると変更内容をリアルタイムでブラウザに反映します。使い方については、参考サイトをご確認ください。

所感

一昔前はこのようなものが無かったので、今は非常に便利になったと感じます。一方で今後エンジニアを目指す方は、勉強量が増えて大変なのではないかと勝手ながら思います。

過去からの繋がりで今の技術があるので、基礎知識と新たな知識が必要になります。新たな知識は、今後も増え続けると思います。そのため、エンジニアの勉強には終わりがないものだと考えた方が良いです。

参考サイト

» Processingの記事一覧はこちらです。