Angular and WIP: Progressive Saving

Quite often we force users to to save or cancel data, before moving on when what they really want is to leave the page in a changed state and come back to their work in progress later, perhaps after closing the browser. This requires change tracking, local storage, serializing and rehydrating complex object graphs, not to mention visual indicators to improve the user experience. Come learn how when AngularJS meets BreezeJS we can light up this scenario.

Transcript

1. Progressive Saving of Work in Progress John Papa @john_papa
2. @john_papa http://johnpapa.net Blog: http://jpapa.me/cc-ng-z Live demo:
3. It’s All About the WIP
4. Saving is Easy
5. Life Happens
6. Close the Browser by Accident
7. Juggling Too Many Workflows At One Time
8. We Have Some Options
9. Some Are Clearly Better Than Others
10. Option A: You Leave, You Lose Changes
11. Option B: You Can’t Leave!
12. Option C: Auto-Save as User Types What if the Data is Invalid ? What if the Data is Incomplete ? This may not work out so well
13. Option D: Give Up?
14. What Do You Do?
15. Use WIP
16. Save WIP Automatically What Stories Should We Handle ? Get WIP Cancel WIP Listen for Changes Tell the User
18. Breeze Import/Export API’s Key Technical Features Angular Directives HTML5 Local Storage Angular Services
19. How Do We Know When to Stash? Listen to breeze Broadcast a custom message
20. How Do We Export an Entity ? Stash all WIP Serialize entity, changes and state
21. How Do We Import an Entity ? Return the newly imported entity Grab the stashed WIP Import the WIP into Breeze
22. Update the asterisk and counter How Do We Tell the User ?
23. The WIP data Who tells the directive when WIP changes WIP directive How Do We Tell the User ?
24. How Do We Interact with WIP ?
25. Angular and Breeze WIP Library http://jpapa.me/ng-z-wip
26. Enjoy it!
27. Pluralsight Courses Angular Fundamentals - Joe Eames/Jim Cooper http://jpapa.me/ngfundps Build Angular and Breeze Apps Part 1 and 2 John Papa http://jpapa.me/spangz and http://jpapa.me/ spangz2
28. @john_papa http://johnpapa.net Blog: http://jpapa.me/cc-ng-z Live demo: