Foundation6のインストール方法。

Foundation6をインストール方法は何通りがあるけど、個人的にターミナルでコマンド叩くのが早いかな。
黒い画面苦手な私でもサクッとできたので。
各導入方法は公式サイトで→Foundationのインストール方法

ここではターミナルを使ったインストール方法を書きます。(Node.jsをあらかじめインストールしておく。)

まずはターミナルで下記のコマンドを入力。

するとターミナルにズラズラーっと文字が表示されて、なんやかんやインストールされていきます。

次に、下記の例のようにプロジェクトディレクトリに移動。

で、下記のコマンドを叩く。

このあと、色々と問われるので、↑↓で選択していきます。

聞かれるのは下記の3つ。

WEBサイト作るのでA website (Foundation for Sites)を選択。

任意のプロジェクト名を入力。(ここで入力した名前のフォルダが上記のプロジェクトディレクトリ内に作成される。)

テンプレートを選ぶように言われるのでZURB Template: includes Handlebars templates and Sass/JS compilersを選択。
Basic Templateもあるけど、Foundation6の機能をガッツリ使えるのはZURB Template
foundation6のパッケージにはgulpも入ってるけど、ZURB Templateの方がgulpの環境も断然整ってる。
最低限の環境だけでOKって場合はBasic Templateを選択しても良いかも。

インストールはこれで完了。これだけ。

ここまでの流れを一発で指定できるコマンドも一応。

あとは、プロジェクトのディレクトリで下記を打てばfoundationが動く。

bootstrapとか他のフレームワークも使った事あるけど、個人的にはfoundation6がデフォルトのデザインもシンプルでカスタマイズもしやすい。
特に、Sass、Gulpの環境が最初から整ってるのが快適で幸せ。

王道フレームワークBootstrapとSkeletonっていうシンプルを極めたフレームワークと機能を比較してるサイトがあったのでこちらも紹介→Bootstrap vs. Foundation vs. Skeleton

今回はインストールの方法だけ紹介したけど、別の機会にfoudation6の特徴とかメリットを紹介しますー。

Written By:
Li

Add a Comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です