1 / 28

Testable Web Applications With AngularJS and NodeJS

Testable Web Applications With AngularJS and NodeJS. Presented by Greg Burke Web Application Developer – FPI greg.burke@financialpartners.com. Angular and Node. Angular JS: comprehensive MV * framework Contains the building blocks for a SPA Node JS: server-side Javascript

annot
Download Presentation

Testable Web Applications With AngularJS and NodeJS

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Testable Web Applications With AngularJS and NodeJS Presented by Greg Burke Web Application Developer – FPI greg.burke@financialpartners.com

  2. Angular and Node • Angular JS: comprehensive MV* framework • Contains the building blocks for a SPA • Node JS: server-side Javascript • Web server, test runner

  3. Outline • Brainstorm • Overview of SPA • Problems • Framework Discussion • Angular Demo • Testing Demo • Other topics in Node/Angular

  4. Brainstorming • Discuss the different elements needed in order to build a large enterprise application

  5. Considerations • SPA? • MV*? • Controls? • Module loading? • Unit Testing?

  6. SPA • Only one true “page” • Multiple “views” • Async requests • Need to handle back button and navigable views • Sammy.js, JQueryAJAX, Amplify • Demo

  7. MV* • Separation of concerns • Two-way data-binding • Knockout.js, Backbone.js

  8. Controls • Grids • Date Pickers • Tree views • Input Masking • KendoUI and JQueryUI

  9. Module Loading • Dependency management • Code separation • RequireJS

  10. Unit Testing • Specifications • Modules • MV* compatibility • Qunit, Jasmine

  11. Issues • Many different libraries • Not cohesive • Difficult to test • Compatibility issues • Onboarding

  12. Demo: Testability • Testing with this setup can be problematic

  13. Frameworks • “Inversion of Control is a key part of what makes a framework different to a library. A library is essentially a set of functions that you can call, these days usually organized into classes. Each call does some work and returns control to the client.” – Martin Fowler

  14. Discuss: Framework or Not

  15. Requirements • Inventory management app • Define a household inventory • Indicate when items are used • Generate a grocery list of needed items

  16. Angular JS • MV* framework • Cohesive and “opinionated” • All the necessary functionality for SPA • Helps you write testable code (DI) • AngularUI Team works on UI controls

  17. Controllers • Contains logic for rendering your View • Fields for data-binding • Avoid DOM manipulation • May be associated with a template • Example

  18. Directives • New tags/attributes • “Custom bindings” • Nested templates • DOM manipulation • Example

  19. Services • Share logic between controllers • Keeps controllers clean • Business logic • Example

  20. Resources • Similar to service proxy • Interact with any RESTful API

  21. Overview • Controllers • Directives • Services • Resources

  22. Full App Demo

  23. Testing • Dependency injection • Jasmine • Karma Testrunner

  24. Dependency Injection • Dependency injection is a software design pattern that allows the removal of hard-coded dependencies and makes it possible to change them, whether at run-time or compile-time.

  25. Full Testing Demo

  26. Pluralsight • AngularJS Fundamentals • AngularJS for .NET Developers • AngularJS In-Depth • Application Building Patterns with AngularJS • Building a Site with Bootstrap, AngularJS… • Building AngularJS and Node.js Apps… • Building Apps with Angular and Breeze

  27. Other Resources • http://docs.angularjs.org/api • http://docs.angularjs.org/tutorial/ • https://github.com/angular/angular-seed

More Related