Emanuele Bartolesi

Office 365, SharePoint e ASP.NET

Evento: Open .NET (the new era)

Il 26 Giugno i ragazzi di DotNetUmbria organizzano un evento a Perugia presso l’Hub Corciano.
Il tema della giornata saranno le ultime novità annunciate a Build (ed Ignite).
Di seguito vi riporto l’agenda.

Agenda
14.00-14.30 - Registrazione
14.30-15.10 - Keynote - Andrea Cruciani, Fabrizio Bernabei
15.10-16.00 - Le novità di VS2015 per lo sviluppatore ASP.NET - Emanuele Bartolesi
16.00-16.20 - Coffee break
16.20-17.10 - Docker: cos'è e come si usa il re dei container (Linux e oltre). - Marco Poponi
17.10-18.00 - C# 6.0 New Features - Gaetano Franco

Durante la mia sessione parleremo di cosa è cambiato per lo sviluppatore ASP.NET con VS 2015 e ASP.NET 5. Dall’introduzione dei nuovi strumenti all’interno di Visual Studio alle novità di ASP.NET 5.
Inoltre vedremo come poter lavorare con la nuova piattaforma di sviluppo web di Microsoft su Linux e Visual Studio Code.

Per maggiori informazioni sull’evento, potete andare direttamente sul sito di DotNetUmbria sulla pagina dell’evento: http://www.dotnetumbria.org/open-net/

SharePoint Saturday a Firenze il 20 Giugno

Ieri è uscita l’agenda dello SharePoint Saturday che si terrà il 20 giungo a Firenze.
Per chi non conoscesse questo format, si tratta di eventi gratuiti su SharePoint che si svolgono appunto il sabato. Gratuito ma di alto livello!
Anche questa volta ci sono fra i nomi più famosi in questo settore, alcuni dei quali prenderanno e prendono parte anche ad altri SharePoint Saturday sparsi per l’Europa.
L’agenda sarà divisa su 4 track: ITPro, Developer, Business e End-User.
Per registrarvi potete andare direttamente a questo link.

Un evento da non perdere!

Home-Page-SPSFlorence-960x393

I plugin jQuery che non possono mancare nelle vostre applicazioni ASP.NET - Parte 2 -

Un po' di tempo fa avevo riportato una lista di alcuni plugin jQuery che potete (e dovete) usare nelle vostre applicazione ASP.NET.

Visto che è passato un po' di tempo da quel post, vi propongo dei nuovi plugin degni di nota.

  • jQuery Steps: permette di realizzare interfacce basate su wizard. Molte impostazioni di personalizzazione già previste per i casi più diffusi.
  • jQuery Lazy: permette di caricare le immagini delle pagine web solo quando viene visualizzata (o per visualizzare) la porzione di pagina in cui sono presenti delle immagini. Questo ovviamente porta un aumento di performance del caricamento delle pagine.
  • Toastr: libreria per creare in poco tempo dei popup di notifica in diversi formati e posizioni. Semplice da personalizzare e facile da implementare.
  • ScrollMagic: permette di creare pagine con effetti grafici attivabili durante lo scrolling verticale della pagina.
  • FullPage.js: plugin per siti one page che permette di creare in poco tempo effetti grafici molto belli su questa tipologia di siti. Permette anche di inserire scrolling orizzontali.
  • OwlCarousel: plugin che permette di realizzare carousel e slider di immagini completamente responsive e touch. La versione 2 è ancora in beta ma funziona benissimo.
  • Carousel Bootstrap: non un vero e proprio plugin jQuery (anche se lo usa) ma è già compreso in Bootstrap (quindi nei progetti ASP.NET) e permette di creare dei semplici carousel responsive. Potete trovare un esempio qua: http://getbootstrap.com/examples/carousel/
  • Menu-Aim: plugin per la realizzazione di menu molto simili a quello delle categorie di Amazon. Al passaggio del mouse su una voce, viene aperto un altro pannello dove può essere inserito un altro sotto menu e altri controlli HTML. Una demo qua: https://rawgit.com/kamens/jQuery-menu-aim/master/example/example.html
  • typeahead.js: libreria scritta direttamente dal team di Twitter (e anche usata) per creare caselle di testo con autocompletamento in cui è possibile anche andare a ridefinire il layout dei risultati.
  • gridster.js: interessante libreria per creare layout fluidi ma con la possibilità di utilizzare il drag&drop per ridefinire il posizionamento dei pannelli. Unito a jQuery e a un backend con delle API Rest è una buona base per creare un semplice (o anche no) CMS.
  • Chartist.js: questo plugin serve per creare grafici molto accattivanti. A differenza degli altri plugin che fanno la stessa cosa (il mio preferito è/era Flot) questo permette di avere layout responsive e sono già presenti progetti paralleli per usarlo con AngularJS, React ed Ember.
  • jQuerySimpleEventCalendar: il nome simple può trarre in inganno perché con questa libreria è possibile creare dei calendari interattivi molto simili a quelli a cui siamo abituati in applicazioni desktop.

Schermata 2015-05-20 alle 08.25.17

PHP for ASP.NET Developers a .NET Campus 2015

Anche quest'anno, per la seconda volta consecutiva, sarò speaker al .NET Campus di Roma.

L'evento si svolgerà il 30 maggio presso l'Università degli Studi di Roma Tre a partire dalle 9 di mattina.

Questa volta parlerò di argomento che può sembrare strano per uno sviluppatore ASP.NET come me e sopratutto a un evento .NET. :)

Cercherò di spiegare le analogie che ci possono essere fra Php e ASP.NET per chi non conosce (o conosce poco) il primo linguaggio.

In particolare andremo a vedere che sfruttando un framework Php, che si chiama CakePHP, la curva e il tempo di apprendimento sarà molto più veloce.

Dopo una breve introduzione su come configurare una macchina per far "girare" Php e alcuni servizi per lo svilluppo, andremo a realizzare una demo di un'applicazione completa.

Ci vediamo a Roma!!!


Aumentare le dimensioni delle Glyphicons in Bootstrap

Nelle ultime versioni di Boostrap sono state incluse in modo gratuito (la cosa ottimale sarebbe inserire un link a fondo pagina per i credits) le Glyphicons.
Fondamentalmente sono circa 250 “icone” che possiamo usare nelle nostre applicazioni. Il loro punto di forza è che non sono immagini vere e proprie, ma un font vettoriale, quindi adatto a qualsiasi risoluzione e grandezza.
Di default la grandezza del font è di 24px.
In alcuni casi però è necessario dover aumentare la loro grandezza. Per farlo ci sono diversi metodi.

Il primo (quello che personalmente mi piace meno) è quello di andare a modificare la classe CSS di default e quindi andare a inserire un valore più grande per il font-size.
In pratica basta aggiungere in un vostro CSS (non modificare quello di default di Boostrap) il seguente codice:

.bs-glyphicons .glyphicon{
    font-size: 90px;
}
Ovviamente al posto di 90px, potete inserire il valore che preferite.

L’effetto “collaterale” di questa modifica è che a questo punto tutte le icone del vostro sito saranno più grandi.

Il metodo che invece preferisco e che personalmente adotto è quello invece di andare a creare N classi CSS che aumentano la dimensione del font, ma senza cambiare il comportamento di default.
Ad esempio possiamo creare le seguenti classi:

.glyphicon-2x{font-size: 2em;}
.glyphicon-3x{font-size: 3em;}
.glyphicon-4x{font-size: 4em;}
.glyphicon-5x{font-size: 5em;}
.glyphicon-6x{font-size: 6em;}

A questo punto basta aggiungere alle vostre glyphicons che volete più grandi una di queste classi e il gioco è fatto.
Ad esempio potete scrivere:

<span class="glyphicon glyphicon-home glyphicon-3x"></span>

Per l’elenco completo delle glyphicons potete andare al seguente link: http://getbootstrap.com/components/#glyphicons oppure sul sito ufficiale http://glyphicons.com/

Azure Community Bootcamp 2015 a Pisa

Il 23 aprile presso il dipartimento di Matematica a Pisa si svolgerà l'Azure Community Bootcamp.

Un evento particolare e primo nel suo genere perché verrà fatto congiuntamente in tutta Italia dalle diverse community sparse nel territorio.

Una mezza giornata insieme per parlare di web e cloud.

Potete trovare il programma completo all'indirizzo: http://www.communitydays.it/events/azure-2015/#l-Pisa

Se volete condividere l'evento sui social, usate l'hashtag: #azureit15


Ci vediamo a Pisa!

Script PowerShell per scaricare tutti i video della DotNetConf2015

Come di consueto ho preparato uno script PowerShell per scaricare tutti i video (in HD) della DotNetConf2015.
Potete trovarlo direttamente su Gist a questo link: https://gist.github.com/kasuken/b2b545c4e904ff53aeb5

mkdir "~\Desktop\DotNetConf15"
cd "~\Desktop\DotNetConf15"
[Environment]::CurrentDirectory=(Get-Location -PSProvider FileSystem).ProviderPath
$a = ([xml](new-object net.webclient).downloadstring("http://s.ch9.ms/Events/dotnetConf/2015/RSS/mp4high"))
$a.rss.channel.item | foreach{  
  	$url = New-Object System.Uri($_.enclosure.url)
	
	$file = "- " + $_.creator + " - " + $_.title.Replace(":", "-").Replace("?", "").Replace("/", "-").Replace("<", "").Replace("|", "").Replace('"',"").Replace("*","")
	$file = $file.substring(0, [System.Math]::Min(120, $file.Length))
	$file = $file.trim()
	
	$OutFile = New-Item -type file "$file.txt" -Force  
	$Content = ""
	$Content = $_.title.trim() + "`r`n" + $_.summary.trim()
	add-content $OutFile $Content
	
	"Downloading: " + $file + ".mp4"
	if (!(test-path $file))
	{
	  $wc = (New-Object System.Net.WebClient)  
	  $wc.DownloadFile($url, $file + ".mp4")
	}
}

Utilizzare ASP.NET 5 su Linux

Per fare questo “esperimento” ho deciso di utilizzare la distribuzione Kubuntu 14 perchè mi è stato detto (e ho letto) che è una delle distribuzioni più semplici e intuitive da utilizzare.

L’installazione effettivamente è molto semplice (io l’ho fatta sul mio Dell XPS 13).

Passiamo subito ai passi necessari per far “girare” ASP.NET 5 (o vNext) su Linux.

Mono

Per prima cosa bisogna installare Mono.
Per farlo ho seguito la guida che c’è sul sito ufficiale e ho lanciato i seguenti comandi da una finestra “terminal”.

sudo apt-key adv --keyserver keyserver.ubuntu.com --recv-keys 3FA7E0328081BFF6A14DA29AA6A19B38D3D831EF

Dopo questo comando è necessario eseguire questo:

echo "deb http://download.mono-project.com/repo/debian wheezy main" | sudo tee /etc/apt/sources.list.d/mono-xamarin.list

A questo punto, sempre nella stessa finestra del terminale eseguire un aggiornamento dei pacchetti:

sudo apt-get update

Infine lanciare l’ultimo comando:

sudo apt-get install mono-complete

Gyp e Libuv

Un passo poco documentato ma che risolve errori in fase di compilazione, è l’installazione di queste due librerie fondamentali.
Prima di tutto bisogna installare Gyp:

sudo apt-get gyp

Fatto questo dobbiamo lanciare una alla volta le seguenti comandi:

wget http://dist.libuv.org/dist/v1.0.0-rc2/libuv-v1.0.0-rc2.tar.gz
tar -xvf libuv-v1.0.0-rc2.tar.gz
cd libuv-v1.0.0-rc2/
./gyp_uv.py -f make -Duv_library=shared_library
make -C out
sudo cp out/Debug/lib.target/libuv.so /usr/lib/libuv.so.1.0.0-rc2
sudo ln -s libuv.so.1.0.0-rc2 /usr/lib/libuv.so.1

A questo punto eseguendo il comando “mono –version” dovrebbe apparirvi una schermata tipo questa:

snapshot3 

E’ importante che la versione di mono sia superiore o uguale alle 3.10.
In caso contrario prima di reinstallare mono è necessario lanciare il seguente comando:

sudo apt-get remove mono-complete

KVM

Prima di iniziare  a lavorare in modo vero e proprio con ASP.NET su Linux, bisogna installare il gestore del runtime di ASP.NET 5.

curl -sSL https://raw.githubusercontent.com/aspnet/Home/master/kvminstall.sh | sh && source ~/.kre/kvm/kvm.sh

Dopo lanciare l’aggiornamento di KVM:

kvm upgrade

Yeoman

L’ultimo pacchetto che manca da installare è effettivamente una cosa legata ad ASP.NET 5. Yeoman è un tool per generare un “template” di un’applicazione ASP.NET 5 attraverso un wizard molto semplice.
Per installarlo è sufficiente eseguire il comando:

npm install -g generator -aspnet

Adesso siamo pronti a creare la nostra prima applicazione ASP.NET 5.
Per farlo basta eseguire il comando:

yo aspnet

Partirà un wizard che vi chiederà il nome del progetto ASP.NET che volete creare e il tipo di applicazione.
Selezionate “ASP.NET MVC” e vedrete che vi genererà un pò di file che vi saranno abbastanza familiari.
Adesso con il comando “cd” (come nel dos) spostatevi nella cartella che avete appena creato e lanciate il comando:

kpm restore

vedrete nella shell che scorreranno tutti i pacchetti presi da nuget necessari per la vostra applicazione.
Subito dopo lanciate il comando :

kpm build

e dovreste vedere che l’applicazione è stata compilata con successo.
A questo punto non ci rimane che lanciare l’applicazione web con il comando:

k kestrel

e aprire il browser che avete installato (io uso Chromium) e navigare all’indirizzo http://localhost:5004.
Dovrebbe apparirvi una schermata come quella sotto :)

snapshot2

Nel prossimo articolo vedremo come modificare l’applicazione appena creata da un editor, sfruttando l’intellisense di C#.

Corso introduttivo per lo sviluppo di App per Office 365

Da ieri su Microsoft Virtual Academy è presente un corso introduttivo sullo sviluppo di App per Office 365.
E’ molto utile per chi si avvicina per la prima volta al (vasto) mondo di Office 365 e vuole scoprire come interagire dalle proprie applicazioni con i servizi offerti da questo servizio cloud di Microsoft.
Servizio che include Exchange, Lync, SharePoint e tante altre cose.

Lo potete trovare al link: http://www.microsoftvirtualacademy.com/training-courses/introduzione-allo-sviluppo-di-app-office365

Nelle prossime settimane comunque ci saranno delle sorprese con nuovi contenuti e sopratutto TANTO CODICE!!!

Stay tuned!

Office365

Script PowerShell per scaricare tutte le puntate di Azure Friday

Qualche tempo fa avevo postato uno script PowerShell per scaricare tutti i video di Build 2014.
In questi giorni ho creato uno script per scaricare tutte le puntate di Azure Friday di Channel 9.
Ovviamente lo script va in aggiornamento, quindi se avete già scaricato una puntata, salta e prova con la successiva.
Ho anche inserito un contatore per le puntate in modo da poterle ordinare e ritrovarle più facilmente.

Qua vi inserisco lo script, ma lo potete anche trovare su GitHub a questo link: https://github.com/kasuken/downloadazurefridayvideos

[Environment]::CurrentDirectory=(Get-Location -PSProvider FileSystem).ProviderPath 
$rss = (new-object net.webclient)

#Preferably enter something not too long to not have filename problems! cut and paste them afterwards
$downloadpath = "C:\AzureFriday"

if (-not (Test-Path $downloadpath)) { 
    Write-Host "Folder $downloadpath doesn't exist. Creating it..."  
    New-Item $downloadpath -type directory 
}

set-location $downloadpath

$rssUrl = "http://channel9.msdn.com/Shows/Azure-Friday/feed/mp4high"
$channel = ([xml]$rss.downloadstring($rssUrl))

$counter = $channel.rss.channel.totalResults

for($i=1; $i -le $channel.rss.channel.pageCount; $i++) {

    $video = ([xml]$rss.downloadstring($rssUrl + "?page=$i")) 

    #download videos
    $video.rss.channel.item | foreach{
   
            # Grab the URL for the MP4 file
            $url = New-Object System.Uri($_.enclosure.url)  
            
            # Create the local file name for the MP4 download
            $file = ""
            $file = [string]$counter + " - " + $_.creator + " - " + $_.title.Replace(":", "-").Replace("?", "").Replace("/", "-").Replace("<", "").Replace("|", "").Replace('"',"").Replace("*","")
            $file = $file.substring(0, [System.Math]::Min(120, $file.Length))
            $file = $file.trim()
            $file = $file + ".mp4"  
                        
            # Make sure the MP4 file doesn't already exist
            if (!(test-path "$file"))     
            {     
                # Echo out the  file that's being downloaded
                $file
                $wc = (New-Object System.Net.WebClient)  

                # Download the MP4 file
                $wc.DownloadFile($url, "$downloadpath\$file")
            }
            else
            {
                Write-Host "You have already the $file video. The download is skipped."
            }

            $counter = $counter - 1
        }
}

Estensioni Chrome per sviluppatori web


Google Chrome dispone di molte estensioni che vanno ad arricchire di funzionalità il browser di Mountan View.
Ce ne sono di diverse categorie più o meno interessanti, ma in questo articolo farò una selezione delle migliori estensioni per gli sviluppatori web e web designer.

Web Developer

E’ il porting della toolbar di Firefox che aggiunge diverse funzionalità di debugging. Ad esempio è possibile disabilitare i cookies, il javascript e fare alcune operazioni massime sui forms.

Clear Cache

Tool molto utile per rimuovere velocemente la cache del browser. E’ possibile selezionare ogni elemento temporaneo che si vuole eliminare.

JSONView

Molto utile quando si lavora con delle REST API. Formatta direttamente nel browser un file JSON con la possibilità di navigarlo con un controllo di tipo treeview.

Dimensions

Una delle mie estensioni preferite. Con questo pulsante che si va ad aggiungere nella toolbar è possibile conoscere immediatamente la dimensione di un elemento HTML passandoci sopra con il mouse.

Web Developer Checklist

Aggiunge un pulsante sulla toolbar che se cliccato fa vedere una checklist con alcune attiivtà che il web developer non si deve dimenticare di fare (ottimizzazione SEO, Favicon, ecc.)

Postman – REST Client

Questa è un’app di Chrome vera e propria che viene eseguita in una finestra esterna al browser. Con questa app è possibile, come dice il nome, eseguire chiamate REST a dei web services locali o remoti. Molto semplice e intuitiva da usare.

Resolution Test

Un’estensione per testare il vostro sito o la vostra applicazione web a diverse risoluzioni con un semplice click. Si possono seleziona anche più risoluzioni insieme.

Page Speed Insights

Estensione realizzata direttamente da Google. Vengono fornite delle statistiche sulle perfomance del sito, ma sopratutto i suggerimenti per migliorare le prestazioni (nel caso ce ne sia bisogno). Molto utile per capire alcuni scripts javascript che possono rallentare il caricamento delle pagine.

Edit This Cookie

Ovviamente un’icona di un biscotto nella vostra toolbar che apre un popup con tutte le chiavi dei cookie che ha scritto il sito che state visitando. Un editor intuitivo ma completo vi permette di cambiarne i valori. E’ molto comodo per fare dei test nelle proprie applicazioni.

Stack Alert

Aggiunge un’icona nella toolbar che visualizza il numero di messaggi da leggere del vostro account di Stackoverflow.

XML Tree

Molto simile a JSON View, rende più user-friendly la visualizzazione di dati XML nel browser.

Bootstrap Twitter Offline Docs

Come dice il nome dell’estensione stessa è la documentazione di Bootstrap disponibile offline in qualsiasi momento.

Video del webcast: Analizzare le performance di un'applicazione ASP.NET con Glimpse

Pochi giorni si fa ho tenuto un webcast su Glimpse con la community di cui faccio parte: DotNetToscana.

Come sempre è disponibile il video della registrazione: https://www.youtube.com/watch?v=2rxjIvOez-4

Su Slideshare sono disponibili anche le slides: http://www.slideshare.net/emanuelebartolesi/analizzare-le-performance-di-unapplicazione-aspnet-con-glimpse

Disabilitare i pulsanti di submit in ASP.NET MVC

Durante l’invio di un form in un’applicazione ASP.NET MVC a volte è necessario disabilitare i pulsanti inclusi nel form stesso perchè i tempi di attesa possono essere lunghi per problemi di connettività o operazioni di salvataggio complesse.
Un metodo semplice per realizzare questo behavior su tutti i form dell’applicazione, è aggiungere questo piccolo script jQuery nelle vostre pagine (o nel file _layouts.cshtml). 

$('form').first().one('submit', function () {
    if ($('form').first().valid()) {
        $(this).find('input[type="submit"]').attr('disabled', 'disabled');
    }
});

Nelle ultime versione di jQuery è stata aggiunta la parola chiave one() che è praticamente uguale a on(), con l'unica differenza che l'evento specificato viene invocato solo una volta e poi non viene più richiamato.

Script per applicare un JS Link a tutte le document library di tutti i siti di una site collection

Come ha scritto nell’ultimo post del suo blog Giuseppe Marchi, JS Link è molto potente ma per applicarlo a tutte le document library può essere frustrante perchè bisogna farlo a mano.
Proprio in questi giorni ho dovuto realizzare una procedura per automatizzare questa operazione.
Lo script che vi allego qua sotto e che ho postato su Gist, fa proprio questo: applica un JS Link a tutte le document library di tutti i siti di una site collection.

#Load powershell snapin
Add-PSSnapin "Microsoft.SharePoint.PowerShell"
#Get site collection details
$site = Get-SPSite http://mysite
#Get all web sites in the site collections
$websites = $s.AllWebs
foreach($website in $websites)
{
    Write-Host $website.Title -foreground Yellow

    #loopthrouh the lists and libraries in the site
    foreach($l in $website.Lists)
      {
        #Check for only document libraries
        if($l.BaseTemplate -eq "DocumentLibrary" -and $l.Title -ne "Site Assets")
        {
            Write-Host "Processing " + $l.RootFolder.Name + " ..." -foreground Green
            $webPartPage = $l.RootFolder.Name + "/Forms/AllItems.aspx"
            Write-Host $webPartPage + " OK" -foreground Gray
            $file = $website.GetFile($webPartPage)
            #$file.CheckOut()
 
            $webPartManager = $website.GetLimitedWebPartManager($webPartPage, [System.Web.UI.WebControls.WebParts.PersonalizationScope]::Shared)
 
            $webpart = $webPartManager.WebParts[0]
 
            $webpart.JSLink = "~SiteCollection/_catalogs/masterpage/linkfile.js"
 
            $webPartManager.SaveChanges($webpart)
 
            #$file.CheckIn("Awesomeness has been delivered")
        }
    }
}

Potete trovare lo script anche a questo link: https://gist.github.com/kasuken/0898d25e6185df80f359

Buon JS Link! :)

Dimensioni corrette delle immagini con WURFL

Nell’articolo precedente abbiamo visto come sfruttare WURFL per riconoscere il device da cui stiamo navigando un sito o un’applicazione web.

In questo articolo invece andremo a vedere come con questa libreria, possiamo andare a visualizzare le immagini nel formato corretto a partire da un’immagine più grande e di diversa risoluzione.
Per fare un esempio pratico spesso accade di avere delle immagini di grandi dimensioni che però debbano essere inserite in siti o applicazioni che devono “girare” anche a risoluzioni di schermi più basse.
In questo caso per ottimizzare la visualizzazione delle immagini ed evitare di scaricare immagini troppo grandi per quello che ci servono, possiamo utilizzare la funzionalità denominata Image Tailor di WURFL.

Per usarla è molto semplice perchè al posto dei link all’interno dei tag img, è sufficiente sostituirli con un link del tipo http://wit.wurfl.io/[link immagine].

A questo punto la libreria si scarica l’immagine sul server di WURFL, la ridimensiona in base alle impostazioni che gli diamo e la rimanda indietro.
Se qualcosa dovesse andare storto durante l’elaborazione, viene semplicemente eseguito un redirect al link fornito.

Per controllare i vantaggi di questa funzionalità e il risparmio di banda e tempi di caricamento della pagina, è possibile utilizzare una qualsiasi barra developer de browser che preferite.

Alcuni esempi:

http://wit.wurfl.io/http://p1.pichost.me/i/41/1646503.jpg

In questo caso WURFL si accorge dal device dove stiamo navigando e ridimensiona in automatico l’immagine (uno sfondo da 1.2 Mbyte)

http://wit.wurfl.io/pc_30/http://p1.pichost.me/i/41/1646503.jpg

In questo caso viene eseguito un resize del 30% rispetto alla grandezza dello schermo

http://wit.wurfl.io/w_300/http://p1.pichost.me/i/41/1646503.jpg

In questo caso viene impostata una larghezza di 300px e l’altezza viene ricalcolata per mantenere le proporzioni.

Ovviamente queste impostazioni possono anche essere usate più di una alla volta. Potete comunque trovare tutti gli esempi sul sito ufficiale di WURFL.

Aumentare la dimensioni degli allegati in una Provider Hosted App per SharePoint 2013

Spesso, quando realizziamo una provider hosted app, c’è la necessità di eseguire upload di file in una document library del sito host.
Per fare questo di solito viene usato il client object model, con le seguenti istruzioni:

var spContext = SharePointContextProvider.Current.GetSharePointContext(HttpContext.Current);

using (var clientContext = spContext.CreateUserClientContextForSPHost())
{
    var documentsList = clientContext.Web.Lists.GetByTitle("List Name");

    var fileCreationInformation = new FileCreationInformation();

    fileCreationInformation.Content = documentStream;

    fileCreationInformation.Url = "My document.docx";
    Microsoft.SharePoint.Client.File uploadFile = documentsList.RootFolder.Files.Add(fileCreationInformation);

    clientContext.ExecuteQuery();
}

Il codice è molto semplice, ma purtroppo di default l’upload è limitato a 2 Mb.
E’ possibile cambiare questo valore lanciando sul server dove risiedono i servizi di SharePoint 2013 le seguenti istruzioni PowerShell.
Ovviamente è possibile variare la grandezza massima, inserendo il valore che ritenete più opportuno, espresso in byte.

$ws = [Microsoft.SharePoint.Administration.SPWebService]::ContentService
$ws.ClientRequestServiceSettings.MaxReceivedMessageSize = 15242880
$ws.ClientRequestServiceSettings.MaxParseMessageSize  = 15242880
$ws.Update()

L’ultimo accorgimento è quello di aumentare anche il valore della grandezza massima della richiesta Http di ASP.NET in modo da essere in linea con quella impostata per SharePoint 2013.
Per fare questo, basta aggiungere le seguenti righe nel web.config della vostra applicazione.

<configuration>
    <system.web>
        <httpRuntime maxRequestLength="15242880" />
    </system.web>
</configuration>

Webcast: Analizzare le performance di un'applicazione ASP.NET con Glimpse

Lunedì 26 gennaio alle ore 17 farò un webcast su Glimpse o meglio su come analizzare (e quindi migliorare) le performance dei siti o delle applicazioni ASP.NET.

Durante il webcast andremo a vedere come funziona questo strumento che, durante la normale navigazione dentro la vostra applicazione, vi mostra eventuali funzioni lente o ridondanti che vengono richiamate.
Vi permette anche di analizzare le eventuali chiamate al database, visualizzando le query che vengono eseguite ed i vari parametri.

Non voglio svelarvi altro e spero di vedervi online durante il webcast. :)

Potete trovare informazioni aggiuntive e il form di registrazione direttamente sul sito della nostra community a questo link: Webcast: Analizzare le performance di un'applicazione ASP.NET con Glimpse.

glimpse

Materiale evento: Real Solutions Days

Nei giorni scorsi si è svolto il primo evento DotNetToscana con la formula Real Solutions Days.
Questo tipo di eventi è diverso dagli altri perchè cerchiamo di analizzare e affrontare tutte le problematiche che possono sorgere durante lo sviluppo di un progetto reale.

Lo sforzo per realizzare questo tipo di eventi è molto diverso rispetto al solito ma ci ha dato tanta soddisfazione.
Sul nostro sito potete trovare tutto il materiale che abbiamo utilizzato nella giornata (esempi e slides).

Ci vediamo al prossimo evento e parola d’ordine: “mai più ToDoList!”

wp_20141215_004

Niente più Public Website su Office 365

Una notizia recentissima conferma che da Gennaio 2015 non saranno più disponibili i siti pubblici di Office 365.
Chi ha già una sottoscrizione con questa feature attiva la avrà disponibile per altri due anni, poi verrà dismessa.
Sempre da Gennaio, Microsoft rilascerà una serie di soluzioni di terze parti per realizzare siti pubblici di terze parti. In questa occasione saranno anche rilasciate delle eventuali tariffe aggiuntive per usufruire di questi servizi.

A questo proposito stavo realizzando anche io una soluzione alternativa ai public website di Office 365 e a questo punto il mercato si allargherà ancora di più.
Potete trovare informazioni sul progetto sul sito www.spire365.website.

Il comunicato ufficiale di Microsoft, potete trovarlo qua: http://support2.microsoft.com/kb/3027254/en-us

offline-hero

Device detection con WURFL e ASP.NET MVC

In alcuni progetti è necessario conoscere il tipo di device (e di conseguenza il browser) da cui stiamo fruendo la nostra applicazione per capire se possiamo attivare o meno delle funzionalità, sia a livello di implementazioni grafiche che a livello di implementazioni di funzionalità.

Per fare questo l’unico modo è fare quello che viene chiamato device detection. Le strade per farlo non sono molte. Una di queste è analizzare lo user agent del browser ma diventa impegnativo a livello di sviluppo e sicuramente non preciso perchè ci possono essere sempre nuovi device o nuovi user agent, con la conseguenza di essere costretti sempre a “rimettere mano” a codice già esistente.

Una soluzione che invece è più stabile e sicuramente ci aiuta a scaricarci da questa responsabilità è WURFL.io.

WURLF è una libreria per fare device detection che può funzionare sia lato server che lato client.
La versione “dll” è a pagamento, mentre la versione “javascript” è gratuita.
Andiamo a vedere come implementare questa funzionalità in un sito ASP.NET MVC.

Per prima cosa dobbiamo aggiungere la reference alla libreria WURFL.js nella pagina in cui vogliamo eseguire device detection.
Per comodità la possiamo inserire dentro il tag <head> di _layout.cshtml.

<script type='text/javascript' src="//wurfl.io/wurfl.js?debug=true"></script>

Il parametro “debug=true” è utile mentre state lavorando sulla vostra applicazione, ma quando la pubblicate è buona norma toglierlo, in quanto di default è impostata a false.
A questo punto, nelle nostre viste razor (e più precisamente nel codice javascript) ci troviamo un oggetto WURFL che contiene alcune informazioni relative al device e al browser.
L’oggetto contiene le seguenti informazioni:

 {"is_mobile":false,"complete_device_name":"generic web browser","form_factor":"Desktop"}

Ovviamente è possibile utilizzare queste informazioni nel migliore dei modi. Non c’è una best practice perchè dipende sempre dalle esigenze del software che stiamo realizzando.
Nell’esempio che trovate in allegato visualizzo esclusivamente le informazioni nella View Razor denominata Home.cshtml, ma è possibile per esempio andare a caricare, a seconda del device o del browser, una partial view o redirigere su un’altro link.

A questo punto se lanciate Internet Explorer e aprite la developer toolbar (F12), nella sezione Emulation (Ctrl + F8), se cambiate i valori di Browser Profile o User Agent, la pagina viene ricaricata e vedrete cambiare di conseguenza i valori che la libreria WURFL ritorna.

Potete trovare l’esempio in allegato.

DeviceDetectionASPNET.zip (496KB)

L’importanza di avere il Reset.css

Chi ha iniziato da poco a lavorare con i CSS non conosce l’importanza di avere il file “reset.css”.
Quando bisogna realizzare applicazioni o siti web che devono funzionare su qualsiasi (diciamo quasi tutti) browser e proviamo a visualizzare le pagine in essi ci accorgeremo sicuramente di alcune differenze di spaziature, di font e di grandezze “sballate”.
E’ qui che viene comodo e ci risparmia diversi mal di testa un file CSS che resetta queste impostazioni.
Molti framework CSS, come Bootstrap o Foundation, hanno già incluse queste impostazioni. Nel caso invece si sia deciso di crearsi un CSS da zero, dobbiamo crearcelo.

Di default tutti i browser aggiungono dei margini o del padding a molti elementi. Per esempio Firefox e Internet Explorer aggiungono un margine di 6px al body.
Per ovviare a questo problema, basta azzerare i margini, il padding e il border a questi elementi.

body, html, div, blockquote, img, label, p, h1, h2, h3, h4, h5, h6, pre, ul,
ol, li, dl, dt, dd, form, a, fieldset, input, table, th, td
{
    margin: 0; padding: 0; outline: none; border: 0;
}

Un altro problema che possiamo riscontrare, è che i font di alcuni elementi (come h1,h2, ecc) possono risultare di dimensioni diverse. Anche in questo caso, la soluzione è riportare la grandezza a un default.

h1, h2, h3, h4, h5, h6
{
    font-size: 100%;
}

Anche per quanto riguarda le liste puntate, il comportamento dei vari browser cambia di volta in volta.
Meglio azzerarlo, per poi andarlo a ridefinire nel css customizzato per il sito in questione.

ul, ol
{
    list-style: none;
}

Anche il controllo img subisce un altro problema. In alcuni browser è presente un bordo di default. Meglio azzerare anche questo.

img
{
    border: 0;
}

A questo punto il nostro file “reset.css” è pronto per essere inserito nel nostro sito ed avere una copertura minima dei valori più importanti che cambiano nei vari browser.
Qui il file completo di quello che abbiamo appena creato:

body, html, div, blockquote, img, label, p, h1, h2, h3, h4, h5, h6, pre, ul,
ol, li, dl, dt, dd, form, a, fieldset, input, table, th, td
{
    margin: 0; padding: 0; outline: none; border: 0;
}

h1, h2, h3, h4, h5, h6
{
    font-size: 100%;
}

ul, ol
{
    list-style: none;
}

img
{
    border: 0;
}
Se vogliamo comunque essere sicuri di avere una copertura massima di tutti i tag, è possibile utilizzare uno dei file di reset presenti sul sito http://www.cssreset.com/.
Io personalmente consiglio YUI 3 di Yahoo! perchè lo trovo il più completo di tutti.

dotNETpodcast e NTTSight Academy

La settimana scorsa è stata piena di impegni, dal rientro da Seattle a due eventi importanti.
Il primo appuntamento è stato l’uscita del mio podcast su dotnetpodcast relativa a Office 365. Una breve introduzione su questo mondo di cui si sente tanto parlare ultimamente e se ne sentirà parlare ancora per un bel pò.
Potete trovare il link alla mia puntata a questo link: http://www.dotnetpodcast.com/show/card/8. Dalla stessa pagina è anche possibile scaricare la puntata in formato mp3.

Il secondo appuntamento della settimana è stato il 12 novembre con il secondo workshop marchiato NTTSight Academy.
Anche in questo caso ho parlato di sviluppo di applicazioni per Office, Office 365, SharePoint e le API di Office 365.
C’è stato molto interesse da parte del pubblico, sia durante la sessione, che dopo durante l’aperitivo.
Potete trovare il video della sessione a questo link: NTTSight Academy - App for Office 365 and SharePoint 2013.
Le slide invece le ho pubblicate come sempre su SlideShare al seguente link: http://www.slideshare.net/emanuelebartolesi/nttsight-academy-app-for-office-365-and-sharepoint-2013

Ci vediamo l’11 Dicembre per il terzo appuntamento di NTTSight Academy in cui parleremo di Social Media Listening.

Abilitare il SideLoading in un sito SharePoint/Office 365

Se provate a fare un deploy di un’app provider hosted o SharePoint hosted in un sito di SharePoint online di tipo diverso da Developer Site, riceverete l’errore: “Error occurred in deployment step 'Install app for SharePoint': Sideloading of apps is not enabled on this site”.

Per ovviare a questo errore è sufficiente abilitare il sideloading sul vostro sito.
Per farlo sono necessari tre semplici step.

  1. Scaricate e installate la console powershell per SharePoint Online (se già non la avete installata): http://www.microsoft.com/en-us/download/details.aspx?id=35588
  2. Avviate la console come amministratore
  3. Eseguite lo script seguente:
$programFiles = [environment]::getfolderpath("programfiles")
add-type -Path $programFiles'\SharePoint Online Management Shell\Microsoft.Online.SharePoint.PowerShell\Microsoft.SharePoint.Client.dll'
Write-Host 'Insert information for Site'
$siteurl = Read-Host "Site Url"
$username = Read-Host "User Name"
$password = Read-Host -AsSecureString "Password"
 
try
{
    [Microsoft.SharePoint.Client.ClientContext]$ClientContext = New-Object Microsoft.SharePoint.Client.ClientContext($siteurl)
    $ClientContext.Credentials = New-Object Microsoft.SharePoint.Client.SharePointOnlineCredentials($username, $password)
    $site = $ClientContext.Site;

    $sideLoadingGuid = new-object System.Guid "AE3A1339-61F5-4f8f-81A7-ABD2DA956A7D"
    $site.Features.Add($sideLoadingGuid, $true, [Microsoft.SharePoint.Client.FeatureDefinitionScope]::None);
     
    $ClientContext.ExecuteQuery();
     
    Write-Host -ForegroundColor Green 'SideLoading feature enabled :)'
}
catch
{ 
    Write-Host -ForegroundColor Red 'Error ' $siteurl, ':' $Error[0].ToString();
}

Potete trovare lo script anche su gist a questo link, oppure scaricarlo da qui.

SharePoint 2013 App Model Succintly

Da qualche giorno è uscito un nuovo libro della serie Succintly molto interessante e totalmente gratuito.
Il libro in questione è stato scritto da Fabio Franzini, MVP su SharePoint.
Potete scaricarlo attraverso questo link: http://www.syncfusion.com/resources/techportal/ebooks/sharepoint

E’ un libro molto utile perchè vuole iniziare a sviluppare applicazioni per SharePoint 2013 o Office 365 ed ha almeno un pò di nozioni di HTML5 e Javascript o .NET.

Di seguito il sommario:

  • Introducing the SharePoint 2013 Development Models
  • Preparing the Development Environment
  • The App Model Architecture Overview
  • SharePoint-Hosted Apps
  • Provider-Hosted Apps
  • Security Model Overview
  • Client-Side Object Model (CSOM)
  • REST/OData Service
  • Cross-Domain and Remote Service Calls
  • Creating User Experience (UX) for Apps
  • App Deployment

Buona programmazione. :)

sharepointsuccintly

Risolvere l’errore “violates the constraint of type parameter 'T'”

Sto realizzando molte App per Office 365 in questo ultimo periodo.
Per eseguire il provisioning dei dati utilizzo il Client Object Model.
Con gli ultimi aggiornamenti di SDK e Visual Studio è possibile ottenere l’errore: Method Microsoft.SharePoint.Client.ClientRuntimeContext.Load: type argument 'Microsoft.Online.SharePoint.XXXX' violates the constraint of type parameter 'T' quando si cerca di caricare qualche risorsa.
Questo è dovuto al fatto che, se state usando SharePoint online, dovete referenziare la versione 16.0 della DLL Microsoft.SharePoint.Client.dll e non la 15.

Per sapere se avete installato la versione 16 potete navigare sul vostro PC nel path: C:\Program Files\SharePoint Client Components e controllare che esista la cartella “16.0\Assemblies\”.