Introducció a ASP.NET Core
ASP.NET Core és un framework de codi obert i multiplataforma per construir aplicacions modernes basades en la web, serveis web i aplicacions mòbils. És una evolució de l'ASP.NET tradicional, dissenyada per ser més lleugera, modular i amb millor rendiment.
Objectius d'aquest tema:
- Entendre què és ASP.NET Core i les seves característiques principals.
- Configurar un projecte ASP.NET Core.
- Crear una aplicació web bàsica amb ASP.NET Core.
- Comprendre la configuració i el pipeline de middleware.
- Treballar amb controladors i vistes.
Característiques Principals d'ASP.NET Core
- Multiplataforma: Funciona en Windows, macOS i Linux.
- Alt Rendiment: Optimitzat per a un alt rendiment i escalabilitat.
- Modularitat: Permet afegir només els components necessaris.
- Integració amb Modernes Tecnologies: Suport per a contenedors Docker, microserveis, etc.
- Codi Obert: Desenvolupat i mantingut per la comunitat i Microsoft.
Configuració de l'Entorn de Desenvolupament
Requisits:
- .NET SDK: Descarrega i instal·la el .NET SDK des del lloc oficial de .NET.
- IDE: Visual Studio, Visual Studio Code o qualsevol altre editor de codi.
Creació d'un Nou Projecte ASP.NET Core
-
Utilitzant la línia de comandes:
dotnet new webapp -n MyFirstAspNetCoreApp cd MyFirstAspNetCoreApp dotnet run
-
Utilitzant Visual Studio:
- Obre Visual Studio.
- Selecciona "Create a new project".
- Tria "ASP.NET Core Web Application" i fes clic a "Next".
- Configura el nom del projecte i la ubicació, i fes clic a "Create".
- Selecciona "Web Application (Model-View-Controller)" i fes clic a "Create".
Estructura del Projecte
Un projecte ASP.NET Core típic té la següent estructura:
MyFirstAspNetCoreApp/ │ ├── Controllers/ │ └── HomeController.cs │ ├── Models/ │ ├── Views/ │ ├── Home/ │ │ └── Index.cshtml │ └── Shared/ │ └── _Layout.cshtml │ ├── wwwroot/ │ ├── css/ │ ├── js/ │ └── lib/ │ ├── appsettings.json ├── Program.cs └── Startup.cs
Fitxers Clau:
- Program.cs: Punt d'entrada de l'aplicació.
- Startup.cs: Configuració del pipeline de middleware i serveis.
- appsettings.json: Configuració de l'aplicació.
Creació d'una Aplicació Web Bàsica
Configuració del Pipeline de Middleware
El pipeline de middleware es configura al fitxer Startup.cs
. Aquí és on es defineixen els components que gestionen les sol·licituds HTTP.
public class Startup { public void ConfigureServices(IServiceCollection services) { services.AddControllersWithViews(); } public void Configure(IApplicationBuilder app, IWebHostEnvironment env) { if (env.IsDevelopment()) { app.UseDeveloperExceptionPage(); } else { app.UseExceptionHandler("/Home/Error"); app.UseHsts(); } app.UseHttpsRedirection(); app.UseStaticFiles(); app.UseRouting(); app.UseAuthorization(); app.UseEndpoints(endpoints => { endpoints.MapControllerRoute( name: "default", pattern: "{controller=Home}/{action=Index}/{id?}"); }); } }
Creació d'un Controlador
Els controladors gestionen les sol·licituds HTTP i retornen respostes. A Controllers/HomeController.cs
:
using Microsoft.AspNetCore.Mvc; public class HomeController : Controller { public IActionResult Index() { return View(); } }
Creació d'una Vista
Les vistes són plantilles HTML que es renderitzen com a resposta. A Views/Home/Index.cshtml
:
@{ ViewData["Title"] = "Home Page"; } <div class="text-center"> <h1 class="display-4">Welcome</h1> <p>Welcome to your ASP.NET Core application!</p> </div>
Exercici Pràctic
Objectiu:
Crear una aplicació ASP.NET Core que mostri una llista de productes.
Passos:
-
Crear un Model:
public class Product { public int Id { get; set; } public string Name { get; set; } public decimal Price { get; set; } }
-
Crear un Controlador:
using Microsoft.AspNetCore.Mvc; using System.Collections.Generic; public class ProductController : Controller { public IActionResult Index() { var products = new List<Product> { new Product { Id = 1, Name = "Product 1", Price = 10.0m }, new Product { Id = 2, Name = "Product 2", Price = 20.0m }, new Product { Id = 3, Name = "Product 3", Price = 30.0m } }; return View(products); } }
-
Crear una Vista: A
Views/Product/Index.cshtml
:@model IEnumerable<Product> <h1>Product List</h1> <table class="table"> <thead> <tr> <th>Id</th> <th>Name</th> <th>Price</th> </tr> </thead> <tbody> @foreach (var product in Model) { <tr> <td>@product.Id</td> <td>@product.Name</td> <td>@product.Price</td> </tr> } </tbody> </table>
Solució:
- El model
Product
defineix les propietats dels productes. - El controlador
ProductController
crea una llista de productes i la passa a la vista. - La vista
Index.cshtml
mostra la llista de productes en una taula HTML.
Resum
En aquest tema, hem après a configurar un projecte ASP.NET Core, crear una aplicació web bàsica, treballar amb controladors i vistes, i configurar el pipeline de middleware. Hem creat un exemple pràctic per reforçar els conceptes apresos. En el següent tema, explorarem més a fons les funcionalitats avançades d'ASP.NET Core.
Curs de Programació en C#
Mòdul 1: Introducció al C#
- Introducció al C#
- Configuració de l'Entorn de Desenvolupament
- Programa Hello World
- Sintaxi i Estructura Bàsica
- Variables i Tipus de Dades
Mòdul 2: Estructures de Control
Mòdul 3: Programació Orientada a Objectes
Mòdul 4: Conceptes Avançats de C#
- Interfícies
- Delegats i Esdeveniments
- Genèrics
- Col·leccions
- LINQ (Consulta Integrada al Llenguatge)
- Programació Asíncrona
Mòdul 5: Treballant amb Dades
Mòdul 6: Temes Avançats
- Reflexió
- Atributs
- Programació Dinàmica
- Gestió de Memòria i Recollida d'Escombraries
- Multifil i Programació Paral·lela
Mòdul 7: Construcció d'Aplicacions
Mòdul 8: Millors Pràctiques i Patrons de Disseny
- Estàndards de Codificació i Millors Pràctiques
- Patrons de Disseny
- Proves Unitàries
- Revisió de Codi i Refactorització