HTML/XHTML

 

 / 最終更新日: 2021.08.31

【Atom】HTMLの授業で利用している拡張パッケージ


こんにちは。
@OfficeTAKUです。

個人的にも、専門学校のHTMLの授業でも、エディタはAtomを利用しています。
備忘録がてら、利用しているパッケージをまとめておきます。

Atomのパッケージとは

Atomには、機能を追加できるパッケージというものがあります。

パッケージには、
コアパッケージ(標準でインストールされているもの)
コミュニティパッケージ(ユーザーが各自で追加できるもの)
の、2種類があります。

ここでいうパッケージは、2番めのコミュニティパッケージです。
拡張機能とか、拡張パッケージとか、表記されることもあります。

あまり増やしすぎるとやはり起動や動作が遅くなったりするらしいです。
(私の場合は今のところ特に問題はありません。)

インストール方法

  1. [環境設定(Settings)]を開く
  2. [+インストール(Install)]を開く
  3. 検索ボックスにパッケージ名を記入
  4. 検索結果から該当のパッケージの[インストール(Install)]ボタンをクリック
    Atom 環境設定

で、インストールできます。

[環境設定(Settings)]を開くショートカットキー

Win: Ctrl+,

Mac: command+,

HTMLの授業で利用しているAtom拡張機能

便利なパッケージは山のようにありますが、ごくごく定番のものだけを利用しています。

japanese-menu

japanese-menu
その名のとおりAtomのメニューを日本語化するパッケージです。
留学生たちの授業では日本語化せずに利用したりします。

emmet

emmet
HTMLタグやCSSの入力補完をしてくれるパッケージです。
Zen-cording という名前の頃からmiやWordpress、DreamWeaverなど利用していました。

autocomplete-paths

autocomplete-paths
その名のとおりファイルへのパス入力を補完してくれるパッケージ。
画像ファイルやリンクの時に便利です。

color-picker

color-picker
こちらもその名のとおりカラーピッカー機能を追加してくれるパッケージ。
カラーパレットから色が選択できます。
右クリックメニュー[カラーピッカー(Color picker)]から、あるいは下記のショートカットキーで実行できます。

Win: Ctrl+Shift+C

Mac: shift+command+C

atom-html-preview

atom-html-preview
Atom 内でHTMLファイルのプレビューを表示できるパッケージ。
右クリックメニュー[Preview HTML]から、あるいは下記のショートカットキーで実行できます。

Win/Mac:Ctrl+Shift+H

atom-beautify

atom-beautify
書いているコードを自動できれいに整形してくれるパッケージ。

右クリックメニュー[Beaty editor contents]から、あるいは下記のショートカットキーで実行できます。

Win: Alt+Ctrl+B

Mac: cotrol+option+B

まとめ

今回はAtomで利用できる機能拡張パッケージについてでした。
インストールすることで、格段に使いやすくなったり、効率的になったりします。

インストールも、アンインストールも簡単です。
良さそうなパッケージは気軽に試すことができます。

個人的には何か便利そうなのを見つけるとついついインストールしてしまいたくなります。

でも、あまり増えたりすると起動や処理が遅くなったりしますので、ほどほどに。
不要なものはアンインストールして、整理整頓するようにしましょう(自戒をこめて)。

【Excel】住所から都道府県名を切り出す方法(IF関数を使わない方法も)前のページ

ピックアップ記事

  1. Apple Music や Amazon Musice でクラシック音楽の楽曲・…
  2. [レビュー] リンダ・リウカス『ルビイのぼうけん こんにちは!プログラミング』:…
  3. [レビュー] 『親子で学ぶ プログラミング超入門 ~Scratchでゲームを作ろ…
  4. 【Amazon】6ヶ月間無料体験可能! 学生のみなさん Amazon Prime…
  5. [レビュー] レノボ 「TAB4 8 Plus」 画面が美しく動画もマンガも満喫…

関連記事

  1. HTML/XHTML

    RSSフィードのアイコンと説明ページを自動生成してくれるサービス

    WordPressをトップディレクトリにインストールするのが嫌だったの…

LINE公式アカウント:OfficeTAKU

OfficeTAKU Line公式アカウントバナー

最近の記事

人気の記事

  1. 日商PC検定
  2. ロジクール MX KEYS(MAC用)
  1. 日記

    サマータイムは亡霊か?何度も呼び戻されてくる愚策に対抗するために知っておくべきこ…
  2. iOS

    [iPhone] AirDropで写真を共有しようとしたら、AirDropがみ…
  3. EZCON RemoEZ

    Hard・Acc

    【レビュー】Alexa専用スマートリモコン「Remo Ez」-アレクサに声をかけ…
  4. タウンページ2018.9『北陸とらいあんぐる』

    電子書籍

    『北陸とらいあんぐる』が表紙に描かれたNTTタウンページが昨日届いたので無料で読…
  5. 【Facebook】不審なメッセージリクエストでグループ作成のお知らせが届いたら

    Facebook

    【Facebook】不審なメッセージリクエストでグループ作成のお知らせが届いたら…
PAGE TOP