プログラマーの調べ物

プログラマーが調べ物をするときに役に立つサイトを作ります。

MEANアプリケーションを構築する準備をする。

雑記

MongoDBをインストールする

こちらの記事を参考にして、Homebrewでインストールします。 http://qiita.com/hajimeni/items/3c93fd981e92f66a20ce

HomebrewでMongoDBをインストールするコマンド。

brew install mongodb

MongoDBを起動します。

mongod --config /usr/local/etc/mongod.conf

MongoDBに接続します。

mongo

MongoDBの稼働テストをしてみます。

> 
> db.articles.insert({title: "Hello World"})
WriteResult({ "nInserted" : 1 })
> 
> db.articles.find()
{ "_id" : ObjectId("583af05314d36c0c0896312d"), "title" : "Hello World" }
>

Node.jsをインストールする

以下の記事が参考になります。 http://qiita.com/takeshi81/items/805f504503cd93151ca6

HomebrewでNode.jsのインストールをしてきたのですが、今はNodebrewというのが出てきたみたいです。

まずHomebrewでインストールされたNode.jsをアンインストールします。

brew uninstall --force node

次に、HomebrewでNodebrewをインストールします。

brew install nodebrew

以下のコマンドで最新版のNode.jsをインストールします。

nodebrew install-binary stable

エラーが出ました。

Fetching: https://nodejs.org/dist/v7.2.0/node-v7.2.0.tar.gz
Warning: Failed to create the file 
Warning: /Users/hoge/.nodebrew/src/v7.2.0/node-v7.2.0.tar.gz: No such file or 
Warning: directory
                                                                           0.0%
curl: (23) Failed writing body (0 != 940)
download failed: https://nodejs.org/dist/v7.2.0/node-v7.2.0.tar.gz

ディレクトリがないというエラーなので、必要なディレクトリを作ってあげます。

mkdir ~/.nodebrew
mkdir ~/.nodebrew/src

無事にインストールが完了しました。

$ nodebrew install-binary stable
Fetching: https://nodejs.org/dist/v7.2.0/node-v7.2.0-darwin-x64.tar.gz
######################################################################## 100.0%

~/.bashrcにパスを通します。

$ vi ~/.bashrc

以下を入力。

export PATH=$HOME/.nodebrew/current/bin:$PATH

読み込みます。

source ~/.bashrc

インストールされているバージョンは以下のように確認します。

nodebrew ls
v7.2.0

current: none

current: noneとあるので、使用するNode.jsを指定します。

nodebrew use stable
use v7.2.0

すると、使用するNode.jsが設定されます。

$node -v
v7.2.0


$nodebrew ls
v7.2.0

current: v7.2.0

npmも一緒にインストールされます。

npm -v
3.10.9

Write Modern Web Apps with the MEAN Stack: Mongo, Express, AngularJS, and Node.js (Develop and Design)

Write Modern Web Apps with the MEAN Stack: Mongo, Express, AngularJS, and Node.js (Develop and Design)

Sassを活用する以前の基礎知識

雑記

Sassのインポート機能

Sassでは、@importを使うことで、他のファイルを読み込むことができます。 importは読み込み元のファイルのある場所から読み込みたいファイルをたどれるようにしなければなりません。

たとえば、main.scssにcomponents/common/_header.scssを読み込ませたい場合。

scss
├── base
├── components
│   ├── common
│   │   └── _header.scss
│   └── parts
├── main.css
├── main.css.map
├── main.scss
├── pages
└── utils

以下のように記述します。

@import "./components/common/header";

読み込み先ファイル名の「_」は削除します。 また、拡張子(.scss)は不要です。

コンパイルすると、以下のようにちゃんとファイルが読み込まれています。

.header {
  color: #000; }

header.scssには、先頭に「」がついています。 Sassの仕様で、「_」からはじまるscssファイルは「パーシャル」と呼ばれ、それ自体はCSSにコンパイルされない仕様になっています。

リセットCSSを使ってみる

リセットCSSとは、ブラウザごとの差異をリセットし、差分がない状態にするものです。

以下のサイトが詳しそう。 http://creive.me/archives/10438/

sanitize.cssは以下のサイトで手に入れることができます。 https://jonathantneal.github.io/sanitize.css/4.0.0/sanitize.css

このCSSを_sanitize.scssとしてファイルに書き込み、importすればOKです。

Mac上HTML/CSSのコーディング環境を構築する

雑記

コンパイルとは、SassをCSSに変換することです。 Sassのコンパイルには、ソフトウェアを使ってGUIで実行する方法と、CUIで行う方法がありますが、一般的にはCUIを使います。

Node.jsをインストールする

Homebrewを使ってインストールしましょう。

brew install node

でインストール可能です。

node -v

でバージョンが表示されればOKです。

次に、Gulpをインストールします。

npm install gulp -g

でGulpがインストールできます。

一般ユーザーで実行すると、

Please try running this command again as root/Administrator.

というエラーが出たので、ルートで実行します。

sudo npm install gulp -g

gulpの実行はgulpfile.jsがある場所で以下のコマンドを実行します。

gulp

Gulpは

  • ファイル保存時の自動コンパイル
  • ファイル保存時のブラウザの自動リロード
  • コンパイルされたファイルのdistFolderへの出力

などをやってくれます。

次に開発環境としてKoalaをインストールしてみましょう。
http://koala-app.com/

Koalaは登録したSCSSを自動でCSSにコンパイルしてくれるツールです。 インストール方法は以下のサイトを参考にしてください。

https://liginc.co.jp/web/html-css/css/56599 http://itstudio.co/2016/05/23/5755/

“Koala.app”は、開発元が未確認のため開けません。 というエラーメッセージが出た場合は、こちらを試してみてください。

https://helpx.adobe.com/jp/x-productkb/global/cpsid_93896.html

システム環境設定をいじればインストールできるようになります

JBoss Application Server5をインストールしてみる。

雑記

brew install wgetでwgetコマンドをインストールします。
wgetでJBoss Application Server5をダウンロードします。

wget https://sourceforge.net/projects/jboss/files/JBoss/JBoss-5.1.0.GA/jboss-5.1.0.GA-jdk6.zip/download

downloadという名前でwgetされているので、リネームして、解凍します。

mv download jboss-5.1.0.GA-jdk6.zip 
unzip jboss-5.1.0.GA-jdk6.zip

jdk6が必要と書いてあるので、インストールしましょう。

詳しくは前回の記事を参考にしてください。 http://programmers-investigation.hatenablog.com/

brew cask info java6
brew cask install java6
jenv add /Library/Java/JavaVirtualMachines/1.6.0.jdk/Contents/Home/
jenv local oracle64-1.6.0.65

JBossのインストールはこれで完了です。 とりあえず動かしてみましょう。

/opt/jboss/jboss-5.1.0.GA/bin に移動して、

./run.sh

を叩きます。 すると、

jboss/jboss-5.1.0.GA/server/default

が動きます。

コンソールに、

15:32:36,890 INFO  [AjpProtocol] Starting Coyote AJP/1.3 on ajp-127.0.0.1-8009
15:32:36,894 INFO  [ServerImpl] JBoss (Microcontainer) [5.1.0.GA (build: SVNTag=JBoss_5_1_0_GA date=200905221634)] Started in 20s:843ms

と出ていれば、起動完了です。

ブラウザで開くと、JMX-Consoleが見れます。
http://localhost:8080/jmx-console/

Ctrl + CでJBossを停止させることができます。

programmers-investigation.hatenablog.com

Homebrewを使って、Mac環境にJDK7,JDK8をインストールする

雑記

JBoss5をインストールして、稼働させることを目的としているのですが、まずはJDKのインストールが必要です。 僕のMac環境にJDKをインストールするところから始めます。

まずJBossを動かすためには、JRE(Java Runtime Environment)が動作する環境が必要となっています。 JBoss5以前のバージョンでは、JDK(Java Development Kit)環境が必須でした。 JSPファイルを実行環境で動的にコンパイルするためにはコンパイラが必要で、JREにはコンパイラが含まれていないからです。

JDKとJREの違いについては、こちらの記事が参考になります。 http://qiita.com/chkkchy/items/3a4594645b3aef7a98b7

JBoss AS 5はEclipse JDTというライブラリを含んでいるので、稼働中にJavaのコードをコンパイルすることができるようになりました。 だから、JDKがなくとも、JREがあれば稼働させることができるようになりました。 とはいえ、JDKにはJREが含まれているため、JDKを入れておけば安心とは思いますが。

JDKをインストールする

以下のサイトを参考にします。

http://davidcai.github.io/blog/posts/install-multiple-jdk-on-mac/

brew update
brew tap caskroom/cask
brew install brew-cask

brew tapとは、公式以外のリポジトリをフォーミュラとしてHomebrewに追加するもので、brewのもとでinstall,uninstall,updateなどが行えます。

ちなみに、2016年11月現在、brew install brew-caskを実行すると、以下のようなエラーが発生します。

Error: No available formula with the name "brew-cask" 
==> Searching for similarly named formulae...
Error: No similarly named formulae found.
==> Searching taps...
This formula was found in a tap:
homebrew/completions/brew-cask-completion
To install it, run:
  brew install homebrew/completions/brew-cask-completion

コメントに従って、brew install homebrew/completions/brew-cask-completionを実行すると、無事にcaskがインストールできました。

Stackoverflowの民がJava8をインストールする前にJava7をインストールせよ、と言っているそうなので、まずJava7をインストールします。

brew tap caskroom/versions
brew cask info java7

brew cask info java7の結果を見て、Java7がインストールされていない場合。

以下のコマンドで、Java7をインストールします。

brew cask install java7

次に、最新版のJava8をインストールします。

brew cask install java

JDKは以下のディレクトリにインストールされます。

/Library/Java/JavaVirtualMachines/jdk1.7.0_80.jdk/Contents/Home
/Library/Java/JavaVirtualMachines/jdk1.8.0_112.jdk/Contents/Home/

次に、jEnvをインストールしておきましょう。 jEnvとは、Javaの環境設定を助けてくれるツールです。 http://www.jenv.be/

jEnv is a command line tool to help you forget how to set the JAVA_HOME environment variable

~/.bash_profileにjEnvの初期化設定を追記します。

# Init jenv
if which jenv > /dev/null; then eval "$(jenv init -)"; fi

source ~/.bash_profileで.bash_profileの情報を取り込んだ後、jEnvにJDKの情報を追加します。

jenv add /Library/Java/JavaVirtualMachines/jdk1.7.0_80.jdk/Contents/Home
jenv add /Library/Java/JavaVirtualMachines/jdk1.8.0_112.jdk/Contents/Home/

登録されているJDKを確認します。

$ jenv versions
* system (set by /Users/hoge/.jenv/version)
  1.7
  1.7.0.80
  1.8
  1.8.0.112
  oracle64-1.7.0.80
  oracle64-1.8.0.112

Java7をデフォルトのバージョンとしたい場合は、以下のコマンドを実行します。

jenv global oracle64-1.7.0.80

そのプロジェクトに限り、別のJDKのバージョンを適用したい場合。

jenv local oracle64-1.8.0.112

以上で、Javaの開発を行う環境が整いました。