Brackets(ブラケッツ)というHTMLやCSSを書くためのアプリケーションをMacにインストールする手順をご紹介します。
大まかな流れとしては「アプリをダウンロードする」→「Macにインストールする」→「いつでも使いやすいようにDockに置く」の3ステップです。
※Braketsは2021年9月1日にAdobeからのサポートが終了します。代わりとしてVisual Studio Codeが推奨されています。
Visual Studio Codeのインストール方法はこちら
STEP1:Bracketsをダウンロードする
Macのアプリケーション「Google chrome」を開いて、「Brackets」とGoogle検索しましょう。
![](https://webtan.tech/wp-content/uploads/2020/02/image.png)
Bracketsのサイトhttp://brackets.io/が出てくるので、クリックしてウェブサイトに行きます。
ウェブサイトを開いてすぐにある、ダウンロードの青いボタンをクリックしてください。
![](https://webtan.tech/wp-content/uploads/2020/02/image-1-1024x611.png)
ダウンロードが始まり、Google Chromeの左下にダウンロード中の表示が出ます。
![](https://webtan.tech/wp-content/uploads/2020/02/image-2-1024x142.png)
ダウンロードが終わるとこのような表示になります。
Bracketsのダウンロードはこれで完了です。
STEP2:BracketsをMacにインストールする
ダウンロードしたBracketsはどこに行ったのかというと、
「Finder」アプリを開くと左のバーにある「ダウンロード」フォルダの中にあります。
![](https://webtan.tech/wp-content/uploads/2020/02/dl-1-1024x773.jpg)
「ダウンロード」の中にあるBrackets.Release.1.14.1.dmgファイルをダブルクリックしてインストールをします(※数字はダウンロードした時期によってバージョンが違います)
下の別画面が出てくるので、左側の「Brackets.app」をドラッグ&ドロップで右側の「青いフォルダ」に入れます。(余談ですが、この青いフォルダは、アプリケーションフォルダへのショートカットです。そしてMacではフォルダのショートカットのことをエイリアスといいます)
![アプリケーションフォルダへ移動](https://webtan.tech/wp-content/uploads/2020/05/スクリーンショット-2020-05-24-20.35.22.png)
STEP3:BracketsをDockに配置する
アプリケーションのフォルダを開いて、BracketsでDockにドラッグアンドドロップ。これでいつも使える準備が整いました!
![](https://webtan.tech/wp-content/uploads/2020/02/dock-1024x561.jpg)
これで準備は完了です!
さあ、HTMLとCSSを用いてコーディングをする準備が整いました!