Macとテキストエディタだけでモバイルアプリを作る（環境構築）


# やること
* MacでiOSやAndroidアプリを開発する環境を作ります。
* IDEに頼らず、テキストエディタとコマンドラインだけで作成する軽量な環境にします。
* Titaniumを利用することでJavaScriptで構築できます。

# 必要なもの
xcodeとnode.jsとvirtualBoxとjavaが必要になります。
またHome BrewとBrew Caskを使ってインストールするので
これらを[過去の投稿](http://qiita.com/AkihiroTakamura/items/5d6c65c061a7ccd2d0d5)を参考にセットアップしておいてください。

# Titaniumアカウント登録

[Titaniumサインアップ](https://my.appcelerator.com/auth/signup "Titanium")からアカウントを登録

# Android SDKのインストール

iOSアプリだけでよい人はこのブロックを飛ばしてOKです。
Titaniumでマルチプラットフォームするのは茨の道です。

## Android SDK Managerをインストール
[ここを参考にしました](http://weathercook.hatenadiary.jp/entry/2014/01/09/020249)

brewからインストールできます。簡単。
ついでにantもインストール

```command
brew install android-sdk
brew install ant
```

つぎにANDROID_HOMEを指定

```command
echo 'export ANDROID_HOME=/usr/local/Cellar/android-sdk/' >> ~/.bashrc
source ~/.bashrc
```

## Android SDKをインストール

```command
android
```

Android SDK Managerが起動するので
以下の感じに選択

* 下の方にある「Obsolete」をチェック
 * 現時点でBuild Tools 22.0.1はtitaniumが未対応だったので

* Android SDK Tools はinstalledになってるはず
* Android SDL Platform-toolsにチェック
* Android SDK Build-toolsの21.1.2だけチェック
* Android 2.3.x(API10)にチェック（なんか必要らしい、もしかしたらいらないかも）
* 好きなAndroidバージョンを選択（今回はAndroid5.0.1(API21))
* Extras/Android Suport Libraryにチェック
* Extras/Intel x86 Emu... にチェック

![スクリーンショット 2015-03-24 10.04.02.png](https://qiita-image-store.s3.amazonaws.com/0/60056/53b5bbd7-d89a-cf9b-53ca-1912b6b27aa5.png "スクリーンショット 2015-03-24 10.04.02.png")

選択できたら 「Install xx packages」からインストール。気長に待つ。

## Geny motionのインストール

Android SDKのエミュレーターは遅すぎるので。
GenyMotionを使います。

### サインアップ
[GenyMotion](https://www.genymotion.com/)からアカウントをサインアップしておいてください。
GenyMotionの仮想マシンをダウンロードするのに
アカウントが必要になります。

### インストール

```command
brew cask install genymotion
```

インストールできたらGenyMotionを起動します。


![スクリーンショット 2015-03-24 10.35.10.png](https://qiita-image-store.s3.amazonaws.com/0/60056/d6259e46-68ad-8431-b74c-89999abdda1b.png "スクリーンショット 2015-03-24 10.35.10.png")

と聞かれるのでYes

![スクリーンショット 2015-03-24 10.38.20.png](https://qiita-image-store.s3.amazonaws.com/0/60056/b41593b7-f31e-3377-fa94-225de8f04e5a.png "スクリーンショット 2015-03-24 10.38.20.png")

Sign inを選択してID/PASSを入力します

成功すると仮想マシンの一覧が表示されるので
好きなものを選択
今回は以下のを選択
![スクリーンショット 2015-03-24 10.41.08.png](https://qiita-image-store.s3.amazonaws.com/0/60056/7d1045dd-18ca-decc-ce3f-5678ab635480.png "スクリーンショット 2015-03-24 10.41.08.png")


次にVirtual device nameを入力
ここで指定する名前はビルド時のパラメタに必要になるので
簡潔な名前に変更しておくことをお薦めします
![スクリーンショット 2015-03-24 10.43.33.png](https://qiita-image-store.s3.amazonaws.com/0/60056/af4bb177-85bd-7475-0fea-34f0b4c6d52a.png "スクリーンショット 2015-03-24 10.43.33.png")

# titaniumのセットアップ
## インストール
node.jsを使ってインストールします

```command
npm install -g titanium
npm install -g alloy
```

## 初期設定
titaniumのアカウントを入力

```command
titanium login
> Username titaniumにサインアップしたid
> Password titaniumにサインアップしたパスワード
> Logged in successfully
```

## titanium SDKインストール

```command
ti sdk install -b master -d
```

## titanium setup

```command
titanium setup quick
```

いろいろ聞かれるので以下のように。

```titanium問答
What do you want as your "author" name?
> 名前を入力
What is your email address used for logging into the Appcelerator Network?
> titaniumに登録したメールアドレス

What would you like as your default locale?
> そのままenter

Enter # or SDK name [4.1.0.v20150323133457]:
> そのままenter

Path to your workspace where your projects should be created:
> projectを作成するパスを入力

Do you plan to build your app for Android? (yes|no) [yes]:
> そのままenter

Path to the Android SDK
> /usr/local/opt/android-sdk/

```

設定が終わるとMain Menuが表示されるので
2)  check    Check Environment
を選択

なんだかAndroid SDKが認識されてない...
一度 10)  exitで終了後、

```command
ti setup
```

で再度Main Menを開き、もう一度checkしたら
認識されました

最後にGenyMotionをtitaniumに設定します

```command
ti config genymotion.enabled true
```

# サンプルプロジェクトの作成

## プロジェクトの作成

```command
ti create -p android,ios -n hellotitanium --id com.example.hello -d

> Select a type by number or name [app]:
そのままenter

> Your company/personal URL:
適当に入力

> Directory to place project [/Users/<ユーザ名>/Documents/titanium_project]:
そのままenter

cd /Users/<ユーザ名>/Documents/titanium_project/hellotitanium

```

## alloyの利用

AlloyはtitaniumのMVCフレームワーク。
今回はAlloyを使って試してみるので
プロジェクトフォルダ配下で以下のコマンドを発行

```command
alloy new
alloy generate controller hello
```

## プロジェクトの実行

### iOSシミュレーターで実行

```command
ti build -p iphone
```

これでiOSシミュレータが起動します
終了する場合は```control + c```

### Androidシミュレーターで実行

先にGenyMotionを開き、仮想マシンを起動しておきます。その後、以下のコマンド

```command
ti build -p android -b && adb install -r build/android/bin/hellotitanium.apk
```

GenyMotion上のアプリケーション一覧に
hellotitaniumが表示されるので実行