1. Function Review: Satisfy requirement
2. Security Review: SQL injection prevention and valid user input
3. Test Review: Accept Test and Unit Test coverage
4. Code quality Review:
a. Readable:  Name Convention, length of function
b. Solid principle
1) Single Responsibility, DRY (don't repeat yourself), make code reusable
2) Dependence,  check New instance code, check if interface defined. (testable)
3) Open Close, check "switch case", "if else" "Enum" code

c. other code refactor check
1) "out" "ref"
2) null check
d. Good performance check
e. Exception handle
f. Logging
g. Try best to remove the project build warning.


some useful ref:
http://www.codeproject.com/Articles/593751/Code-Review-Checklist-and-Guidelines-for-Csharp-De
http://www.amazedsaint.com/2010/11/top-6-coding-standards-guideline.html
http://www.codeproject.com/Articles/524235/Codeplusreviewplusguidelines


 
Categories: Agile | C# | Interview Question

1.      AngularJS Routing  //trans app to single page app

a.      ngView and template

template can be a html file generate in fly.

b.     $routerProvider

var eventsApp = angular.module('eventsApp', ['ngResource'])

    .config(function ($routeProvider, $locationProvider) {

        $routeProvider.when('/newEvent',

            {

                templateUrl:'templates/NewEvent.html',

                controller: 'EditEventController'

            });

$routeProvider.otherwise({redirectTo: '/events'});//default

//In the bar

<a href=”#/newEvent”>Create Event</a>

c.      Template only load once and save to cache

d.     $routeParams

eventsApp.controller('EventController',

    function EventController($scope, eventData,routeParams) {

        $scope.sortorder = 'name';

        $scope.event = eventData.getEvent($routeParams.eventId);

 

    1. $route service

//use $route.current.foo to get querysting ?foo=bar

eventsApp.controller('EventController',

    function EventController($scope, $route) {

               $scope.sortorder = 'name';

        $scope.event = $route.current.locals.event;

 

    }

);

$routeProvider.when('/event/:eventId',

            {

                templateUrl: '/templates/EventDetails.html',

                controller: 'EventController',

                resolve: { //for slow loading page

                    event: function($q, $route, eventData) {

                        var deferred = $q.defer();

                        eventData.getEvent($route.current.pathParams.eventId) //pathparams not has querysting

                            .then(function(event) { deferred.resolve(event); });

                        return deferred.promise;

                    }

                }

            });

 

f.     $route.reload()  reload the page without refresh.

 

g.      HTML5 routing

Add         $locationProvider.html5Mode(true);  in .config(), will not need # in html, may nee server change to redirect it to your index.html

 

 

h.      $location service

eventsApp.controller('MainMenuController',

    function MainMenuController($scope, $location) {

        console.log('absUrl: ', $location.absUrl());

        console.log('protocol: ', $location.protocol());

        console.log('port: ', $location.port());

        console.log('host: ', $location.host());

        console.log('path: ', $location.path());

        console.log('search ', $location.search());

        console.log('hash: ', $location.hash());

        console.log('url: ', $location.url());

 

        $scope.createEvent = function() {

            $location.replace();

            $location.url('/newEvent');

        };

    })

 

$location.url(‘newUrl’) to navigate to a new view

$location.search() to access to the querystring parameters

 

                                                                                                                             

2.      Custom directives : custom elements, custom events, observe and react to Changes

a.      Create directive

eventsApp.directive(‘mySample’,function(){

return {

    linke:function(scope,element,attrs,controller){

    var markup= “<input type=’text’ ng-model=’sampleData’ /> {{sampleData}}<br>”;

angular.element(element).html($compile(markup)(scope));

}

}

});

b.      Html

//html  mySample will transfer to my-sample by angular

<div my-sample></div>

<my-sample/>

<div class=’my-sample’></div>

//E,A,C and M  ‘E’:element, A:attributes C: for class

 

c.      Use template in directive

//use template replace first  example

eventsApp.directive(‘mySample’,function($compile){

               return{

                              restrict: ‘E’

                              Template:”<input type=’text’ ng-model=’sampleData’/>{{sampleData}}” 

}

});

d.      Isolate scope

eventsApp.directive('eventThumbnail', function() {

    return {

        restrict: 'E',

        templateUrl: '/templates/directives/eventThumbnail.html',

        replace: true,

        scope: {

            event: "=" //you also can use &prefix for parent scope

        }

 

    }

});

<li ng-repeat="event in events|orderBy:sortorder" class="span5">

            <event-thumbnail event="event" />

        </li>

 

e.      Handle events

   eventsApp.directive('gravatar', function(gravatarUrlBuilder) {

   return {

       restrict: 'E',

       template: '<img />',

       replace: true,

       link: function(scope, element, attrs, controller) {

               //element.on(‘click’,function(){..});

           attrs.$observe('email', function(newValue, oldValue) {

               if (newValue !== oldValue) {

                   attrs.$set('src', gravatarUrlBuilder.buildGravatarUrl(newValue));

               }

           });

       }

 

   }

 });

//  <gravatar email="{{user.emailAddress}}"/>

 

f.     Use controller in directive

eventsApp

    .directive('greeting', function() {

        return {

            restrict: 'E',

            replace: true,

            transclude: true,

            template: "<button class='btn' ng-click='sayHello()'>Say Hello</button>",

            controller: function($scope) {

                var greetings = ['hello'];

                $scope.sayHello = function() {

                    alert(greetings.join());

                }

                this.addGreeting = function(greeting) {

                    greetings.push(greeting);

                }

            }

        };

    })

 

Controller can be defined in anyway, just need controller: ‘controllerName’

 

Controller name can passed in directive attributes.

<greeting ctrl=’controllername’ />

 

..//in directive

controller: @,

name:’ctrl’

 

g.    Sharing directive controllers via Require

<greeting finish  hindi/>

.directive('finnish', function() {

        return {

            restrict: 'A',

            require: 'greeting',

            link: function(scope, element, attrs, controller) {

                controller.addGreeting('hei');

            }

        }

    })

    .directive('hindi', function() {

        return {

            restrict: 'A',

            require: 'greeting',

            link: function(scope, element, attrs, controller) {

                controller.addGreeting('नमस्ते');

            }

        }

    });

 

 

h.    Directive priority and user Terminal

Priority:1 –priority can be nagitive

Terminal:true

 

i.      Using require with Nested directives

<greeting ng-transclued>

               <div hindi></div>

</greeting>

Transclued:true

require: '^greeting',  //lookup the directive

 

 

j.      Transclusion

 

k.     Using compile to Transform the dom

eventsApp.directive('repeatX', function() {

    return {

        compile: function(element, attributes) {

            for (var i=0; i < Number(attributes.repeatX)-1; i++) {

                element.after(element.clone().attr('repeat-x', 0));

            }

            return function(scope, element, attributes, controller) {

                attributes.$observe('text', function(newValue) {

                    if (newValue === 'Hello World') {

                        element.css('color', 'red');

                    }

                });

            }

        }

    };

});

 

Text to repeat: <input type="text" ng-model="text"/>

             <div repeat-x="5" text='{{text}}'>{{text}}</div>

 

l.      Use jQuery in directives

Include the jqueryUI, and put something like datepicker in a directive. But it is not nessary, you can use jqueryUI directly.


 
Categories: JavaSript

    1. Reusable, Single Responsibility. Dependency Injection ,Testable    (SOLID)
    2. Just local not network service
    3. Registered with Angular so that Angular can inject it
    4. Ex.

                                                    i.     Create service, factory call register it to Angular as name “eventData”.

eventsApp.factory(‘eventData’,function(){

     return{ event:{name:’abc’,date:’1/1/2014’}

     };

})

                                                   ii.     Inject the service in controller

eventsApp.controller('EventController',

    function EventController($scope, eventData) {

                   $scope.sortorder = 'name';

        $scope.event = eventData.getEvent();

 

                                                  iii.     Ajax call in service

eventsApp.factory(‘eventData’,function($http,$log){

     return{ getEvent:function(successed){

       $http({method:’GET’,url:’/data/event/1’}) // it is a valid http url will return json

            .success(function(data,status,headers,config)

{

$log.info(data,status,headers(),config);

    successed(data);

}).

Error(function(data.status.headers.config){

$log.warn(data,status,headers(),config);

});

}

     };

})

 

//in controller

eventData.getEvent(function(event){ $scope.event=event;});

 

                                                  iv.     Promise library $q

eventsApp.factory(‘eventData’,function($http,$q){

     return{ getEvent:function(){

                     var deferred=$q.defer();

 

       $http({method:’GET’,url:’/data/event/1’}) // it is a valid http url will return json

            .success(function(data,status,headers,config)

{

deferred.resolve(data);

}).

error(function(data.status.headers.config){

                                  deferred.reject(status);

});

}

return deferred.promise;

     };

})

//in controller

$scope.event = eventData.getEvent()  //promise will be auto bind, access event by $scope.event is not best practice, use it pass back from view.

Or

$scope.event.then(function(event){ console.log(event);},function(status) { console.log(status);});

 

                                                   v.     $resource service, build for access REST service, need include ngResouse module

Var eventApp = angular.module(‘eventsApp’, [‘ngResource’])

//simple resource immediately return

return $resource(‘/data/event/:id’,{id:’@id’}).get({id:1});

 

 eventsApp.factory('eventData', function ($resource, $q) {

    var resource = $resource('/data/event/:id', {id: '@id'});

    return {

        getEvent: function () {

            var deferred = $q.defer();

            resource.get({id: 1},

                function (event) {

                    deferred.resolve(event);

                },

                function (response) {

                    deferred.reject(response);

                });

 

            return deferred.promise;

        },

        save: function(event) {

            var deferred = $q.defer();

            event.id = 999;

            resource.save(event,

                function(response) { deferred.resolve(response);},

                function(response) { deferred.reject(response);}

            );

            return deferred.promise;

        }

    };

});

 

 

    1. $anchorScroll service, can work with html routing

$scope.scrollToSession= function(){ $anchorScroll(); }

    1. $cacheFactory service

var eventsApp = angular.module('eventsApp', ['ngResource', 'ngCookies'])

    .factory('myCache', function($cacheFactory) {

        return $cacheFactory('myCache', {capacity:3});

});

 

//controller

eventsApp.controller('CacheSampleController',

    function CacheSampleController($scope, myCache) {

        $scope.addToCache = function(key, value) {

            myCache.put(key, value);

        };

 

        $scope.readFromCache = function(key) {

            return myCache.get(key);

        };

                                                                                                                             

        $scope.getCacheStats = function() {

            return myCache.info();

        };

    }

);

 

g.       $compile service, It was used whenerver a page is loaded, process directive.  

You also can use it in your code, it can add a directive dynamically.

  $scope.appendDivToElement = function(markup) {

            return $compile(markup)($scope).appendTo(angular.element("#appendHere"));

        }

//html

<div class="container">

    <div ng-controller="CompileSampleController" style="padding:20px;">

 

        <div id="appendHere"></div>

        <br/>

        name:<input type="text" ng-model="name"/><br/>

        markup: <input type="text" ng-model="markup"/><br/> //markup = ‘<h3>{{name}}</h3>’

        <button class="btn" ng-click="appendDivToElement(markup)">Append</button>

 

    </div>

</div>

 

    1. $parse service, is used to evaluate an expression and turn that expression to function.

var fn= $parse(‘1+2’);

console.log(fn());

 

var getter=$parse(‘event.name’);

var setter=getter.assign;

var context={event:{name:’xxxx’}};

console.log(getter(context));

setter(context, ‘bbbbb’);

 

i.       $locale Service, angular-local_es.js for different language.

$scope.myFormat=$locale.DATETIME_FORMATS.fullDate;

 

j.       $timeout service same like window.setTimeout, but is Angular registered. 

 

k.      $exceptionHandler service

eventsApp.factory('$exceptionHandler', function() {  //this service with $

    return function (exception) {

        console.log("exception handled: " + exception.message);

    };

});

l.       $filter service

 

m.    $cookieStore Service  (Note,it not have function for expire date)

eventsApp.controller('CookieStoreSampleController',

    function CookieStoreSampleController($scope, $cookieStore) {

        $scope.event = {id: 1, name:"My Event"};

        $scope.saveEventToCookie = function(event) {

            $cookieStore.put('event', event);

        };

        $scope.getEventFromCookie = function() {

            console.log($cookieStore.get('event'));

        };

        $scope.removeEventCookie = function() {

            $cookieStore.remove('event');

        };

    }

);

 

n.      Other services: $interpolate $log $rootScope $window $document $rootElement

$rootScope is one per App, Prototypal Inheritance(all child $scope able to access it) , Injectable

Use too much Dom Services is not best practice.

$interpalateProvider can change {{}}expression delimeters.


 
Categories: JavaSript

There is full lists :link

First we take look the Tools related with Visual Studio:

MSTest, the unit test framework in Visual Studio

Coded UI Test

Microsoft Fakes,

Microfoft Test Manager

Visual Studio Memory Profiler

Visual Studio Performance profiler

Visual Studio Load Test, part of VS Ultimate(Testing Performance and Stress Using Visual Studio Web Performance and Load Tests)

TestDriven.Net, unit test running for Visual Studio


Other Test tools I have used:

nUnit,

JetBrains ReSharper UnitTest , 

moq,

SpecFlow




 
Categories: Agile | UnitTest | Visual studio 10/up