Service with. RESTful API. Well-designed. Web app. Wednesday, January 23, 13 ... Use Javascript unobtrusively. Wednesday
Building large web-based systems: 10 Recommendations Stefan Tilkov | @stilkov | innoQ
We’ll take care of it - personally.
Wednesday, January 23, 13
Initial goals Simplicity Speed Easy development Maximum productivity
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Long-term goals Stability Scalability Maintainability Decoupling
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Modularize
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
UI
Logic
> Some Link
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Some Link
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Some Link
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Some Link
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Some Link
+ $("a.whatever").click(function() { doSomething(this.href); });
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
- Nunc tincidunt
- Proin dolor
- Aenean lacinia
Proin elit arcu, rutrum commodo, vehicula ...
Morbi tincidunt, dui sit amet facilisis feugiat, odio ...
Mauris eleifend est et turpis. Duis id erat ...
+ $("#tabs").tabs(); © 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Content HTML
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Layout CSS
Content HTML
Layout CSS
Behavior JavaScript
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Server / Backend responds with
styles
Base Markup
Layout/CSS
HTML Ajax
initializes styles
JS component Methods
Events
JS glue code Component 2 © 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Component 3
...
Use URIs to identify a single meaningful concept
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
http://.../A
A
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
http://.../A B A
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
C
?
http://.../B
http://.../A
B
A b
C c
+ AJAX + CSS
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
http://.../C
http://.../A B A
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
C
Don’t disable Browser Features – use them
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Multiple tabs & windows Bookmarks Back/Forward/Refresh Personalization Menus
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Recommendation #7: Apply the Web instead of working around it.
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Automate. Seriously.
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Testing
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Delivery
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Operations
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Back-office tasks
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Recommendation #8: Automate everything or you will be hurt.
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Web architecture tooling
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Browser
CDN
LB
n1
Frontend Web Server
Frontend Web Server
Frontend Web Server
n2
Reverse Proxy Cache
Reverse Proxy Cache
Reverse Proxy Cache
Web App Instance
Web App Instance
Web App Instance
n3 © 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Recommendation #9: Know, design for & use web components
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Design for scale with care
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
NoSQL
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Servers and Caches
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Cloud Platforms
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Transient Sharded Unshared
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Horizontally Scalable
Ye Good Ol’ SQL RDBMS
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Recommendation #10: You can use new-fangled stuff, but you might not have to.
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
Q&A Stefan Tilkov
[email protected] @stilkov Phone: +49 170 471 2625
© 2013 innoQ Deutschland GmbH Wednesday, January 23, 13
innoQ Deutschland GmbH
innoQ Schweiz GmbH
Krischerstr. 100
Gewerbestr. 11
40789 Monheim am Rhein
CH-6330 Cham
Germany
Switzerland
Phone: +49 2173 3366-0
Phone: +41 41 743 0116
http://www.innoq.com
[email protected]