Cordova アプリの Android 実機確認
実機の準備
開発者向けオプションが表示されない場合は以下の方法で設定する
Nexus 7 Android 4.2で消えた開発者向けオプションを表示させる方法。 - Android(アンドロイド)おすすめアプリ・カスタムニュース|AndroidLover.Net
アプリの実機転送
cordova run android --device
おわり
エミュレータより全てが全然速い
Mac での Apache Cordova (PhoneGap) はじめの一歩
Mavericks で Cordova の HelloWorld を Android / iOS シミュレータ確認するまでの流れ
tmux だからハマったり Mavericks だからハマったりするところがちょいちょいある
インストール
npm install cordova -g
node.js をインストールしていない場合は brew install node
とかでインストールしておく
プロジェクト作成
cordova create hello com.example.hello HelloWorld -d
成功したらカレントディレクトリに hello
って名前のディレクトリが作成されるのでそこに移動する
各プラットフォームライブラリインストール
Android
brew install ant brew install android-sdk
インストールされたか確認 実行できたらOK
android -h adb version
cordova platform add android
Android を add しようとしてもできない場合は、 以下のコマンドで Android SDK Manager を起動してエラーメッセージに表示された不足ライブラリをインストールする
android
今回は最新の Android API 一式と Tools/Android SDK Platform-tools, Android SDK Build-tools をインストールした
エミュレータの準備
確認のために自分でエミュレータを作成する必要がある
Android再入門 - エミュレータの作成 - Qiita
高速エミュレータを利用できるように Intel HAXM を導入する
Mavericks の場合は起動しても必ずフリーズしてしまうので以下の hotfix 版をインストールする
Mac OS X 10.9 Mavericks で Intel HAXM を使用した x86 Android Emulator を起動するとシステムがハングする - Xamarin 日本語情報
インストールしたら以下のコマンドで Android Virtual Device Manager を開いて AVD を作成する
android avd
今回の設定項目は以下
.png)
作成したら一覧から選択して「Start」で起動してみる。
しばらく(結構)待って Android のホーム画面が表示されたら成功。
エミュレータ起動
先ほど起動したエミュレータを一回終了して以下のコマンドを実行する
cordova emulate android -d
ビルド後しばらく待ってアプリケーションが起動すれば成功
iOS
シミュレータのインストール
brew install ios-sim
XCode インストールしてない場合は AppStore とかからインストールしておく
cordova platform add ios
シミュレータの起動
cordova emulate ios -d
これでシミュレータ上で動作確認ができる
tmux を利用している場合
tmux 上だとシミュレータを起動しようとしても session timed out
的なエラーが発生してうまく動かないので追加で設定が必要
reattach-to-user-namespace のインストール
brew install reattach-to-user-namespace
.tmux.conf に以下を追記
set-option -g default-command "reattach-to-user-namespace -l zsh"
tmux のセッションを全て終了して再起動
シミュレータの起動コマンドでちゃんと動作するようになる
サーバの状態を監視してサーバおじさんに HipChat で怒ってもらう
踏み台サーバを起動して作業し終わったら落とすって運用をしてるけど、 ときどき落とし忘れているときがあってよくない。
なので対象サーバのポートを一定間隔で確認して HipChat に投げることにした。 これでサーバが起動しっぱなしになっていてもすぐ把握することができる。
Token の取得
通知には対象 Room の ID と Token が必要。
Token は、HipChat にログインして Rooms > 対象Room > Tokens と移動、「Room Notification Tokens」の作成で取得する。 このときに指定した「Label」が HipChat での名前になる。
Room ID もここで参照できるので控えておく。
シェルスクリプトの準備
netcat でポートスキャンして curl で API に投げているだけのベタ書きスクリプト
取得した HipChat の情報を入れて crontab に設定して完了
HipChat への通知
指定ホストの指定ポートが開いていると通知が飛ぶ。 実際の通知はこんな感じ
通知内容を変えたいとき
通知内容をカスタムしたい場合は以下を参照して json の内容を変えればよい
zsh-notify x Growl
導入した
Macで時間のかかるコマンドが終わったら、自動で通知するzsh設定 - Qiita http://qiita.com/kei_s/items/96ee6929013f587b5878
エラった
brew install terminal-notifier
してほぼ元記事のままでいけるけど、source で zsh-notify を読みこんだところで以下のエラーが発生した
/Users/moqada/.zsh.d/zsh-notify/notify.plugin.zsh:55: command not found: add-zsh-hook
解決した
まずこいつを zshrc に追記する必要があったらしい
autoload -Uz add-zsh-hook
通知先を Growl にする
まずインストールして
brew cask install growlnotify
.zshrc に以下を追記する
GROWL_NOTIFIER=`which growlnotify`
Brewfile
巷の流れに乗っかってちょっと前に作ってた
dotfiles/Brewfile at master · moqada/dotfiles
参考
- BrewfileでHomebrewパッケージを管理する | SOTA
- AquaSKK をインストールする Cask を書いた - Sexual Knowing
- Ricty for Powerline を homebrew で簡単インストール - Qiita
- caskroom/homebrew-versions
- caskroom/homebrew-fonts
AquaSKK とかフォントとか MacVim-Kaoriya とかもちゃんと揃ってて楽だった
本家にプルリした
足りなかった分は自分で Cask 書いて本家リポジトリに追加してもらったりした。簡単で良い
- Add Aurora.app v5.0.3 by moqada · Pull Request #2942 · phinze/homebrew-cask
- Add Magican latest by moqada · Pull Request #2943 · phinze/homebrew-cask
- Add iVolume.app latest by moqada · Pull Request #2944 · phinze/homebrew-cask
ついでに
Cask 以外の App Store や直インストール分もまとめたくなっちゃったので一応別のテキストに書いた
dotfiles/MacApplications.md at master · moqada/dotfiles
Cask は手軽に色々できて便利すなー
uWSGI x Nginx でユーザをトラッキングする
nginx で lighttpd のようにユーザーをトラッキングする方法 - unknownplace.org
uWSGI でこれをやりたいときは proxy_hide_header
じゃなくて uwsgi_hide_header
を使う。
こんな感じ。
location / { include uwsgi_params; uwsgi_proxy_pass 127.0.0.0:5000; uwsgi_hide_header X-MyApp-User; }
HttpUwsgiModule - Nginx Community
uWSGI モジュールとか特にそんなん気にせず使ってた。。
勉強なりました。
スタイルガイドに KSS を導入
StyleDocco より kss のほうがナウそうなので使ってみる
インストール
npm install grunt-kss
Gruntfile.js の設定例は以下
kss: { options: { includeType: 'css', includePath: 'path/to/style.css' }, dist: { files: { 'docs/styleguide': ['path/to/source_dir'] } } }
意味はこんな感じ
path/to/source_dir
以下のスタイルシート(scssとか)をパースdocs/styleguide
ディレクトリにスタイルガイド用の HTML などを生成- 自動生成されないので事前に対象ディレクトリを作成しておくこと (2014/06/19追記)
path/to/style.css
を生成したHTMLで読み込む
kss-node のバグなのか知らんけど .scss なファイルを --sass
オプションで指定しても 0バイトな css が生成されてどーにもならなかったのでとりあえず .css を使うことにした
grunt.registerTask('styleguide', ['compass', 'kss']);
Sass にスタイルガイド用のコメントを書く
kss はコメントの記述をパースしてスタイルガイドを生成するらしい
以下、記述例
// A button suitable for giving stars to someone. // // description desu yo // description desu ze // // :hover - Subtle hover highlight. // .stars-given - A highlight indicating you've already given a star. // .stars-given:hover - Subtle hover highlight on top of stars-given styling. // .disabled - Dims the button to indicate it cannot be used. // // Markup: // <button class="button {$modifiers}">Button (button.button)</button> // <a href="#" class="button {$modifiers}">Button (a.button)</a> // // hogefugahogefuga // // Styleguide 1.1. html { .button { background-color: #CCC; &:hover { font-weight: bold; } &.stars-given { color: #FFFFCC; &:hover { color: white; } } &.disabled { color: #AAA; } } }
スタイルガイド用コメントのルールはなんとなく以下な感じ
- コメント1行目はタイトルになる
- タイトルの下に1行開けて文を書くと説明文になる
:hover
とか.class-name
とかを1行ずつ書くとスタイルガイドにHTMLが生成されるMarkup:
::hover
とかで指定した要素を HTML として書き出し- {$modifiers} を指定すると指定した
.class-name
とかが挿入される
- {$modifiers} を指定すると指定した
Styleguide <ref>.
:Styleguide
の後ろに数字+.を繋げると章番号になる- ex.
Styleguide 1.2.
== Chapter 1.2
- ex.
- タイトルや説明文などのセクション?は空行で区切る
grunt-kss は内部で kss-node を実行しているらしいので記法とかの詳細は以下を参照
実行
grunt styleguide