Part III

AngularJS

from Intro to Advanced

Overview

AngularJS from Intro to Advanced (III)

AngularJS from Intro to Advanced (III)

Part I

  • Style guides
  • Naming
  • Architecture
  • Patterns
  • Hello, AngularJS
  • Modules
  • Routing (I)

Part II

  • Routing (II)
  • Components
  • Directives
  • Services (I)

Part III

  • Services (II)
  • Filters
  • Interceptors
  • i18n
  • Build tools
  • Testing
  • Continuous Integation

AngularJS from Intro to Advanced (III)

Agenda

10:30 - 10:45 Overview

10:45 - 11:00 Recap

11:00 - 12:30 Services (II)

12:30 - 13:30 Lunch break

13:30 - 14:30 Filters

14:30 - 15:30 Interceptors

15:30 - 15:45 Break

15:45 - 16:30 Internationalisation (i18n)

16:30 - 18:00 Build tools

18:00 - 18:15 Break

18:15 - 18:30 Testing

18:30 - 19:00 Continuous integration (CI)

Recap

AngularJS from Intro to Advanced (III)

AngularJS from Intro to Advanced (III)

routing

state vs location

params

child states

transitions

hooks

AngularJS from Intro to Advanced (III)

components

supercharged directives

no link stage

defer logic to services

var self = this

controllerAs

binding

lifecycle hooks

AngularJS from Intro to Advanced (III)

directives

angular default (ng)

structure, event, data bind

custom directives

manipulate dom

wrap other elements

event listeners

communicates

AngularJS from Intro to Advanced (III)

services

data services

Services (II)

AngularJS from Intro to Advanced (III)

AngularJS from Intro to Advanced (III)

types of services

data

behaviour logic

business logic

AngularJS from Intro to Advanced (III)

behaviour logic services

reusable functionality

agnostic logic

orchestrators

AngularJS from Intro to Advanced (III)

business logic services

component specific functionality

actions, watchers, parsers

shared services

Filters

AngularJS from Intro to Advanced (III)

AngularJS from Intro to Advanced (III)

manipulate data

without mutation

AngularJS from Intro to Advanced (III)

existing filters

filter

json

limitTo

orderBy

currency

date

number

lowercase / uppercase

AngularJS from Intro to Advanced (III)

custom filters

Interceptors

AngularJS from Intro to Advanced (III)

AngularJS from Intro to Advanced (III)

request / response

middleware

AngularJS from Intro to Advanced (III)

injecting into requests

authentication tokens

state variables

parse request payload

AngularJS from Intro to Advanced (III)

handle response

error manipulation

handle permissions

parse response payload

Internationalisation (i18n)

AngularJS from Intro to Advanced (III)

AngularJS from Intro to Advanced (III)

localization

vs.

internationalisation

AngularJS from Intro to Advanced (III)

angular-translate

Build tools

AngularJS from Intro to Advanced (III)

AngularJS from Intro to Advanced (III)

grunt

gulp

webpack

AngularJS from Intro to Advanced (III)

grunt

task runner

focuses more on config

monolithic approach

AngularJS from Intro to Advanced (III)

gulp

task runner

focuses more on task actions

modular approach

AngularJS from Intro to Advanced (III)

webpack

module builder

focuses more on modules

modular approach

Testing

AngularJS from Intro to Advanced (III)

AngularJS from Intro to Advanced (III)

Unit Testing

vs.

E2E Testing

AngularJS from Intro to Advanced (III)

Unit Testing

Karma

Jasmine

Mocha

Chai

Jest

AngularJS from Intro to Advanced (III)

E2E Testing

Protractor

Cypress

Continuous Integration (CI)

AngularJS from Intro to Advanced (III)

AngularJS from Intro to Advanced (III)

AngularJS from Intro to Advanced (III)

build

test

deploy

AngularJS from Intro to Advanced (III)

Jenkins

Travis

Bamboo

Gitlab CI

Circle CI

Q&A

AngularJS from Intro to Advanced (III)

Thank you!