【htmlコーディング】現役コーダーが選んだ必須ツール11選

今回は私が普段業務で使用しているアプリケーション、ツールのご紹介です。

デザイン関係

Adobe製品

Web業界ではAdobe製品ないと生きていけません。
Photoshop、Illustratorがないと仕事になりません。
それくらい大事な便利なソフトです。
会社支給PCのためCreative Cloud法人版がインストールされています。
https://www.adobe.com/jp/creativecloud.html

コーディング関係

エディタ

Atom

私が数々のエディタを触って中で一番自分にしっくりきたエディタです。
必要なパッケージをインストールすることで自分だけのテキストエディタに大変身。
https://atom.io/

TeraPad

ちょこっとだけの文字修正等をやるときに使ってます。
https://www.vector.co.jp/soft/win95/writing/se104390.html

バージョン管理ツール

TortoiseGit

バージョン管理本当に大事です。
いつどの場所を更新したかがわかります。
制作会社あるあるですが、いついつに更新したバナーまた復活させてー、みたいなことがあります。
そんな時このツールがあれば簡単に復活できます。
https://tortoisegit.org/

コンパイルツール

Koala

Sassで作ったファイルをCSSに変換（コンパイル）してくれます。
コマンドがわからない人向けの直感的に操作ができるアプリです。
http://koala-app.com/

仮想サーバー

Xampp

Apache等をインストールできるのでローカル環境でWordpressやMovable Typeを入れる事ができすごく便利です。
phpで動くサイトを確認するときなどにも重宝しています。
また、〇〇.localhostと登録しておくことで起動後すぐにローカルのデータをhttp://でアクセスすることが可能です。
要はテスト環境等サーバーにアップしなくとも自分のローカルでwebサイトの確認ができるということです。
コーダーにとってはすごく重要で便利なツールです。
https://www.apachefriends.org/jp/index.html

FTPソフト

WinSCP

FTP/SFTP/SCPで接続できるソフト。
細かい設定がいろいろできるので重宝してます。
https://forest.watch.impress.co.jp/library/software/winscp/

効率化ツール

タブ型ファイラ

Q-Dir

複数のエクスプローラーを開いて作業している方にすごくオススメ。
4分割までできるので私は「素材系のフォルダ」、「資料系のフォルダ」、「画像書き出しフォルダ」、「HTMLが格納されているフォルダ」の4つを常に開いて作業しています。
https://www.vector.co.jp/soft/win95/util/se507951.html

置換ツール

ファイル名変換君

フォトショップなどで書き出した画像ファイルや、圧縮して名前が〇〇-min.jpgみたいになっているファイルを、一括で名称変換する際に重宝しています。
https://www.vector.co.jp/soft/winnt/util/se397494.html

画面キャプチャツール

Snipping Tool

指示書を作るときに重宝しています。ソフトを起動して選択範囲を設定するだけで簡単に画面をキャプチャできます。
https://freesoft-100.com/review/snipping-tool.php

比較ツール

Rekisa　差分表示アプリケーション

制作したHTMLファイルなどを比較してどの部分がどう変わったか等を比較して確認するときに使っています。
https://www.vector.co.jp/soft/winnt/util/se308760.html

まとめ

普段私はいろいろなツールを使ってコーディングをやっています。まとめてみると結構数ありました。
コーディング作業をする中でいかに効率よく、いい意味で手を抜くかが大事です。
常に100％でやっていると疲れちゃいます。長続きしません。
ぜひ、便利ツールを使って効率化していきましょう。

では。