Slide 1

Slide 1 text

No content

Slide 2

Slide 2 text

Building Rich Apps with AngularJS on ASP.NET www.johnpapa.net

Slide 3

Slide 3 text

No content

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

@john_papa ANGULARJS  PATTERNS   10 TIPS JOHN PAPA

Slide 7

Slide 7 text

ANGULARJS  PATTERNS   @john_papa   Time Productivity Data-binding rocks! What? I’m going back to jQuery! Wicked cool! Why the heck is it so difficult?! Thumbs Up for Dependency Injection! OMG, how can I back out of this? Maybe nobody will notice if I switch to Silverlight Angular Rocks! Modularity is the bomb!

Slide 8

Slide 8 text

No content

Slide 9

Slide 9 text

ANGULARJS  PATTERNS   @john_papa   http://jpapa.me/spangz https://github.com/johnpapa/ng-demos http://jpapa.me/ng-z-wip http://breezejs.com

Slide 10

Slide 10 text

ANGULARJS  PATTERNS   @john_papa   1.  2.  3.  4.  5.  6.  7.  8.  9.  10. 

Slide 11

Slide 11 text

1

Slide 12

Slide 12 text

No content

Slide 13

Slide 13 text

ANGULARJS  PATTERNS   @john_papa   Module View Controller Factories Directives Routes $scope

Slide 14

Slide 14 text

ANGULARJS  PATTERNS   @john_papa  

Slide 15

Slide 15 text

ANGULARJS  PATTERNS   @john_papa  

Slide 16

Slide 16 text

ANGULARJS  PATTERNS   @john_papa  

Slide 17

Slide 17 text

ANGULARJS  PATTERNS   @john_papa  

Slide 18

Slide 18 text

ANGULARJS  PATTERNS   @john_papa  

Slide 19

Slide 19 text

ANGULARJS  PATTERNS   @john_papa  

Slide 20

Slide 20 text

ANGULARJS  PATTERNS   @john_papa  

Slide 21

Slide 21 text

ANGULARJS  PATTERNS   @john_papa  

Slide 22

Slide 22 text

ANGULARJS  PATTERNS   @john_papa   Module View Controller Factories Directives Routes $scope

Slide 23

Slide 23 text

2

Slide 24

Slide 24 text

No content

Slide 25

Slide 25 text

No content

Slide 26

Slide 26 text

No content

Slide 27

Slide 27 text

ANGULARJS  PATTERNS   @john_papa  

Slide 28

Slide 28 text

ANGULARJS  PATTERNS   @john_papa  

Slide 29

Slide 29 text

ANGULARJS  PATTERNS   @john_papa  

Slide 30

Slide 30 text

No content

Slide 31

Slide 31 text

3

Slide 32

Slide 32 text

No content

Slide 33

Slide 33 text

ANGULARJS  PATTERNS   @john_papa   Expose functionality

Slide 34

Slide 34 text

ANGULARJS  PATTERNS   @john_papa   Immediately Identifiable

Slide 35

Slide 35 text

ANGULARJS  PATTERNS   @john_papa   http://jpapa.me/ngstormtmpl

Slide 36

Slide 36 text

No content

Slide 37

Slide 37 text

4

Slide 38

Slide 38 text

ANGULARJS  PATTERNS   @john_papa   Locating our code is easy Identify code at a glance Flat structure as long as we can Try to stay DRY L I F T http://jpapa.me/1iVpwkp

Slide 39

Slide 39 text

ANGULARJS  PATTERNS   @john_papa   By Type By Feature

Slide 40

Slide 40 text

No content

Slide 41

Slide 41 text

ANGULARJS  PATTERNS   @john_papa   Best Advice: Be Consistent! http://jpapa.me/ngstructure

Slide 42

Slide 42 text

No content

Slide 43

Slide 43 text

5

Slide 44

Slide 44 text

No content

Slide 45

Slide 45 text

ANGULARJS  PATTERNS   @john_papa  

Slide 46

Slide 46 text

ANGULARJS  PATTERNS   @john_papa  

Slide 47

Slide 47 text

ANGULARJS  PATTERNS   @john_papa  

Slide 48

Slide 48 text

ANGULARJS  PATTERNS   @john_papa   Controller Factory Directive Routes Module Config Service Provider Value Filter

Slide 49

Slide 49 text

ANGULARJS  PATTERNS   @john_papa  

Slide 50

Slide 50 text

ANGULARJS  PATTERNS   @john_papa   modularApp avengers dashboard widgets layout core ngAnimate ngRoute common ui-bootstrap

Slide 51

Slide 51 text

No content

Slide 52

Slide 52 text

6

Slide 53

Slide 53 text

No content

Slide 54

Slide 54 text

ANGULARJS  PATTERNS   @john_papa   View Controller Data Factory $http $scope Web Service

Slide 55

Slide 55 text

No content

Slide 56

Slide 56 text

7

Slide 57

Slide 57 text

No content

Slide 58

Slide 58 text

ANGULARJS  PATTERNS   @john_papa  

Slide 59

Slide 59 text

ANGULARJS  PATTERNS   @john_papa  

Slide 60

Slide 60 text

No content

Slide 61

Slide 61 text

8

Slide 62

Slide 62 text

No content

Slide 63

Slide 63 text

ANGULARJS  PATTERNS   @john_papa  

Slide 64

Slide 64 text

ANGULARJS  PATTERNS   @john_papa  

Slide 65

Slide 65 text

ANGULARJS  PATTERNS   @john_papa  

Slide 66

Slide 66 text

ANGULARJS  PATTERNS   @john_papa  

Slide 67

Slide 67 text

ANGULARJS  PATTERNS   @john_papa   Sessions Tracks TimeSlots Rooms Speakers

Slide 68

Slide 68 text

No content

Slide 69

Slide 69 text

9

Slide 70

Slide 70 text

ANGULARJS  PATTERNS   @john_papa  

Slide 71

Slide 71 text

ANGULARJS  PATTERNS   @john_papa  

Slide 72

Slide 72 text

No content

Slide 73

Slide 73 text

ANGULARJS  PATTERNS   @john_papa  

Slide 74

Slide 74 text

ANGULARJS  PATTERNS   @john_papa  

Slide 75

Slide 75 text

No content

Slide 76

Slide 76 text

No content

Slide 77

Slide 77 text

10

Slide 78

Slide 78 text

ANGULARJS  PATTERNS   @john_papa  

Slide 79

Slide 79 text

ANGULARJS  PATTERNS   @john_papa  

Slide 80

Slide 80 text

No content

Slide 81

Slide 81 text

ANGULARJS  PATTERNS   @john_papa   Breeze Import/ Export API’s Angular Directives Local Storage Angular Services

Slide 82

Slide 82 text

ANGULARJS  PATTERNS   @john_papa   Listen to breeze Broadcast a custom message

Slide 83

Slide 83 text

ANGULARJS  PATTERNS   @john_papa   Stash all WIP Serialize entity, changes and state

Slide 84

Slide 84 text

ANGULARJS  PATTERNS   @john_papa   Return the newly imported entity Grab the stashed WIP Import the WIP into Breeze

Slide 85

Slide 85 text

ANGULARJS  PATTERNS   @john_papa   Update the asterisk and counter

Slide 86

Slide 86 text

ANGULARJS  PATTERNS   @john_papa   The WIP data Who tells the directive when WIP changes WIP directive

Slide 87

Slide 87 text

ANGULARJS  PATTERNS   @john_papa  

Slide 88

Slide 88 text

ANGULARJS  PATTERNS   @john_papa   1.  2.  3.  4.  5.  6.  7.  8.  9.  10. 

Slide 89

Slide 89 text

ANGULARJS  PATTERNS   @john_papa   http://jpapa.me/spangz https://github.com/johnpapa/ng-demos http://jpapa.me/ng-z-wip http://breezejs.com

Slide 90

Slide 90 text

ANGULARJS  PATTERNS   @john_papa   http://pluralsight.com/training/Authors/Details/john-papa

Slide 91

Slide 91 text

ANGULARJS  PATTERNS   @john_papa   www.microsoft.com/learning http://microsoft.com/msdn http://microsoft.com/technet http://channel9.msdn.com/Events/TechEd

Slide 92

Slide 92 text

ANGULARJS  PATTERNS   @john_papa  

Slide 93

Slide 93 text

ANGULARJS  PATTERNS   @john_papa  

Slide 94

Slide 94 text

No content