Ambiente di sviluppo per SharePoint Framework

Completato

Questa unità spiegherà gli elementi da installare nell'ambiente di sviluppo per iniziare a creare componenti di SharePoint Framework.

Strumenti open source

Microsoft ha adottato gli strumenti open source per lo sviluppo di base di SharePoint Framework. Tre categorie da esplorare per gli strumenti open source e le librerie correlate alla SharePoint Framework sono le seguenti:

• processo e strumenti di compilazione
• framework Web
• editor di codice

Processo e strumenti di compilazione

Esaminiamo prima il processo e gli strumenti di compilazione. Yeoman sostituisce la tradizionale esperienza di progetto che gli sviluppatori di SharePoint sul lato server conoscono già in Visual Studio.

Gulp è uno strumento di esecuzione attività che sostituisce lo strumento MSBuild usato nelle soluzioni .NET. Viene usato per eseguire varie attività, come la transpilazione di TypeScript in JavaScript e la creazione di bundle JavaScript e pacchetti di SharePoint.

Node.js è il runtime sottostante usato da tutte le applicazioni. Gli strumenti di questa sezione sono tutti basati su Node.js. Node.js è necessario per eseguirli, così come .NET Framework è necessario per eseguire le app .NET.

npm viene usato come gestione pacchetti e verrà usato per installare strumenti globali e codice riutilizzabile nei progetti.

Webpack permette di combinare tutti i file JavaScript e CSS nel progetto in un unico bundle JavaScript. I bundle sono il modo consigliato per distribuire le applicazioni lato client per motivi di prestazioni.

Si tratta di strumenti open source non creati e forniti da Microsoft, ma gestiti dalla community. Uno dei vantaggi del loro uso è che sono multipiattaforma, quindi è possibile usare gli stessi strumenti indipendentemente dal fatto che l'ambiente di sviluppo sia Windows, macOS o Linux.

Framework Web

Quando creano applicazioni lato client, gli sviluppatori in genere usano i framework Web. SharePoint Framework non limita lo sviluppatore ad alcun framework specifico. È possibile usare uno qualsiasi dei framework Web più diffusi nei progetti, tra cui React, Angular, Knockout o Vue.js. È anche possibile usare la popolare raccolta jQuery nelle app personalizzate.

Editor del codice

Per sviluppare il progetto è anche consigliabile procurarsi un editor del codice. La maggior parte degli sviluppatori usa Visual Studio Code di Microsoft. Si tratta di una versione semplificata di Visual Studio, un editor di testo che riconosce TypeScript e può essere personalizzato con le estensioni.

Lo sviluppatore non deve tuttavia limitarsi a Visual Studio Code, ma, volendo, può scegliere un editor diverso. A tale scopo, è utile anche un editor semplice come Blocco note, Atom, Brain o WebStorm. Qualunque soluzione si scelga, tutte le attività di sviluppo vengono eseguite usando un editor di testo.

Confronto tra strumenti lato server

La toolchain di sviluppo di SharePoint Framework rappresenta un cambiamento significativo rispetto alla tradizionale esperienza di sviluppo di SharePoint sul lato server. Ora si confronteranno le due toolchain di sviluppo per analizzare eventuali somiglianze e differenze:

Nell'immagine precedente, la riga superiore è il confronto tra gli strumenti sul lato server, a partire dal server Web Microsoft IIS. Ciò include .NET Framework, NuGet usato per la gestione dei pacchetti, MSBuild usato per l'esecuzione di attività di compilazione e creazione di pacchetti, C# come linguaggio di sviluppo e Visual Studio per l'esperienza di sviluppo.

La riga inferiore rappresenta gli strumenti di SharePoint Framework. Si notino le linee disegnate tra gli strumenti in modo da poter confrontare le due.

Esplorazione degli strumenti di sviluppo e compilazione di base di SharePoint Framework

Esaminiamo ognuno degli strumenti usati nella toolchain di sviluppo e compilazione di SharePoint Framework.

Node.js

Node.js è un runtime JavaScript per l'esecuzione di JavaScript nei dispositivi all'esterno del browser. È un wrapper per il motore JavaScript V8 del progetto di browser open source Chromium con alcune API aggiuntive che consentono l'esecuzione del motore V8 all'esterno del browser. Ciò consente l'esecuzione di JavaScript su desktop, portatili, server e altri dispositivi.

Nota

Chromium è il progetto su cui si basano Google Chrome e Microsoft Edge.

Nel contesto di SharePoint Framework, Node.js è necessario in quanto si tratta del runtime per gli strumenti di sviluppo e compilazione trattati in precedenza. In SharePoint Framework non è necessario diventare uno sviluppatore Node.js, ma è necessario installarlo per eseguire le app nella toolchain di sviluppo e compilazione.

Rispetto alla toolchain sul lato server, Node.js svolge lo stesso ruolo di .NET Framework.

npm: Gestione pacchetti nodo

npm è un gestore di pacchetti per progetti basati su Node.js ed è incluso nell'installazione Node.js. È uno dei molti gestori di pacchetti che possono scaricare e installare pacchetti dal registro npmjs.org .

Rispetto alla toolchain sul lato server, npm svolge lo stesso ruolo di NuGet.

Yeoman

Quando creano componenti di SharePoint sul lato server usando il modello di componente aggiuntivo o come funzionalità o soluzioni, gli sviluppatori usano Visual Studio per creare e sviluppare il progetto. Il primo passaggio in questi modelli consiste nel creare un progetto con la procedura guidata Nuovo progetto. Questa procedura guidata raccoglie informazioni sul progetto e quindi esegue lo scaffolding del progetto creando cartelle, file e personalizzando i file in base alle risposte alle domande.

Visual Studio Code non prevede la procedura guidata Nuovo progetto. Yeoman semplifica la creazione dei progetti.

Yeoman è un motore di scaffolding che esegue generatori. Un generatore definisce il set di domande ed è in grado di eseguire lo scaffolding di un nuovo progetto o modificare quelli esistenti.

Microsoft fornisce un generatore per eseguire lo scaffolding di progetti di SharePoint Framework, sia nuovi che esistenti, a cui aggiungere componenti.

Gulp

Gulp è lo strumento di esecuzione attività usato nel processo di sviluppo e compilazione. Gulp esegue le attività scritte in JavaScript. Gulp permette di eseguire operazioni come la compilazione del progetto e la transpilazione dei file SAAS in CSS e TypeScript in JavaScript. Si useranno altre attività per combinare i file risultanti in bundle e creare un pacchetto dei file risultanti in un file di pacchetto di SharePoint usato per la distribuzione.

Rispetto alla toolchain sul lato server, Gulp svolge lo stesso ruolo di MSBuild.

TypeScript

TypeScript è il linguaggio di scrittura dei progetti di SharePoint Framework. Il suo soprainsieme di JavaScript con funzionalità aggiuntive semplifica la gestione dello sviluppo di JavaScript.

Se non si ha familiarità con JavaScript o con TypeScript, basta immaginarlo come una versione JavaScript di C#. Le funzionalità più usate di TypeScript sono il controllo dei tipi e la possibilità di usare classi. Per il futuro sono previste nuove funzionalità in JavaScript, non ancora implementate né disponibili, se non in anteprima.

Analogamente ai progetti basati su C#, non è possibile distribuire TypeScript in produzione, perché viene usato per creare file intermedi. L'output di TypeScript è JavaScript, così come l'output di C# è il linguaggio intermedio (IL).

Rispetto alla toolchain sul lato server, TypeScript svolge lo stesso ruolo di C#.

Riepilogo

Questa unità ha spiegato gli elementi da installare nell'ambiente di sviluppo per iniziare a creare componenti di SharePoint Framework.