AngularJS Jasmineを使ったテストについて

====================================================
Unit Test (単体テスト)
====================================================

特徴

• 比較的早い段階で行われる。
• プログラムを構成する比較的小さな単位の個々の機能が正しく果たしている華道家を検証するテストである。
• [メリット]モジュールが結合される前の段階でテストが実施されるため、問題の原因の特定や修正が用意。開発全体のバク修正コストを下げる効果がある。
• [メリット]一般的にテスト駆動型開発 TDD Test Driven Development と呼ばれるコード作成前にテストケースが作成されるため、妥当性の高いテストケースを資産として残すことができる。
• 致命的な障害発生を」防ぐことができる、ただ全てびを想定することはでじき
• [デメリット]開発車の負担
• [デメリット]テスト実施にある程度のスキルが必要
• [デメリット]スケジュールの関係で時間がかさむ

AngularJS Jasmineを使った単体テストについて　

• http://qiita.com/opengl-8080/items/cf3acafda9756f4b04c9

====================================================
Integration Test (結合テスト)
====================================================

特徴

• 比較的後の段階で行われる。
• プログラミングが全体として正しく動くかを検証する。

開発中のソフトのテスト手法の一つで複数のモジュールを組み合わせて行うテスト
インターフェイスがうまく機能するかを確認すること、結合した状態で外部から見て一体として正しく機能するかを確認する場合がある。

Protractor

http://qiita.com/matsuzan/items/f5a9382a33e81999732a

bottom up testing
top down testing

Angular.jsのServiceとFactoryに関して

ServiceとFactoryの違い

Serviceは、thisがあるが、returnがない。

// ----------------------------
// Service
// ----------------------------
(function() {
    'use strict';
    
    angular
        .module('weatherApp')
        .service('exampleService', exampleService);
    
    function exampleService() {
        // public var
        var foo;
        
        // private var
        var bar;
        
        // public service
        // FACTORY HARUS ADA THIS
        // TIDAK ADA RETURN
        this.foo = foo;
        this.doSomething = doSomething;
        
        // public method
        function doSomething () {
            cook();
            console.log("exampleService");
        }
        
        // private method
        function cook () {
            bar = 1;
            foo = 3;
        }
    }
    
})();

Factoryは、returnがあるが、thisがない。

// ----------------------------
// Factory
// ----------------------------
(function() {
    'use strict';
    
    angular
        .module('weatherApp')
        .factory('exampleFactory', exampleFactory);
    
    function exampleFactory() {
        // public var
        var foo;
        
        // private var
        var bar;
        
        // public service
        // FACTORY HARUS ADA RETURN
        // TIDAK ADA THIS
        return {
            foo: foo,
            doSomething: doSomething  
        };
        
        // public method
        function doSomething () {
            cook();
            console.log("exampleFactory");
        }
        
        // private method
        function cook () {
            bar = 1;
            foo = 3;
        }
    }
    
})();

• Angularのservice, factory, providerの使い分け #scripty01 - pirosikick's diary

• Angular.jsのServiceとFactoryの違いを考える - Qiita
• Angular#serviceと#factoryの違い。どういう時どっちを利用するか。定義方法。使い方を理解するまとめ(2015/8/29更新) - Qiita
• お前のAngular.jsはもうMVCではない。と言われないためのTutorial - Qiita

javascript のsetTimeOutを使うには、Watchが必要、AnglarJSの$timeoutを使う

function onShowHideElement (){
  $timeout(function(){
    vm.isAnimation = false;
    $log.debug(vm.isShowButton );
  }, 5000);
}

API REST関連用語

関連用語

API（Application Programming Interface）

APIとは、あるコンピュータプログラム（ソフトウェア）の機能や管理するデータなどを、外部の他のプログラムから呼び出して利用するための手順やデータ形式などを定めた規約のこと。
個々のソフトウェアの開発者が毎回すべての機能をゼロから開発するのは困難で無駄が多いため、多くのソフトウェアが共通して利用する機能は、OSやミドルウェアなどの形でまとめて提供されている。そのような汎用的な機能を呼び出して利用するための手続きを定めたものがAPIで、個々の開発者はAPIに従って機能を呼び出す短いプログラムを記述するだけで、自分でプログラミングすることなくその機能を利用したソフトウェアを作成することができる。

• APIとは｜アプリケーションプログラミングインターフェース｜Application Programming Interface - 意味/定義 ： IT用語辞典

APIとは、アプリケーションプログラムインターフェイスの略語で、プログラミングの際に使用できる命令や規約、関数等の集合の事を指す。ソフトウェア開発の際、いちから全てを作るより、APIを利用すればもともとあるプログラムを呼び出して、その機能を組み込んだソフトウェアを開発することができる。

システム開発をする際にプログラムをパーツ化して再利用できるようにするSOA（サービス指向アーキテクチャ）も似たような考え方といえるが、システム内での利用にとどまらず、外部ネットワークからモバイル機器を通して、システム機能を呼び出して利用する仕組みとしてAPIは適している。

• APIとは - 意味の解説｜ITトレンドのIT用語集

REST（Representational State Transfer）

「セッションなどの状態管理を行わない（やり取りされる情報はそれ自体で完結して解釈することができる）」（Webシステムでは、HTTP自体にはセッション管理の機構はない）、「情報を操作する命令の体系が予め定義・共有されている」（WebシステムではHTTPのGETやPOSTなどに相当）、「すべての情報は汎用的な構文で一意に識別される」（URLやURIに相当）、「情報の内部に、別の情報や（その情報の別の）状態へのリンクを含めることができる（ハイパーメディア的な書式で情報を表現する）」（HTMLやXMLに相当）

<参考> わかりやすくまとまっている。

• 「Webを支える技術」を読みました とRESTのまとめ - 大学生からの Web 開発

• REST な API とは何か - ボクココ
• REST APIとは？ - API設計のポイント

URLとURI
URLとURIは何が違うの？ どちらが正しい呼び方？ | 編集長ブログ―安田英久 | Web担当者Forum

JSデータバインディング

データバインディングとは？
>データバインディング データバインディング（データバインド、あるいはData Bindingの訳からデータ結合とも呼ばれる。） とは、XMLなどのデータソースとアプリケーションやウェブページ（ウェブアプリケーション）のユーザインタフェースを静的または動的に結合する技術である。

• データバインディング | AngularJS 1.2 日本語リファレンス | js STUDIO

HTML要素を真ん中に配置したい

HTMLの要素を中央に配置する場合

• [ CSS ] フォームの「送信ボタン」を中央揃えに! どの端末で見ても真ん中にする技!! | ヨッセンス
• 【CSS】要素を上下左右に中央寄せする色々な方法 - アイデアハッカー

Gulpの知識 -- Web開発のタスクの自動化

• 画像の圧縮・SassやLESSのコンパイル・簡易ローカルサーバの立ち上げ・FTPアップロードなどなど、Web制作の面倒な作業を自動化してくれる

#数字はdotinstallに対応

• フロントエンドのタスクの自動化
• Gulp.jsを使うにはNode.jsが必要 #02

//install epel nodejs npm gulp
sudo yum -y install epel-release
sudo yum -y install nodejs npm

// グローバルのオプション付きでglupをインストール
sudo npm install gulp -g
// フォルダの中だけにインストールする
npm install --save-dev gulp

• ファイル内の移動、圧縮などを自動化できる！
• 命令は、"gulpfile.js"に記述する #05
• 高速に並列に処理することができる #06
• 処理の順番を指定することができる #06
• イメージの最適化に関して　gulp-imagemin #07
• タスクの名前を最初のパラメータに記述する #07
• 圧縮の成果をconsoleを通して確認することができる #07
• javascriptに変換する、結合方法、圧縮方法#08
• プラグインのインストールの仕方 #08
• jsに関するプラグイン　gulp-coffee ､gulp-concat､gulp-uglify #08
• gulp.watch() 変更があれば、自動でタスクを実行するということができる #09
• gulp-plumber watch()だと間違いがあると止まってしまう。それを解消するプラグインがある。エラーが出そうなところに記述する。エラーが表示されるとともに実行もされる #10
• gulp-header　ヘッダープラグインに関して、メッセージを記述する。 #11　
• gulp-webserver プラグイン、変換してものをすぐにブラウザに反映するということをするもの #12

用語
Node Packaged Modules(npm)とはNode.jsのライブラリやパッケージを管理することができるツール

参考

• Web制作の面倒事を自動化！gulpの導入から使い方まで | コラム | Web制作 株式会社ワンゴジュウゴ WAN55 （東京・千代田区）
• gulpの基本的な使い方（gulp.jsの基礎をしっかり理解する） | mae's blog
• #01 gulpとは何か？ | gulp入門 - プログラミングならドットインストール
• 5分で導入！ タスクランナーGulpでWeb制作を効率化しよう - ICS MEDIA

WebStormの知識 -- Web開発のタスクの自動化

• JetBrains社が開発しているWeb開発向けのIDE
• 初期設定をしなくても使うことができる
• 新しいツールのサポートが早い
• 各種フレームワークが選択できる
• Webフロントエンド開発に必要なものは大体揃っている（HTML(5)+CSS+JavaScript）
• Javascriptのサポートが手厚である

用語
IDE：integrated development environment

参考
WebStorm / PhpStorm 基礎 シーブレイン社内勉強会
最強のJavaScript IDE 「WebStorm」を使ってみた | Web Scratch

- Bower

sudo npm install -g bower

フロントエンド用パッケージマネージャー
必要なライブラリを簡単にインストールすることができる
BowerをインストールするにはNode.jsのインストールが必要

参考

• Bower
• Bower（フロントエンド用パッケージマネージャー）の導入方法と使い方 | 株式会社LIG
• Bower入門(基礎編) - from scratch

- Yeoman

sudo npm install -g yo

参考

• The web's scaffolding tool for modern webapps | Yeoman
• 今話題のワークフロー構築ツール「Yeoman」とは？：WEB制作を効率化！ Yeomanを使ってみよう！ 第1回 | エンカフェ

• gulp-angular

[create new project]-[Yeoman]-[install generator]でインストールする。

【C#】set{ }get{ } 使用例

使用例１

public GameDifficulty Difficulty {
	get {
		return _difficulty;
	}
	//difficultyを選択する
	//セットするときにイベントを呼び出す
	set {
		_difficulty = value;
		EventsManager.OnGameChangeDifficulty(_difficulty);
		ChangeGravityBasedOnDiffculty();
	}
}

使用例２

public GravityState LevelGravity {
	get {
		return _gravityState;
	}
	set {
		_gravityState = value;
		switch (_gravityState) {
		case GravityState.Down :
			Physics.gravity =  Vector3.down * DefaultGravity;
			break;
		case GravityState.Up :
			Physics.gravity = Vector3.up * DefaultGravity;
			break;
		}
		EventsManager.OnGameChangeGravity(_gravityState);
	}
}

• http://qiita.com/39_isao/items/b84919a31a6a671aeed6
• Unity - Properties

【Unity エラー】Android Manifest SDK version番号揃える

すべてのAndroidManifestのandroid:minSdkVersionとandroid:targetSdkVersionの番号を同じにする。

<uses-sdk android:minSdkVersion="16" android:targetSdkVersion="23" />

error

Temp/StagingArea/android-libraries/android-notifications-release/AndroidManifest.xml:3] Main manifest has <uses-sdk android:minSdkVersion='15'> but library uses minSdkVersion='16

minSdkVersion='16に設定する。