Your SlideShare is downloading. ×
JavaScript Architektur
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

JavaScript Architektur

1,081
views

Published on

Published in: Technology, Business

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
1,081
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
1
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 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