Community Tour 2010 - CMS Edition DotNetMarche Slides relative alla prima sessione su Orchard: concetti di base su Orchard e WebMatrix.

1. WebMatrix + OrchardFirst Impact… Ing. Giorgetti Alessandro Software Artisan SID s.r.l.

2. About me… Giorgetti Alessandro Laurea in Ingegneria Elettronica Cofondatore di SID s.r.l. Blog: http://www.primordialcode.com Email: alessandro.giorgetti@live.com, guardian@nablasoft.com Twitter: @A_Giorgetti

3. WebMatrix

4. WebMatrix WebMatrix: tool gratuito per lo sviluppoedil deploy diapplicazioniweb. Non è un sostitutodi Visual Studio. Gestiscediversi tipi di web applications e web application frameworks (like WordPress, Umbraco, Orchard…).

5. WebMatrix Creazione di un sito web: si possono creare siti completamente vuoti od utilizzare i template di inuumerevoli web application frameworks. I siti web sono ‘in hosting’ su IIS o IISExpress: ambiente ideale per lo sviluppo. Personalizzazione: WebMatrix supporta differenti tipi di editor per gestire diversi aspetti del sito web (pagine, css, etc…). Pubblicazione: utilizzando un wizard integrato è possibile pubblicare automaticamente il proprio sito web verso il provider di destinazione.

6. WebMatrix - setup Il modo più semplice per istallare WebMatrix: Download ed Istallazione: Microsoft Web Platform Installer Cerca Microsoft WebMatrix tra i prodotti disponibili ed aggiungilo alla lista di istallazione Tutte le dipendenze saranno automaticamente scaricate ed istallate se necessario.

7. WebMatrix - setup

8. WebMatrix - site view Consente di configurare con semplicità diversi parameteri del sito relativi all’hosting su IIS o IISExpress (in alternativa si possono gestire ‘a mano’ i file di configurazione).

9. WebMatrix - file view Consente di creare ed editare file relativi al sito web: dal codice agli stili CSS.

10. WebMatrix - database view Consente la connessione e la gestione di diversi tipi di datasource: è possibile editare tabelle e gestire i dati in esse contenuti. Non è un sostituto per Sql Management Studio, Toad ed analoghi.

11. WebMatrix - report view Consente di analizzare il sito web e scovare potenziali problemi.

12. WebMatrix - demo How it works… WebMatrix in action

13. Orchard

14. Orchard Orchard è un CMS web based: consente la ‘costruzione’ di un sito web partendodaelementigiàesistenti. Segue un approccioestremamentemodulare e flessibile. Basatosu ASP.NET MVC 3. Layer diperistenza: Nhibernate + Fluent Mappings. Puòutilizzarediversi tipi di database (non solo SqlServer).

15. Orchard - setup Diverse opzioni di installazione e configurazione: dal download e compilazione del source code all’uso di pacchetti di istallazione precompilato o del Windows Platform Installer (my favourite). In ogni caso, abbiamo iniziato con WebMatrix  procediamo sullo stesso percorso: Aprire la dashboard di WebMatrix. Selezionare ‘Sito da raccolta web’. Scegliere Orchard dalla lista che viene presentata.

17. Account di amministrazione.

18. Tipo di storage.

20. Orchard - first run Questo è uno screenshot della dashboard:

21. Orchard - demo Istallazione e configurazione del sito Up and Running in 5 minutes First Run Demo

22. Orchard – concetti di base Orchard è una soluzione estremamente modulare. Ogni modulo/package può essere suddiviso in differenti componenti che offrono diverse funzionalità. Per capire ‘come funziona’ dobbiamo familiarizzare con alcuni termini e definizioni utilizzate dal team di sviluppo:

23. Orchard – concetti di base Content Tutto ruota attorno ai contenuti; un ‘contenuto’ è qualcosa che ha delle informazioni associate (una pagina, un post del blog, un commento…abbiamo diversi tipi di contenuti). Un contenuto non è di per sé una entità atomica; può essere composto da diversi tipi di informazioni (parti). Una singola ‘content part’ viene utilizzata per fornire un comportamento coerente che può essere riutilizzato in diversi contesti.

24. Orchard - content parts Admin Menu – consente agli elementi di apparire nei menu di amministrazione (dashboard). Body – fornsce il contenuto, l’informazione. Comments – supporto per la gestione dei commenti Common – fornisce attributi e supporto a funzioni di base (come indicare un proprietario e/o vari timestamp). Containable – consente all’oggetto di essere contenuto in una lista. Container – fornisce supporto per contenere oggetti di diversa tipologia. Custom properties – aggiunge tre campi stringa custom agli oggetti.

25. Orchard - content parts Identity Menu – consento al contenuto di apparire nei menu Publish Later – fornisce supporto alla gestione della pubblicazione differita nel tempo Route Part – supporto per consentire l’accesso alla risorsa Tags Part – associa dei tag al contenuto (consente una sorta di categorizzazione dei contenuti, i contenuti ‘taggati’ sono accessibili come risorse: ~/tags/tag-name) More parts can be added…

26. Orchard - content fields I ‘Content field’ sonoporzionidiinformazionechepossonoessereaggiuntiai ‘Content Item’. Hanno un nomeed un tipoedunavoltaassociatidivengonospecifici per un dato content type. Ad esempio: un contenutoditipo ‘Evento’ puo’ avereassociato un body (informazionechedescrivel’evento), un field ‘Locazione’ (testo,map) ed un field ‘Data’ (datetime). È possibiledefiniredei field custom per rappresentareipropri tipi diinformazioni.

27. Orchard - demo Creare diversi tipi di contenuti… Creare Contenuti

28. Orchard - modules and features Tutte le funzionalitàesposteda Orchard sonoimplementate come moduli (module). Un modulo è un set diestensionifisicamenteraggruppate in unacartella del sito web (all’internodellacartella ‘Modules’). Un modulo puòcontenereuna o piùfunzionalità (feature), un modulo è quindi un raggruppamentologicodifunzionalitàchepossonoessreabilitate o disabilitateindividualmente. Per accedereallagestionedeimoduli: Dashboard  Modules.

29. Orchard - demo How it works… Modules & Features

30. Orchard – themes & composition Orchard prediligeunachiaraseparazionetra la gestione del contenuto (informazione) e la visualizzazione del contenutostesso. Ognifunzionalità, parte o contenutohanno la propriarappresentazionegrafica. Orchard è caratterizzato dall’avere un motore di composizione che è in grado di accorpare le singole entità eterogenee in una unica organizzazione coerente. Il meccanismo di composizione di Orchard è abbastanza complesso da padroneggiare, questo è dovuto essenzialmente all’elevato livello di flessibilità e customizzazione che deve garantire.

31. Orchard - theme Un Tema (theme) è un package chedefinisceil ‘look & feel’ per un sito web. Consiste in unacombinazionedi style sheet, immagini, file di layout, template per controlli e, neitemipiùavanzati, custom code. È possibilecrearetemicheereditinodaaltritemipredefiniti (in questomodo è possibileeffettuarepiccolemodifiche ad un tema base senzaalterarne le funzionalità).

32. Orchard - layout Un ‘Layout’ in unatema è un particolare file chedefiniscel’organizzazionedellapagina web. Un Layout identifica un set di zone in cui posizionarecontenuti e widgets. Al momento è possibileavere un solo Layout di base per ilsito. È possibilecustomizzare come le paginedi diverse sezionivengonorenderizzateusandocombinazionididiversi layers (maggioriinformazionitrabreve).

33. Orchard - layout (example)

34. Orchard - zones & widgets Le ‘Zone’ sonospecifichesezioni del layout chesiprestanoall’inserimentodicontenuti e widgets. Le zone privedielementi o contenuto non vengonorenderizzate. Un ‘Widget’ è un frammentodi UI chepuòessereaggiuntoallapagina del sito. Esempidi widgets: tag cloud, mappe, archivi, listedi post, etc… sonoimplementaticome funzionalitàespostedaimoduli.

35. Orchar - layer Un ‘Layer’ è un gruppodi widget (con la lorospecificaconfigurazione) attivatodaunabendefinitaregoladivisualizzazione. È possibiledefinirediversi tipi diregoledivisualizzazione. Quandopiùdi un layer è attivocontemporaneamentesullastessapagina, tuttigli widget diquei layer sonovisualizzaticontemporaneamente. Per customizzare e/o definire layers:Dashboard  Widgets.

36. Orchard – layer rules Unaregoladi layer è unaespressionechepuòesserevera o falsa. Rules syntax: You can build complex expressions: (not authenticated and url("~/about")) or authenticated

37. Orchard - template Abbiamo visto l’organizzazione della pagina (theme, layout, zone, widget, layer); occupiamoci ora della visualizzazione effettiva del contenuto: Occorre un ‘qualcosa’ che consenta la conversione dei dati e delle informazioni in elementi HTML che verranno renderizzati dal browser. Un template è essenzialmente un file HTML con dei placeholders e dei markers per indicare la posizione dei dati all’interno del frammento:(<h2>@Model.Title</h2>).

38. Orchard - shape Prima di venire renderizzato attraverso un template ogni oggetto viene convertito in una ‘Shape’. Una shape è letteralmente un oggetto che contiene tutte le informazioni necessarie alla sua visualizzazione. A livello logico una pagina non è altro che un albero di queste strutture che fornisce una rappresentazione astratta della pagina stessa (come avviene in WPF/Silverlight con i visual ed i logical tree di una form xaml). Questo approccio consente la trasformazione di ogni oggetto prima della effettiva visualizzazione.

39. Orchard - placement Durante il rendering diunapagina Orchard elaborainformazioni circa ilposizionamentodiognioggetto. Due meccanismifondamentali: Informazioniderivantidaitemplate. File Placement.info – file XML chedescrive, mediante un opportuno set diregole, come combinare le shapes, in cheordineed in quali zone inserirle.

40. Orchard - demo Layers & Widget

41. Orchard - security Supporto per gestione Utenti e Ruoli. Set predefinito di Ruoli a cui è possibile assegnare gli utenti. È possibile creare nuovi ruoli. Ogni ruolo ha il proprio set di permessi assegnato. I permessi sono garantiti ai ruoli, ma non esplicitamente negati: se un utente appartiene ad un gruppo che garantisce un determinato permesso allora l’utente ha quel permesso. Alcunipermessisono ‘garantitieffettivamente’ (sonoimplicatidaaltripemessi, es: site owner garantisceimplicitamentetuttoilresto). Ogni feature puòesporreilproprio set dipermessi. GestioneUtenti e Ruoli: Dashboard  Users.

42. Orchard – advanced topics

43. Orchard - searching & indexing Funzionalità fornita attraverso un set di moduli: Indexing – fornisce servizi di indicizzazione. Lucene – implementazione specifica servizio idx. Search – fornisce la possibilità di eseguire query. Nuove opzioni vengono aggiunte alla sezione di configurazione della Dashboard (per selezionare quali tipi di contenuti indicizzare e come schedulare le operazioni di indicizzazione). Viene fornito un nuovo widget (SearchForm) per offrire agli utilizzatori del sito una interfaccia mediante la quale eseguire ricerche.

44. Orchard – custom content types È possibile creare tipi di contenuto custom per rappresentare specifici scenari (come ad esempio un ‘Evento’ o uno ‘Sponsor’). I tipi custom possono essere costituiti da: Parts– blocchi predefiniti di proprietà che definisco comportamenti ben precisi ed uniformi. Fields – singole porzioni di informazioni che definiscono dati specifici al tipo che stiamo costruendo (supporto per differenti tipi di campo, altri ne possono essere creati emdiante moduli e features). I tipi custom hanno diversi comportamenti in relazione alle differenti Parts che vengono usati per comporli.

45. Orchard – content lists È possibile organizzare i contenuti in liste: Editare un tipo esistente o crearne uno custom aggiungendo le seguenti Parts: Common – fornisce supporto per un set base di proprietà (proprietario, date di creazione e modifica, ecc…) Containable – indica che questo tipo può essere associato ad una lista ed abilita la dashboard alla gestione della relazione tra contenuti e liste. Di seguito si deve creare una List (lista) che conterrà oggetti del tipo appena definito:Dashboard  New  List.

46. Orchard – content lists Per visualizzare una lista: Collegare il contenuto di tipo ‘List’ ad una voce di menu e visualizzarlo come pagina intera. Usare un “Container Widget” per inserire il contenuto all’interno di una zona del layout.

47. Orchard - demo Custom types

48. Thanks for attending!