お役立ちコラム

COLUMN

  1. ホーム
  2. コラム
  3. 無料テキストエディタAtomの便利パッケージ5選

無料テキストエディタAtomの便利パッケージ5選

こんにちは。

暑い日が続いてますが熱中症には気を付けてください。
私は仕事中こまめに水分と塩分のとれる飴をとっています。
体を壊さずに夏を乗り切りましょう!

さて、話は変わりますが皆さんホームページ制作時どんなテキストエディタを使っているのでしょうか?
Dreamweaver、WebStorm、Atom… たくさんのエディタがありますね。
初心者の方は無料のテキストエディタを使用している方がほとんどだと思います、
今は無料のエディタでもかなり高機能なものもあり効率的にコーディングすることができますね。

私は無料エディタはAtomを使っていますが、なんといってもたくさんのパッケージプラグインがありすごく便利!
今回は無料で高機能なAtomの便利なパッケージをご紹介したいと思います。

指定色が一目で分かるパッケージ

pigments
カラーコードに色を付けてくれるパッケージです。
どのタグにどんな色を指定したのかがすぐ分かります。
指定した色コードと同じ色が背景色に設定されるといった感じです。
一目で分かるからすごく便利です!

ソースコードを自動的に整形してくれる

atom-beautify
ファイルの種類に応じて、字下げを自動的に行ってくれます。
ショートカット (Ctrl + Alt + B) で自動的に整形してくれるので便利!
きれいなソースの方が読みやすく修正もしやすい!後々手を加える時にもやってて良かったと思います。

HTMLを素早くかけるパッケージ

emmet
「#header」と入力すると、に変換され、
「#header>h1」と入力すると、に変換されるという便利な機能です。
単純にHTMLのコーディングがはかどります。
打つ文字が少ないと、単純に時間が短縮されますね!

ソースの全体図を表示するパッケージ

minimap
ソースの全体図を画面内に表示してくれるパッケージです。
ソースが長文になるほど自分が今どのあたりにいるかわからなくなりますよね…
迷子になるのを防ぐため、長文なソースもあまりストレスを感じなくなります。

コーディングスタイルを統一するパッケージ

editorconfig
EditorConfigは、開発者がさまざまなエディタとIDE間で一貫したコーディングスタイルを定義し、
維持するのに役立ちます。
複数人で作業していると、インデントがタブだったりスペースだったり、インデント数が2つの人もいれば4つの人がいてプロジェクトごとに毎回エディタの設定を変えるのは不便ですが、EditorConfigに対応したエディタを開くだけでコーディングスタイルと整えてくれます。

ということでざっと5つのパッケージをご紹介致しました。
まだまだたくさん便利なパッケージはありますが後々更新していきます。

コーディングを行う上でやはり時間の短縮、効率化はとても重要なことです。
その分品質をあげることができ、またミスをなくすことにもつながってきます。
できるだけ作業の個数を減らし確認や調整に時間を使いクライアントの満足のいくサイトを創っていきたいですね。

暑い日が続いているので熱中症対策です。
熱中症のときには、水分・塩分補給がポイント。水分だけでなく塩分も補給することで、
症状の改善が期待できます。
塩分の補給には、塩分を含む飴・タブレットや梅干しがおすすめです。
長時間のスポーツなどの際は塩分に加え糖分の入ったスポーツドリンクがおすすめです。

体を壊さず頑張りましょう!

MAIL MAGAZINE

ホームページ・ECサイト運用に関する
情報をメルマガで配信中!

WEB担当者様向けのお役立ち情報を
無料でご案内しております。
登録は下記フォームから!


お問い合わせ

CONTACT

株式会社デザイントランスメディアは、通販コンサルティング / ホームページ制作・WEB制作、ECサイト/ 通販システム開発など、WEB戦略を
トータルで支援する福岡のWEB制作・コンサルティング・マーケティング会社です。

WEBマーケティング戦略立案、集客、WEBコンサルティング、サイト分析でお困りの際はお気軽にご相談ください。

成果報酬でのご提案、補助金を利用したサイトの制作も行っております。

お電話からのご相談はこちら

092-832-1133

受付時間:10:00 - 19:00(土・日・祝日を除く)

フォームからのご相談はこちら

会社案内資料ダウンロード