Creare il progetto

di Erik Reitan

Questa serie di esercitazioni illustra le nozioni di base sulla creazione di un'applicazione Web Forms ASP.NET usando ASP.NET 4.5 e Microsoft Visual Studio Express 2013 per Web. Un progetto Visual Studio 2013 con codice sorgente C# è disponibile per accompagnare questa serie di esercitazioni.

In questa esercitazione verrà creato, esaminato ed eseguito il progetto predefinito in Visual Studio, che consentirà di acquisire familiarità con le funzionalità di ASP.NET. Si esaminerà anche l'ambiente di Visual Studio.

Contenuto dell'esercitazione:

  • Come creare un nuovo progetto di Web Forms.
  • Struttura di file del progetto Web Forms.
  • Come eseguire il progetto in Visual Studio.
  • Le diverse funzionalità dell'applicazione Web form predefinita.
  • Alcune nozioni di base su come usare l'ambiente di Visual Studio.

Creazione del progetto

  1. Aprire Visual Studio.

  2. Selezionare Nuovo progetto dal menu File in Visual Studio.

    Creare il progetto - Nuova voce di menu progetto

  3. Selezionare il gruppo Modelli -Visual C# ->>Web a sinistra.

  4. Scegliere il modello Applicazione Web ASP.NET nella colonna centrale.
    Questa serie di esercitazioni usa .NET Framework 4.5.2.

  5. Assegnare un nome al progetto WingtipToys e scegliere il pulsante OK .

    Creare il progetto - Finestra di dialogo Nuovo progetto

    Nota

    Il nome del progetto in questa serie di esercitazioni è WingtipToys. È consigliabile usare questo nome esatto del progetto in modo che il codice fornito in tutta la serie di esercitazioni funzioni come previsto.

  6. Fare clic sul pulsante Modifica autenticazione. Selezionare Account utente individuali e fare clic sul pulsante OK .

  7. Selezionare il modello Web Forms e fare clic sul pulsante OK.

    Screenshot della finestra Nuovo ASP.NET Progetto con il modello di Web Forms e il pulsante OK selezionato.

Il progetto richiederà poco tempo per creare. Quando è pronto, aprire la pagina Default.aspx .

Screenshot della finestra Microsoft Visual Studio Express 2013 per Web che visualizza la pagina Default.aspx.

È possibile passare dalla visualizzazione Progettazione alla visualizzazione Origine selezionando un'opzione nella parte inferiore della finestra centrale. La visualizzazione progettazione visualizza ASP.NET pagine Web, pagine master, pagine contenuto, pagine HTML e controlli utente usando una visualizzazione near-WYSIWYG. La visualizzazione origine visualizza il markup HTML per la pagina Web, che è possibile modificare.

Suggerimento

Informazioni sui framework di ASP.NET

Con Web Form ASP.NET è possibile creare siti Web dinamici utilizzando un modello guidato dagli eventi semplice e intuitivo, basato sul trascinamento della selezione. Questo modello di programmazione offre agli sviluppatori un'area di progettazione e numerosi controlli e componenti per creare rapidamente siti Web basati su interfaccia utente potenti e di grande effetto, con capacità di accesso ai dati. Wingtip Toy Store si basa su Web Forms ASP.NET, ma molti dei concetti appresi in questa serie di esercitazioni sono applicabili a tutti i ASP.NET.

ASP.NET offre quattro framework di sviluppo principali:

  • Web Form ASP.NET
    Il framework Web Forms è destinato agli sviluppatori che preferiscono la programmazione dichiarativa e basata sul controllo, ad esempio Microsoft Windows Forms (WinForms) e WPF/XAML/Silverlight. Offre un modello di sviluppo basato su progettazione WYSIWYG, quindi è popolare con gli sviluppatori che cercano un ambiente di sviluppo rapido di applicazioni (RAD) per lo sviluppo Web. Se non si ha familiarità con la programmazione Web e si ha familiarità con i tradizionali strumenti di sviluppo client Microsoft RAD (ad esempio, per Visual Basic e Visual C#), è possibile creare rapidamente un'applicazione Web senza avere esperienza in HTML e JavaScript.
  • ASP.NET MVC
    ASP.NET MVC è destinato agli sviluppatori interessati a modelli e principi come lo sviluppo basato su test, la separazione dei problemi, l'inversione del controllo (IoC) e l'inserimento delle dipendenze (DI). Questo framework incoraggia la separazione del livello di logica di business di un'applicazione Web dal livello di presentazione.
  • Pagine Web ASP.NET
    Pagine Web ASP.NET gli sviluppatori che vogliono una semplice storia di sviluppo Web, lungo le linee di PHP. Nel modello pagine Web si creano pagine HTML e si aggiunge codice basato sul server alla pagina per controllare dinamicamente il rendering del markup. Le pagine Web sono progettate in modo specifico per essere un framework leggero ed è il punto di ingresso più semplice in ASP.NET per le persone che conoscono HTML, ma potrebbero non avere un'ampia esperienza di programmazione, ad esempio studenti o hobbysti. È anche un buon modo per gli sviluppatori Web che conoscono PHP o framework simili per iniziare a usare ASP.NET.
  • ASP.NET'applicazione a pagina singola
    ASP.NET applicazione a pagina singola (SPA) consente di creare applicazioni che includono interazioni significative sul lato client usando HTML 5, CSS 3 e JavaScript. L'aggiornamento ASP.NET and Web Tools 2012.2 fornisce un nuovo modello per la creazione di applicazioni a pagina singola usando knockout.js e API Web ASP.NET. Oltre al nuovo modello SPA, sono disponibili anche nuovi modelli spa creati dalla community per il download.

Oltre ai quattro framework di sviluppo principali, ASP.NET offre anche tecnologie aggiuntive che sono importanti per essere consapevoli e familiari con, ma non sono trattati in questa serie di esercitazioni:

  • API Web ASP.NET : framework per la creazione di servizi HTTP che raggiungono un'ampia gamma di client, inclusi browser e dispositivi mobili.
  • ASP.NET SignalR : libreria che semplifica lo sviluppo di funzionalità Web in tempo reale.

Revisione del progetto

In Visual Studio la finestra Esplora soluzioni consente di gestire i file per il progetto. Esaminiamo le cartelle aggiunte all'applicazione in Esplora soluzioni. Il modello di applicazione Web aggiunge una struttura di cartelle di base:

Creare il progetto - Esplora soluzioni

Visual Studio crea alcune cartelle e file iniziali per il progetto. I primi file che verranno usati più avanti in questa esercitazione sono i seguenti:

File Scopo
Default.aspx In genere la prima pagina visualizzata quando l'applicazione viene eseguita in un browser.
Site.Master Pagina che consente di creare un layout coerente e di usare il comportamento standard per le pagine nell'applicazione.
Global.asax File facoltativo che contiene codice per rispondere agli eventi a livello di applicazione e a livello di sessione generati da ASP.NET o dai moduli HTTP.
Web.config Dati di configurazione per un'applicazione.

Esecuzione dell'applicazione Web predefinita

L'applicazione Web predefinita offre un'esperienza avanzata basata su funzionalità e supporto predefiniti. Senza modifiche al progetto Web form predefinito, l'applicazione è pronta per l'esecuzione nel Web browser locale.

  1. Premere il tasto F5 mentre in Visual Studio.
    L'applicazione creerà e visualizzerà nel Web browser.

    Creare il progetto - Pagina predefinita

  2. Dopo aver completato la revisione dell'applicazione in esecuzione, chiudere la finestra del browser.

In questa applicazione Web predefinita sono presenti tre pagine principali: Default.aspx (Home), About.aspx e Contact.aspx. Ognuna di queste pagine può essere raggiunta dalla barra di spostamento superiore. Sono disponibili anche due pagine aggiuntive contenute nella cartella Account, nella pagina Register.aspx e nella pagina Login.aspx. Queste due pagine consentono di usare le funzionalità di appartenenza di ASP.NET per creare, archiviare e convalidare le credenziali utente.

Web Forms ASP.NET sfondo

Web Forms ASP.NET sono pagine basate sulla tecnologia Microsoft ASP.NET, in cui il codice eseguito nel server genera dinamicamente l'output della pagina Web nel browser o nel dispositivo client. Una pagina Web Forms ASP.NET esegue automaticamente il rendering del codice HTML conforme al browser corretto per funzionalità quali stili, layout e così via. Web Forms sono compatibili con qualsiasi linguaggio supportato dal common language runtime .NET, ad esempio Microsoft Visual Basic e Microsoft Visual C#. Inoltre, Web Forms sono basati su Microsoft .NET Framework, che offre vantaggi come un ambiente gestito, la sicurezza dei tipi e l'ereditarietà.

Quando viene eseguita una pagina Web Forms ASP.NET, la pagina passa attraverso un ciclo di vita in cui esegue una serie di passaggi di elaborazione. Questi passaggi includono l'inizializzazione, l'istanza dei controlli, il ripristino e la gestione dello stato, l'esecuzione del codice del gestore eventi e il rendering. Man mano che si ha familiarità con la potenza di Web Forms ASP.NET, è importante comprendere il ciclo di vita della pagina ASP.NET in modo che sia possibile scrivere codice nella fase appropriata del ciclo di vita per l'effetto desiderato.

Quando un server Web riceve una richiesta per una pagina, trova la pagina, lo elabora, lo invia al browser e quindi elimina tutte le informazioni sulla pagina. Se l'utente richiede di nuovo la stessa pagina, il server ripete l'intera sequenza, elaborando nuovamente la pagina da zero. Mettere un altro modo, un server non ha memoria di pagine che ha pagine elaborate sono senza stato. Il framework di pagina ASP.NET gestisce automaticamente l'attività di gestione dello stato della pagina e dei relativi controlli e fornisce modi espliciti per mantenere lo stato delle informazioni specifiche dell'applicazione.

Suggerimento

Funzionalità dell'applicazione Web nel modello di applicazione Web Forms

Il modello di applicazione Web Forms ASP.NET offre un set completo di funzionalità predefinite. Non solo offre una pagina Home.aspx , una pagina About.aspx , una pagina Contact.aspx , ma include anche funzionalità di appartenenza che registra gli utenti e salva le proprie credenziali in modo che possano accedere al sito Web. Questa panoramica fornisce altre informazioni su alcune delle funzionalità contenute nel modello di applicazione Web Forms ASP.NET e su come vengono usate nell'applicazione Wingtip Toys.

Appartenenze

ASP.NET L'identità archivia le credenziali degli utenti in un database creato dall'applicazione. Quando gli utenti accedono, l'applicazione convalida le credenziali leggendo il database. La cartella Account del progetto contiene i file che implementano le varie parti dell'appartenenza: registrazione, registrazione, modifica di una password e autorizzazione dell'accesso. Inoltre, Web Forms ASP.NET supporta OAuth e OpenID. Questi miglioramenti di autenticazione consentono agli utenti di accedere al sito usando credenziali esistenti, da account come Facebook, Twitter, Windows Live e Google.

Creare il progetto - Esplora soluzioni (ASP.NET identity)

Per impostazione predefinita, il modello crea un database di appartenenza usando un nome di database predefinito in un'istanza di SQL Server Express LocalDB, il server di database di sviluppo fornito con Visual Studio Express 2013 per Web.

SQL Server Express LocalDB

SQL Server Express LocalDB è una versione leggera di SQL Server con molte funzionalità di programmabilità di un database SQL Server. SQL Server Express LocalDB viene eseguito in modalità utente e ha un'installazione rapida e zero-configuration con un breve elenco di prerequisiti di installazione. In Microsoft SQL Server, qualsiasi codice Transact-SQL o database può essere spostato da SQL Server Express LocalDB a SQL Server e SQL Azure senza alcuna procedura di aggiornamento. Quindi, SQL Server Express LocalDB può essere usato come ambiente di sviluppo per le applicazioni destinate a tutte le edizioni di SQL Server. SQL Server Express LocalDB abilita funzionalità quali stored procedure, funzioni definite dall'utente e aggregazioni, integrazione di .NET Framework, tipi spaziali e altri che non sono disponibili in SQL Server Compact.

Pagine master

Una pagina master ASP.NET definisce un aspetto e un comportamento coerenti per tutte le pagine dell'applicazione. Il layout della pagina master viene unito al contenuto da una singola pagina del contenuto per produrre la pagina finale visualizzata dall'utente. Nell'applicazione Wingtip Toys si modifica la pagina master Site.master in modo che tutte le pagine del sito Web Wingtip Toys condividono lo stesso logo e barra di spostamento distintiva.

HTML5

Il modello di applicazione Web Forms ASP.NET supporta HTML5, ovvero la versione più recente del linguaggio di markup HTML. HTML5 supporta nuovi elementi e funzionalità che semplificano la creazione di siti Web.

Modernizr

Per i browser che non supportano HTML5, è possibile usare Modernizr. Modernizr è una libreria JavaScript open source che può rilevare se un browser supporta le funzionalità HTML5 e abilitarle se non lo fa. Nel modello di applicazione Web Forms ASP.NET, Modernizr viene installato come pacchetto NuGet.

Bootstrap

I modelli di progetto Visual Studio 2013 usano Bootstrap, un framework di layout e di liing creati da Twitter. Bootstrap usa CSS3 per fornire una progettazione reattiva, il che significa che i layout possono adattarsi dinamicamente alle diverse dimensioni delle finestre del browser. È anche possibile usare la funzionalità di loro di Bootstrap per apportare facilmente un cambiamento nell'aspetto e nell'aspetto dell'applicazione. Per impostazione predefinita, il modello di applicazione Web ASP.NET in Visual Studio 2013 include Bootstrap come pacchetto NuGet.

Pacchetti NuGet

Il modello di applicazione Web Forms ASP.NET include un set di pacchetti NuGet. Questi pacchetti forniscono funzionalità componentizzate sotto forma di librerie e strumenti open source. È disponibile un'ampia gamma di pacchetti che consentono di creare e testare le applicazioni. Visual Studio semplifica l'aggiunta, la rimozione e l'aggiornamento dei pacchetti NuGet. Gli sviluppatori possono anche creare e aggiungere pacchetti a NuGet.

Screenshot della finestra Gestisci pacchetti NuGet con jQuery evidenziata.

Quando si installa un pacchetto, NuGet copia i file nella soluzione e apporta automaticamente le modifiche necessarie, ad esempio l'aggiunta di riferimenti e la modifica della configurazione associata all'applicazione Web. Se si decide di rimuovere la libreria, NuGet rimuove i file e inverte le modifiche apportate nel progetto in modo che non venga lasciato alcun clutter. NuGet è disponibile dal menu Strumenti in Visual Studio.

jQuery

jQuery è una libreria JavaScript veloce e concisa che semplifica l'attraversamento di documenti HTML, la gestione degli eventi, l'animazione e le interazioni Ajax per lo sviluppo Web rapido. La libreria jQuery JavaScript è inclusa nel modello di applicazione Web Forms ASP.NET come pacchetto NuGet.

Convalida non intrusiva

I controlli validator predefiniti sono stati configurati per usare JavaScript non intrusivo per la logica di convalida lato client. Ciò riduce significativamente la quantità di JavaScript sottoposta a rendering inline nel markup della pagina e riduce le dimensioni complessive della pagina. La convalida unobtrusive viene aggiunta a livello globale al modello di applicazione Web Forms ASP.NET in base all'impostazione nell'elemento <appSettings> del fileWeb.config nella radice dell'applicazione.

Entity Framework Code First

Oltre alle funzionalità nel modello di applicazione Web Forms ASP.NET, l'applicazione Wingtip Toys usa Entity Framework Code First, ovvero una libreria NuGet che consente lo sviluppo incentrato sul codice quando si usano i dati. Semplicemente, crea la parte del database dell'applicazione in base al codice scritto. Usando Entity Framework, è possibile recuperare e modificare i dati come oggetti fortemente tipizzati. Ciò consente di concentrarsi sulla logica di business nell'applicazione anziché sui dettagli relativi alla modalità di accesso ai dati.

Per altre informazioni sulle librerie e i pacchetti installati inclusi nel modello di Web Forms ASP.NET, vedere l'elenco dei pacchetti NuGet installati. A tale scopo, in Visual Studio creare un nuovo progetto di Web Forms, selezionare Strumenti>Gestione pacchetti NuGet>Gestisci pacchetti NuGet per la soluzione e selezionare Pacchetti installati nella finestra di dialogo Gestisci pacchetti NuGet.

Tour di Visual Studio

Le finestre principali di Visual Studio includono l'Esplora soluzioni, Esplora server (Esplora database in Express), la finestra Proprietà, la casella degli strumenti, la barra degli strumenti e la finestra documento.

Diagramma che mostra le finestre principali in Visual Studio.

Per altre informazioni su Visual Studio, vedere Visual Guide to Visual Web Developer.For more information about Visual Studio, see Visual Guide to Visual Web Developer.

Riepilogo

In questa esercitazione è stata creata, esaminata ed eseguita l'applicazione di Web Forms predefinita. Sono state esaminate le diverse funzionalità dell'applicazione Web form predefinita e sono state illustrate alcune nozioni di base su come usare l'ambiente di Visual Studio. Nelle esercitazioni seguenti si creerà il livello di accesso ai dati.

Risorse aggiuntive

Confronto tra progetti di applicazione Web e progetti di sito Web
Panoramica delle pagine Web Forms ASP.NET