1. Enterprise JavaScript
Architekturen
Tuesday 29 October 13

2. WER BIN ICH?
• Sebastian
Springer
• https://github.com/sspringer82
• @basti_springer
Tuesday 29 October 13

3. Eine Softwarearchitektur ist einer der Architekturtypen in
der Informatik und beschreibt die grundlegenden
Komponenten und deren Zusammenspiel
innerhalb eines Softwaresystems.
Tuesday 29 October 13

4. Wie strukturiere ich meine JavaScript-Applikation?
Tuesday 29 October 13

5. Wartbarkeit und Erweiterbarkeit
Tuesday 29 October 13

6. Tuesday 29 October 13

7. Server
Tuesday 29 October 13

8. Client
Server
Tuesday 29 October 13

9. Client
Server
Tuesday 29 October 13

10. Client
Request
Server
Tuesday 29 October 13

11. Client
Request
Server
Tuesday 29 October 13

12. Client
Request
Response
Server
Tuesday 29 October 13

13. Client
Request
HTTP
Response
Server
Tuesday 29 October 13

14. Response?
Header
Body
Tuesday 29 October 13

15. Response?
Statuscode
Header
Body
Tuesday 29 October 13

16. Response?
Statuscode
Header
Body
Tuesday 29 October 13
ContentType

17. Response?
Statuscode
Header
HTML
Tuesday 29 October 13
Body
ContentType

18. Response?
Statuscode
Header
HTML
Tuesday 29 October 13
Body
ContentType
CSS

19. Response?
Statuscode
Header
HTML
Body
JavaScript
Tuesday 29 October 13
ContentType
CSS

20. Pro Datei, maximal zwei Sprachen
Tuesday 29 October 13

21. .
└── public
├── css
├── js
│ ├── news
│ │ ├── models
│ │ └── views
│ └── user
│
├── models
│
└── views
└── test
├── news
│ ├── models
│ └── views
└── user
├── models
└── views
Tuesday 29 October 13

22. Multi Page vs. Single Page
Tuesday 29 October 13

23. Multi Page App
Einstiegsseite
Tuesday 29 October 13

24. Multi Page App
Einstiegsseite
Tuesday 29 October 13
Modul 1

25. Multi Page App
Einstiegsseite
Tuesday 29 October 13
Modul 1

26. Multi Page App
Einstiegsseite
Tuesday 29 October 13
Modul 1
Modul 2

27. Multi Page App
Einstiegsseite
Tuesday 29 October 13
Modul 1
Modul 2

28. Einstiegsseite
Tuesday 29 October 13

29. JSON
Einstiegsseite
Tuesday 29 October 13

30. JSON
Einstiegsseite
Tuesday 29 October 13

31. Modul 1
JSON
Einstiegsseite
Tuesday 29 October 13

32. Modul 1
JSON
Einstiegsseite
Tuesday 29 October 13
JSON

33. Modul 1
JSON
Einstiegsseite
Tuesday 29 October 13
JSON

34. Modul 1
JSON
Modul 2
Einstiegsseite
Tuesday 29 October 13
JSON

35. Modul 1
JSON
Modul 2
Einstiegsseite
JSON
JSON
Tuesday 29 October 13

36. Modul 1
JSON
Modul 2
Einstiegsseite
JSON
JSON
Tuesday 29 October 13

37. Modul 1
JSON
Modul 2
Einstiegsseite
JSON
Modul 3
JSON
Tuesday 29 October 13

38. MV*?!
Tuesday 29 October 13

39. MVC
Tuesday 29 October 13

40. Model
Tuesday 29 October 13

41. Model
Tuesday 29 October 13
View

42. Controller
Model
Tuesday 29 October 13
View

43. Tuesday 29 October 13

44. MVVM
Tuesday 29 October 13

45. Model
Tuesday 29 October 13

46. Model
Tuesday 29 October 13
Businesslogik

47. Model
ViewModel
Tuesday 29 October 13
Businesslogik

48. Model
ViewModel
Tuesday 29 October 13
Businesslogik
UI-Logik

49. Model
ViewModel
Tuesday 29 October 13
Businesslogik
UI-Logik

50. Model
ViewModel
Tuesday 29 October 13
Businesslogik
UI-Logik

51. Model
ViewModel
View
Tuesday 29 October 13
Businesslogik
UI-Logik

52. Model
ViewModel
View
Tuesday 29 October 13
Businesslogik
UI-Logik
Darstellung

53. Model
ViewModel
View
Tuesday 29 October 13
Businesslogik
UI-Logik
Darstellung

54. Model
ViewModel
View
Tuesday 29 October 13
Businesslogik
UI-Logik
Darstellung

55. Model
ViewModel
Businesslogik
UI-Logik
DataBinding
View
Tuesday 29 October 13
Darstellung

56. Tuesday 29 October 13

57. Modulloader
Tuesday 29 October 13

58. require.js
Tuesday 29 October 13

59. index.html
Tuesday 29 October 13

60. index.html
config
Tuesday 29 October 13

61. index.html
config
Tuesday 29 October 13
require.js

62. index.html
config
main
Tuesday 29 October 13
require.js

63. index.html
config
main
App
Tuesday 29 October 13
require.js

64. Requirejs Optimizer
Tuesday 29 October 13

65. Ember
Tuesday 29 October 13

66. Router
Tuesday 29 October 13

67. Controller
Router
Tuesday 29 October 13

68. Controller
Router
Tuesday 29 October 13
Templates

69. Controller
Router
Tuesday 29 October 13
Templates
Model

70. Controller
Router
Templates
Components
Tuesday 29 October 13
Model

71. Controller
Router
Templates
Components
Tuesday 29 October 13
Model

72. Controller
Router
Templates
Components
Tuesday 29 October 13
Model

73. JavaScript auf dem
Server?
Tuesday 29 October 13

74. Node.js & Express
Tuesday 29 October 13

75. Node.js
C-Libs
Tuesday 29 October 13

76. Node.js
C-Libs
Tuesday 29 October 13

77. Node.js
C-Libs
Standard Library
Interne Module
Tuesday 29 October 13

78. Node.js
C-Libs
Standard Library
Interne Module
Tuesday 29 October 13

79. Node.js
C-Libs
Standard Library
Interne Module
Tuesday 29 October 13

80. Node.js
C-Libs
Standard Library
Interne Module
Tuesday 29 October 13
NPM

81. Node.js
C-Libs
Standard Library
Interne Module
Tuesday 29 October 13
NPM

82. Express
HTTP-Modul
Connect
Middleware
Express
Tuesday 29 October 13
Webserver, Request,
Response
Routing

83. Routing
app.<method>(url, [callback...], callback)
Tuesday 29 October 13

84. Routing
app.<method>(url, [callback...], callback)
get
post
put
delete
...
Tuesday 29 October 13

85. Routing
app.<method>(url, [callback...], callback)
get
post
put
delete
...
Tuesday 29 October 13

86. Routing
app.<method>(url, [callback...], callback)
get
post
put
delete
...
Tuesday 29 October 13
function (req, res, next) {
...
next();
}

87. Routing
app.<method>(url, [callback...], callback)
get
post
put
delete
...
Tuesday 29 October 13
function (req, res, next) {
...
next();
}

88. Routing
app.<method>(url, [callback...], callback)
get
post
put
delete
...
Tuesday 29 October 13
function (req, res, next) {
...
next();
}

89. Middleware
app.use([path], function)
Tuesday 29 October 13

90. Middleware
app.use([path], function)
function (req, res, next) {
...
next();
}
Tuesday 29 October 13

91. Middleware
app.use([path], function)
function (req, res, next) {
...
next();
}
Tuesday 29 October 13

92. Meteor
Tuesday 29 October 13

93. Meteor
Synchronisierung
Live Updates
Pakete
Tuesday 29 October 13

94. Realtime
Tuesday 29 October 13

95. HTTP
Server
Realtime
Server
Tuesday 29 October 13
Request
Response
Message
Client
Client

96. Server
Tuesday 29 October 13
Client

97. Server
Tuesday 29 October 13
Client

98. Server
Client
Request (http)
Tuesday 29 October 13

99. Server
Client
Request (http)
Tuesday 29 October 13

100. Server
Client
Request (http)
Response (http)
Tuesday 29 October 13

101. Server
Client
Request (http)
Response (http)
Tuesday 29 October 13

102. Server
Client
Request (http)
Response (http)
Switch Protocol
Tuesday 29 October 13

103. Server
Client
Request (http)
Response (http)
Switch Protocol
Tuesday 29 October 13

104. Server
Client
Request (http)
Response (http)
Switch Protocol
Messages
Tuesday 29 October 13

105. Ext JS, dojo, etc?
Tuesday 29 October 13

106. Fragen?
Tuesday 29 October 13

107. Kontakt
Sebastian Springer
sebastian.springer@mayflower.de
Mayflower GmbH
Mannhardtstr. 6
80538 München
Deutschland
@basti_springer
https://github.com/sspringer82
Tuesday 29 October 13