読者です 読者をやめる 読者になる 読者になる

Unityメモ

【 Unity Game Development, Bahasa Indonesia 】

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

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

特徴

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


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


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

特徴

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

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

Protractor

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

bottom up testing
top down testing

angular js 習得する手順

書籍「AngularJSリファレンス」の感想とおすすめの活用方法 - Qiita

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;
        }
    }
    
})();

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

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

CSSでアニメーションを作る。回転の時間していなど

【CSSでアニメーション!】transformとtransitionでクルクル回るイメージをブログに取り入れよう | from my delightful room

API REST関連用語

関連用語


API(Application Programming Interface)

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

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

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


REST(Representational State Transfer)

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

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

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

JSデータバインディング

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


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

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

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のライブラリやパッケージを管理することができるツール


参考