Top Banner
F rontend Platform based on AngularJS
16
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: FrontEnd platform based on AngularJS

Frontend Platform based on

AngularJS

Page 2: FrontEnd platform based on AngularJS

• Backbone

Agenda

≈ customer’s problems

≈ AngularJS overview

≈ Application architecture

overview

Page 3: FrontEnd platform based on AngularJS

Application structure

Design of the

application

Deferent libraries

and frameworks

Customer’s problem API documentation

Page 4: FrontEnd platform based on AngularJS

Our team

Page 5: FrontEnd platform based on AngularJS

• Backbone

Backbone

› Custom API

› Custom structure in backbone

› No custom api documentation

› No tests

› Middle entry point

Page 6: FrontEnd platform based on AngularJS

• Backbone

Customer Super

Framework

…No API documentation

…No tests

…Deferent ways in architecture

…High entry point

Page 7: FrontEnd platform based on AngularJS

Ⱶ Good API documentation

Ⱶ Big community

Ⱶ Strong structure

Ⱶ Middle entry point

Ⱶ Good Testability

AngularJS

Page 8: FrontEnd platform based on AngularJS

Module

Directive

Controller

Service

Value

Page 9: FrontEnd platform based on AngularJS

Module-1

Directive

Controller

Service

Value

Module-2

Directive

Controller

Service

Value

Dependency Injection

Page 10: FrontEnd platform based on AngularJS

• Backbone

AngularJS is a better

way

♪ Angular’s module as key unit

of application

(interlock/creative)

♪ Structured api is a good point

for code generate

♪ AngularJS based application

has a good testability

♪ Easiest api documentation ->

module == interlock/creative

Page 11: FrontEnd platform based on AngularJS

Creative

Directive

Controller

Value

Module

Directive

Controller

Value

Page 12: FrontEnd platform based on AngularJS

Creative

Directive

Service

Interlock-3Directive

Interlock-2

Directive

Interlock-1

Directive

Page 13: FrontEnd platform based on AngularJS

Widget 1

Widget 2 Widget 3

Page 14: FrontEnd platform based on AngularJS

Creative

Directive

Service

Interlock-1Directive

Interlock-2

Directive

Interlock-1

Directive

Showcase Interlock-2Directive

Page 15: FrontEnd platform based on AngularJS

∑ Code generating with Yoman

∑ widget development in

showcase

∑ better architecture for all

future customer’s applications

finally

Page 16: FrontEnd platform based on AngularJS

questions

Graphics- liambrazier.com