赤ペソ先生 
主にブログにしか使ってないんですけどね(^_^;)
ども。赤ペソ先生（@spinf60）です。
今回の記事は、備忘録です。記憶力の乏しい私の外部記憶のためなのでリンク多用です。
Brackets
Bracketsとは
Bracketsは、HTML、CSS、JavaScriptで開発されているオープンソースコードエディターです。Windows、Macなどで利用できます。
BracketsとはIllustratorやPhotoshopで有名なAdobeが開発した無料のエディターです。
インストールしたら日本語でスグに使えるし、豊富なプラグインで機能を追加することで、自分好みの使いやすい設定できるため、Web制作をされている方に愛用されてます。
WEBページの製作時、変更した場所がリアルタイムで更新確認できるので便利です。（Choromeをインストールしておく必要があります）
ダウンロード＆インストール
公式ダウンロードページはこちらから。
Brackets – A modern, open source code editor that understands web design.
インストール方法などは、上にリンクを貼ってある寝ログさんが詳しいので参照(笑)。
プラグイン を探すのに参考になるサイト
Web制作が爆捗するBracketsプラグイン13選＆便利なプラグインを探すコツ – ＠IT
こちらのサイトを参考にプラグインを導入しました。
私が使っているのは、
- Beautify
- 右クリック拡張
- minimap
特にBeautifyは超使ってます。
その他備忘録
フォトショップで作成したデザインカンプ（完成形のイメージ）のpsdファイルを開いて作業することができるので便利。
私の使い方
Windows Live Writerの時にも書いたような気がしますが、ライブドアブログのソースがなんか変な感じになるんですよ。もう諦めたけど。
それで、ソースを修正したい時にBracketsのBeautifyプラグインを使用しています。
１．ソース整形用の適当なファイル名をつけたhtmlファイルを作る。
↓
２．そこに汚いソースを貼り付け。
↓
３．ソースをCtrl + aで全選択
↓
４．右クリックメニューで表示される Beautifly をクリックで整形
↓
５．Ctrl + a で全選択し、Ctrl + c でコピー
↓
６．Ctrl + v で貼付け。
ちなみに、１．でhtmlファイルを作成したのは、新規作成で貼り付けてBeautifyを実行しようとすると、『ファイルの種類を特定できませんでした』とエラーが出てしまうためです。
htmlファイルだと、正常に整形してくれます。
まとめ
私、ソースコードが汚いのはわかるけど、どういう感じにすればキレイなのかというのはイマイチ把握していないので、Beautify頼みですよ(笑)
初心者的な使い方なのであまり役に立たないかもしれないけれど、ちょっとブログとかWordPressの整形に使ったりする人には便利なんじゃないかなと思います。
あと、Liveweaveってサイトのほうがリアルタイム度合いでは見やすいんですけれど、インターネット環境がない状態だと、使うことができないからね。Brackets便利。
そんなわけできょうの備忘録はここまで。
最後までご覧いただきありがとうございます。
またどこかの備忘録で(^_^)/~