2/20/16

AngularJS SPA Auth Token Management

              , , ,       1 comment    
This is a presentation on AngularJS Single Page Application Jason Web Token Management. During the presentation we take a look at a NodeJS server application with both secured and unsecured APIs. We work on enhancement to  the client application, so that it can manage the jwt token by looking at the following areas:

  • After login read token from header
  • Decode (base64) the second segment (payload) which brings the claims
  • Store the token
    • Memory
    • localStorage
  • Approach for subsequent requests
    • Add to single $http request
    • Add to $HttpProvider common headers
    • Using $Http Interceptors

Presentation



Code
The code for this presentation can be found at this location:
Thanks

2/1/16

Angularjs Visual Studio Code Snippets

              , ,       3 comments    
When working with AngularJS, we can quickly notice that a very repetitive task is creating the different AngularJS modules, services, controllers as well as other components for our application. In an effort to facilitate this task, we have created some code snippets that can be leveraged as seed for our module implementation.

The main purpose for these snippets is to provide a consistent format for our files with the same naming conventions and comment blocks. This is very handy with working in a team of multiple software developers.

What is a Visual Studio code snippet?

Visual Studio has a feature that allows us to quickly add code snippet to our files. To access this feature, we can right click anywhere on the file, and select Code Snippet from the Context menu. This shows a list of folders with snippets. After inserting a snippet, the code with highlighted labels is inserted into the document. The highlighted labels are placeholder that can be replaced by the specific content for your file. Take a look at this video for more information:





Download the Snippets

You can download the snippets from GitHub using the following URL:

https://github.com/ozkary/angularjs-visual-studio-code-snippets.git

The common format for these files looks as follows:


The highlighted areas can be replaced with the information that is relevant to your project. We should note that all labels with the same tag are also replaced by the information entered. So in the case of the controller above, all ‘app’ and ‘myController’ tags are replaced as shown next:



(function () {
    'use strict';

    var app = angular.module('baseball');
    app.controller('baseball.ctrl.team', [ctrlteam]);

    function ctrlteam() {

    }

})();


Import Snippet to Visual Studio

To import the snippets, open Visual Studio and follow these steps:
  • Click on Tools menu
  • Code Snippet Manager
  • Add a folder
  • Click Import

This allows us to know import the snippet files into the new folder.  You are all welcome to add other snippets or modify a file to match your needs.


Hope it helps.