In this blog post, we’ll walk through the process of creating an airline booking application using .NET 9 and Dotnet Aspire. We’ll cover the setup and development in both Visual Studio Code and Visual Studio 2022. By the end, you’ll have a comprehensive understanding of how to build a robust application with these tools.
Table of Contents
- Introduction
- Setting Up the Development Environment
- Creating the Project
- Implementing the Backend
- Building the Frontend
- Testing the Application
- Summary
1. Introduction
.NET 9 introduces several new features and improvements that make it an excellent choice for building modern web applications. Dotnet Aspire is a powerful framework that simplifies the development process, providing a solid foundation for our airline booking app.
2. Setting Up the Development Environment
Before we start coding, let’s set up our development environment.
Visual Studio Code
- Install Visual Studio Code: Download and install Visual Studio Code.
- Install .NET SDK: Download and install the .NET 9 SDK from the .NET website.
- Install Extensions: Install the C# extension for Visual Studio Code.
Visual Studio 2022
- Install Visual Studio 2022: Download and install Visual Studio 2022.
- Install .NET SDK: Ensure the .NET 9 SDK is installed.
- Create a New Project: Open Visual Studio 2022 and create a new ASP.NET Core Web Application.
3. Creating the Project
Let’s create our project using the command line.
dotnet new webapi -n AirlineBookingApp
cd AirlineBookingAppThis command creates a new ASP.NET Core Web API project named AirlineBookingApp.
4. Implementing the Backend
We’ll start by implementing the backend services for our application.
Models
Create a Models folder and add the following classes:
// Models/Flight.cs
public class Flight
{
public int Id { get; set; }
public string Airline { get; set; }
public string Destination { get; set; }
public DateTime DepartureTime { get; set; }
public int AvailableSeats { get; set; }
}
// Models/Booking.cs
public class Booking
{
public int Id { get; set; }
public int FlightId { get; set; }
public string PassengerName { get; set; }
public string PassengerEmail { get; set; }
}Data Context
Create a Data folder and add the following context class:
// Data/ApplicationDbContext.cs
using Microsoft.EntityFrameworkCore;
public class ApplicationDbContext : DbContext
{
public DbSet<Flight> Flights { get; set; }
public DbSet<Booking> Bookings { get; set; }
public ApplicationDbContext(DbContextOptions<ApplicationDbContext> options)
: base(options)
{
}
}Services
Create a Services folder and add the following service interfaces and implementations:
// Services/IFlightService.cs
public interface IFlightService
{
Task<IEnumerable<Flight>> GetFlightsAsync();
Task<Flight> GetFlightByIdAsync(int id);
Task AddFlightAsync(Flight flight);
Task UpdateFlightAsync(Flight flight);
Task DeleteFlightAsync(int id);
}
// Services/FlightService.cs
public class FlightService : IFlightService
{
private readonly ApplicationDbContext _context;
public FlightService(ApplicationDbContext context)
{
_context = context;
}
public async Task<IEnumerable<Flight>> GetFlightsAsync()
{
return await _context.Flights.ToListAsync();
}
public async Task<Flight> GetFlightByIdAsync(int id)
{
return await _context.Flights.FindAsync(id);
}
public async Task AddFlightAsync(Flight flight)
{
_context.Flights.Add(flight);
await _context.SaveChangesAsync();
}
public async Task UpdateFlightAsync(Flight flight)
{
_context.Flights.Update(flight);
await _context.SaveChangesAsync();
}
public async Task DeleteFlightAsync(int id)
{
var flight = await _context.Flights.FindAsync(id);
if (flight != null)
{
_context.Flights.Remove(flight);
await _context.SaveChangesAsync();
}
}
}5. Building the Frontend
For the frontend, we’ll use Razor Pages to create a simple UI for booking flights.
Pages
Create a Pages folder and add the following Razor Pages:
// Pages/Index.cshtml
@page
@model IndexModel
@{
ViewData["Title"] = "Home page";
}
<h1>Available Flights</h1>
<table class="table">
<thead>
<tr>
<th>Airline</th>
<th>Destination</th>
<th>Departure Time</th>
<th>Available Seats</th>
<th></th>
</tr>
</thead>
<tbody>
@foreach (var flight in Model.Flights)
{
<tr>
<td>@flight.Airline</td>
<td>@flight.Destination</td>
<td>@flight.DepartureTime</td>
<td>@flight.AvailableSeats</td>
<td><a asp-page="/Book" asp-route-id="@flight.Id">Book</a></td>
</tr>
}
</tbody>
</table>
// Pages/Book.cshtml
@page "{id:int}"
@model BookModel
@{
ViewData["Title"] = "Book Flight";
}
<h1>Book Flight</h1>
<form method="post">
<div class="form-group">
<label asp-for="Booking.PassengerName"></label>
<input asp-for="Booking.PassengerName" class="form-control" />
</div>
<div class="form-group">
<label asp-for="Booking.PassengerEmail"></label>
<input asp-for="Booking.PassengerEmail" class="form-control" />
</div>
<button type="submit" class="btn btn-primary">Book</button>
</form>6. Testing the Application
Run the application using the following command:
dotnet runOpen your browser and navigate to https://localhost:5001 to see the application in action.
7. Summary
In this blog post, we built a simple airline booking application using .NET 9 and Dotnet Aspire. We covered the setup and development in both Visual Studio Code and Visual Studio 2022, implemented the backend services, and created a basic frontend using Razor Pages. This application serves as a solid foundation for further enhancements and features.
Feel free to expand on this project by adding more functionalities, such as user authentication, payment processing, and more. Happy coding!
