1. Template designed by
web development:
client side vs. server side
Andrea Saltarello
andrea.saltarello@ugidotnet.org
http://blogs.ugidotnet.org/pape
http://twitter.com/andysal74

2. brought to you by

3. chi sono
•CEO @ Managed Designs
•Co-founder & Presidente di UGIdotNET
•MVP ASP.NET dal 2003
•Co-autore di «Microsoft® .NET: Architecting Applications for
the Enterprise», pubblicato da Microsoft Press (1° edizione del
2008, la v2 esce a luglio)
•In sintesi… Trainer e consulente, ma soprattutto «Dev» 

5. 90’s: come eravamo…

7. Trova le differenze 

8. Cosa è cambiato?
Più o meno… Tutto 
•Velocità della connessione
•«Eterogeneità» dei client
•«Potenza» del client
•Normative
•Tipologia dei servizi offerti
•Concorrenza dell’offerta
Se cambiano i requisiti, cambia l’architettura

9. Architecture
The fundamental organization of a system embodied in its
components, their relationships to each other, and to the
environment, and the principles guiding its design and evolution.
[ISO/IEC 42010]

10. 2014: Web vs. Architettura
I «components» sono (almeno) il front end ed i(l) back end,
l’«environment» è Internet.
1. Macro-architettura (es: thin client, SPA)
2. Architettura front end
3. Architettura back end
P.S.: ogni pagina può essere (quasi) un mondo a sé

11. Il requisito, questo sconosciuto
Citando (quasi ) Don Abbondio: «il requisito (se non l’ha) uno
non se lo può dare»
Il nostro requisito? http://www.ugidotnet.org 

12. Sito UGIdotNET
•Fino a 1 milione di accessi/mese
•16000+ utenti
•Picchi non (sempre) prevedibili
•Fruizione da:
• PC
• Smartphone
• Tablet
•Integrazione con servizi esterni:
• SubText (blog engine)
• Vimeo (video)
•SEO

13. Architettura: back-end
Considerazioni:
•Non c’è necessariamente bisogno di essere «alt», oggi lo stack
è «good enough» out of the box
•MVC è il miglior «Jack-of-all-trades».
•CQRS paga *sempre*. *Sempre*.

14. demo
CQRS @ UGIdotNET

15. Architettura: front-end
Considerazioni:
•Decidere *subito* i browser supportati
•Usare sempre Bootstrap, in un modo o nell’altro
•La strategia «zero Javascript» non paga, prendiamone atto
•La strategia «SPA» vince, perf wise, a mani basse ma è una
sciagura sul fronte SEO

16. Front-end: tecnologia
IE7 IE8 IE9+ Chrome Opera Safari 5+ Firefox
jQuery 1.x Y Y Y V-1+ 12.1, V-1+ 5.1+ V-1+
jQuery 2.x N N Y V-1+ 12.1, V-1+ 5.1+ V-1+
Bootstrap 2 Y Y Y Y 12.1, V-1+ Y Y
Bootstrap 3 N N Y Y Y Y Y
AngularJS 1.2 N Y Y Y Y Y Y

17. demo
AngularJS
Bootstrap

18. SEO (?)
L’investimento è inutile, se poi non abbiamo utenti. Facciamoci
trovare:
•Sitemap + (Robots.txt)
•Microdata
•Webmaster Tools

19. Sitemap
•Comunicano ai crawler gli url esposti dal sito
•Supportate da Bing e Google
•Documentate qui: http://www.sitemaps.org/

20. demo
Sitemap @ UGIdotNET

21. Microdata
•Aumentano la semantica oltre quanto permesso da HTML5
•Supportati da Bing, Google e Yandex
•Documentati qui: http://schema.org/

22. demo
Microdata @ UGIdotNET
Google Webmaster Tools
AngularJS vs. SEO

23. Demo
•MvcMate: http://mvcmate.codeplex.com
•UGIdotNET: http://www.ugidotnet.org (visualizzare sorgente
della pagina)

24. Grazie a tutti per la partecipazione
Riceverete il link per il download a slide e demo via email nei
prossimi giorni
Per contattarmi
andrea.saltarello@ugidotnet.org
Grazie