Skip to content

Macの環境構築手順

Jump to bottom Edit New page
Kenichi Yagi edited this page Mar 25, 2018 · 22 revisions

前提

  • macOSをクリーンインストールする。

1. Mac全体の環境構築

1.1. Xcode Command Line Toolsをインストールする。

  • ターミナル(Launchpad→その他)を起動し、Gitコマンドを実行する。
$ git
  • Xcode Command Line Toolsをインストールするかどうか確認されるので、インストールする。

1.2. Appleの提供するJavaをインストールする。

1.3. Homebrewをインストールする。

1.4. GraphicsMagickのインストール

$ brew install GraphicsMagick

1.5. GitHub Desktopをインストールする。

1.6. Node.jsのインストール

1.7. lessのインストール

  • lessは、CSS(スタイルシート)をベースにした、より効率的な記法のこと。
  • lessをcssに変換するための、同名のlessというソフトをインストールする。
$ sudo npm install -g less

1.8. Gruntのインストール。

  • Gruntは、ファイルの更新を見張り、lessをCSSにコンパイルしたり、jpegを縮小したり、CSSやJavaScriptを圧縮したりするツール。
$ sudo npm install -g grunt-cli

1.9. Bundlerをインストールする。

$ sudo gem install bundler

1.10. WebStormのインストール

https://www.jetbrains.com/webstorm/

2. GitHubから、Webサイトをダウンロードする。

2.1. ディレクトリを作成する。

  • ターミナルを起動し、darumaya-gofuku.github.io リポジトリを保存するためのディレクトリを作成する。
$ cd ~
$ mkdir GitHub
$ cd GitHub
$ mkdir darumaya
$ cd darumaya

2.2. GitHub Desktopを起動する。

2.3. 名前をつけてCloneする。

  • Clone As: に darumaya.github.io と入力されているのを確認して、Cloneを実行する。
  • 2018/3/25 OSがHigh Sierraになったせいか、HDDスリープが働いてDLがコケる場合がある。その場合、システム環境設定→省エネルギーからHDDスリープを解除して再Cloneする

3. レポジトリの環境構築

3.1. Bundler系のツールをインストールする。

  • Gemfile.lockというファイルに (初回はGemfileというファイルに) 、GitHub Pagesをローカルで実行するのに必要なツールが記されている。それらのファイルを一括でインストールする。
$ cd darumaya.github.io
$ bundle install

3.2. npm系のツールのインストール

  • package.jsonというファイルに、必要なツールが記されている。それらのファイルを一括でインストールする。
$ npm install
Add a custom footer
Add a custom sidebar
Clone this wiki locally