WebDesigner's Memorandumウェブデザイナーの備忘録

Client Folder Makerでよく使うフォルダ構成を一気に作成する

Client Folder Maker

webサイトの実装をするときや、WordPressのテンプレートを作成する時など、毎回同じようなフォルダ構成を1から作成するのは非常に面倒です。
例えば、シンプルなwebサイトを作成するときは、下記のような構成のフォルダ一式を毎回作成することになります。

  • assets
    • css
      • style.css
    • scss
      • style.scss
      • bsae
        • _reset.scss
        • _variables.scss
        • _mixin.scss
      • common
        • _common.scss
        • _header.scss
        • _footer.scss
        • _layout.scss
      • page
    • js
    • images
  • index.html

Client Folder Makerを使えば、このようなよく作成するフォルダ一式を一気に作成できます。

Client Folder Makerのダウンロード

Client Folder Maker

Client Folder Makerは$4.99(約600円)ほどするアプリですが、15日間のトライアル版が公式サイトからインストールできます。

有料アプリとはいえ、フォルダを毎回1つ1つ作る手間を考えると600円は安い方だと思うので、15日試してみて、良かったら是非購入しましょう。

Client Folder Makerの使い方

プリセットの設定

まずはプリセットの設定を行います。

メニュー(もしくはDock)のClient Folder Makerアイコンをクリックして、[Preferences…]をクリックします。

Client Folder Maker[Preferences...]

環境設定画面が開くので、「新規プリセットの追加」と「プリセット内にフォルダとファイルを作成する」作業を行います。

新規プリセットの追加

新規プリセットの追加は下の方にある「+」アイコンで追加できます。

追加したらプリセットの設定をしていきます。

項目記入する内容
Preset Nameプリセットの名前
Folder Nameフォルダの名前
Archive Folderフォルダを作成する場所(基本未設定のままです)
Folder Hierarchyフォルダ内に生成するフォルダやファイルを設定する

フォルダやファイルの追加は、画面下の方にあるアイコンをクリックすれば追加できます。

フォルダとファイルの追加

ファイルの場合は拡張子の設定も可能です。

変数を使用する

ちなみに、「Folder Name」と「Folder Hierarchy」内では、変数を使用できます。
変数を使いたいときは半角波括弧で変数名を囲って定義・使用します。「{変数名}」

指定しておけば、使用時に変数のテキストを設定するダイアログが開いて、テキストを入力すると全ての変数に同じテキストが反映されます。

プリセットの使用

設定したプリセットを使用するには、メニューアイコンからプリセット名をクリックするだけです。

メニューからプリセットの実行

あとはプリセットを作成するパスを指定して、変数を使用していれば、変数の値を入力して「Create Folder」を選択します。

変数の設定

これで、指定したパスにフォルダ一式が生成されています。

ちなみに、Finderであれば右クリックメニューの[Run Client Folder Maker Preset]から実行もできます。

右クリックメニューからプリセットの使用

フォルダをただ作っているだけの作業って、時間がすごくもったいないので、一瞬で作れるならそれに越したことはないですよね。

フォルダ構成が決まっているものはどんどん登録して、時間短縮していきたいです。

著者について

プロフィール画像

サイトウ マサカズ@31mskz10

1997年生まれ。2016年から専門学校でデザインについて勉強。卒業後は神戸の制作会社「N'sCreates」にウェブデザイナーとして入社。このブログでは自分の備忘録も兼ねて、ウェブに関する記事や制作環境を効率的に行うための記事を書いています。

Twitterをフォロー Facebookでいいね