Setting Up Your First ASP.NET Core Project: A Step-by-Step Guide

Embarking on Your ASP.NET Core Journey

Jan 09, 2024

Are you ready to dive into the world of ASP.NET Core? Whether you're a seasoned developer looking to expand your skillset or a newcomer to web development, this guide will walk you through the process of setting up your first ASP.NET Core project. We'll cover everything from installation to configuration, ensuring you have a solid foundation to build upon.

ASP.NET Core has revolutionized web development in the .NET ecosystem, offering cross-platform capabilities, improved performance, and a modular architecture. By the end of this guide, you'll have a functioning ASP.NET Core project up and running, ready for you to explore and expand.

Prerequisites: Getting Your Development Environment Ready

Before we jump into creating our first ASP.NET Core project, let's ensure we have all the necessary tools installed:

.NET SDK: The .NET Software Development Kit is essential for developing ASP.NET Core applications. Visit the official .NET download page to get the latest version for your operating system.
Integrated Development Environment (IDE): While you can use any text editor to write ASP.NET Core applications, an IDE can significantly enhance your productivity. We recommend:
- Visual Studio: A full-featured IDE available for Windows and Mac. Download it from the Visual Studio website.
- Visual Studio Code: A lightweight, cross-platform code editor. Get it from the Visual Studio Code website.
Git (Optional): Version control is crucial for any development project. If you haven't already, install Git from the official Git website.

Once you have these tools installed, you're ready to start your ASP.NET Core journey!

Creating Your First ASP.NET Core Project

Now that we have our development environment set up, let's create our first ASP.NET Core project. We'll use the command line interface (CLI) for this tutorial, as it works across all platforms.

1. Open your terminal or command prompt:

On Windows, you can use PowerShell or Command Prompt. On macOS or Linux, use your preferred terminal application.

2. Navigate to your desired project directory:

Use the cd command to move to the folder where you want to create your project.

3. Create a new ASP.NET Core project:

Run the following command:

dotnet new webapp -n MyFirstAspNetCoreApp

This command creates a new ASP.NET Core web application project named "MyFirstAspNetCoreApp". The -n flag specifies the name of your project.

4. Navigate into your project directory:

cd MyFirstAspNetCoreApp

Congratulations! You've just created your first ASP.NET Core project. Let's take a moment to understand the structure of the project we've just created.

Understanding Your ASP.NET Core Project Structure

When you open your project in your preferred IDE, you'll see a directory structure that might look something like this:

MyFirstAspNetCoreApp/
│
├── Properties/
│   └── launchSettings.json
│
├── wwwroot/
│   ├── css/
│   ├── js/
│   └── lib/
│
├── Pages/
│   ├── Error.cshtml
│   ├── Index.cshtml
│   ├── Privacy.cshtml
│   └── Shared/
│
├── appsettings.json
├── appsettings.Development.json
├── Program.cs
└── MyFirstAspNetCoreApp.csproj

Let's break down the key components:

Properties/launchSettings.json: This file contains configuration settings for running your application, including environment variables and server settings.
wwwroot/: This is the web root folder for your application, containing static files like CSS, JavaScript, and client-side libraries.
Pages/: In a Razor Pages application (which is what we've created), this folder contains your .cshtml files, which are a combination of HTML and C# code.
appsettings.json: This file contains configuration settings for your application, such as database connection strings or logging settings.
Program.cs: This is the entry point of your application, where the host is configured and the application is started.
MyFirstAspNetCoreApp.csproj: This is the project file that defines your project structure and dependencies.

Understanding this structure is crucial as you begin to develop more complex applications.

Configuring Your ASP.NET Core Application

Now that we've created our project and understand its structure, let's look at some basic configuration steps:

1. Modifying appsettings.json

The appsettings.json file is where you can store configuration settings for your application. By default, it looks something like this:

{
  "Logging": {
    "LogLevel": {
      "Default": "Information",
      "Microsoft": "Warning",
      "Microsoft.Hosting.Lifetime": "Information"
    }
  },
  "AllowedHosts": "*"
}

You can add your own settings here. For example, if you were connecting to a database, you might add a connection string:

{
  "Logging": {
    "LogLevel": {
      "Default": "Information",
      "Microsoft": "Warning",
      "Microsoft.Hosting.Lifetime": "Information"
    }
  },
  "AllowedHosts": "*",
  "ConnectionStrings": {
    "DefaultConnection": "Server=(localdb)\\mssqllocaldb;Database=MyFirstAspNetCoreApp;Trusted_Connection=True;"
  }
}

2. Configuring Services in Program.cs

The Program.cs file is where you configure the services and middleware for your application. Here's a basic example:

using Microsoft.AspNetCore.Builder;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.Extensions.Hosting;

var builder = WebApplication.CreateBuilder(args);

// Add services to the container.
builder.Services.AddRazorPages();

var app = builder.Build();

// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
    app.UseExceptionHandler("/Error");
    app.UseHsts();
}

app.UseHttpsRedirection();
app.UseStaticFiles();

app.UseRouting();

app.UseAuthorization();

app.MapRazorPages();

app.Run();

This setup includes services for Razor Pages and configures middleware for things like static files, routing, and authorization.

Running Your ASP.NET Core Application

Now that we've set up and configured our application, it's time to run it! Here's how:

1. Using the command line:

Navigate to your project directory in the terminal and run:

dotnet run

2. Using Visual Studio:

Press F5 or click the "Run" button.

3. Using Visual Studio Code:

Press F5 or use the "Run and Debug" sidebar.

Your default web browser should open automatically, displaying your new ASP.NET Core application. By default, you'll see a simple welcome page.

Next Steps: Customizing Your Application

Now that your application is up and running, you might want to start customizing it. Here are a few ideas to get you started:

Modify the home page: Open Pages/Index.cshtml and change the content to create your own custom home page.
Add a new page: Create a new .cshtml file in the Pages directory, along with its corresponding .cshtml.cs file for the page model.
Style your application: Add custom CSS to the wwwroot/css directory and link it in your pages.
Add client-side interactivity: Write some JavaScript in the wwwroot/js directory to make your pages more dynamic.
Integrate a database: Use Entity Framework Core to connect to a database and start storing and retrieving data.

Common Pitfalls and Troubleshooting

As you begin your ASP.NET Core journey, you might encounter a few common issues. Here are some tips to help you troubleshoot:

Port already in use: If you see an error message saying the port is already in use, you can change the port in the Properties/launchSettings.json file.
Missing dependencies: If you're getting errors about missing packages, try running dotnet restore in your project directory.
Runtime errors: Make sure you have the correct version of the .NET SDK installed for your project.
Changes not reflecting: Sometimes, you might need to stop and restart your application to see changes take effect, especially for configuration changes.
IDE not recognizing ASP.NET Core: Ensure you have the necessary extensions or components installed in your IDE for ASP.NET Core development.

Remember, the official ASP.NET Core documentation is an excellent resource for troubleshooting and learning more about ASP.NET Core.

Exploring Advanced ASP.NET Core Concepts

As you become more comfortable with the basics of ASP.NET Core, you might want to explore some more advanced concepts:

Dependency Injection: ASP.NET Core has built-in support for dependency injection, which can help you write more modular and testable code.
Middleware: Learn how to create custom middleware to process requests and responses in your application pipeline.
Authentication and Authorization: Implement user authentication and role-based authorization in your application.
API Development: Explore how to create RESTful APIs using ASP.NET Core Web API.
SignalR: Implement real-time functionality in your web applications using SignalR.
Blazor: Dive into Blazor to create interactive web UIs using C# instead of JavaScript.

These topics will help you leverage the full power of ASP.NET Core and create more sophisticated web applications.

Conclusion: Your ASP.NET Core Journey Begins

Setting up your first ASP.NET Core project is just the beginning of an exciting journey into modern web development. With its cross-platform capabilities, excellent performance, and robust ecosystem, ASP.NET Core provides a solid foundation for building web applications of any scale.

Remember, learning a new technology takes time and practice. Don't be discouraged if you encounter challenges along the way – they're all part of the learning process. Keep experimenting, building, and most importantly, have fun with your new ASP.NET Core skills!

Join The Community

Enjoyed this guide? Want to stay updated with the latest in ASP.NET Core development? Subscribe to my Substack for regular updates, tips, and in-depth articles on ASP.NET Core and web development. Join our community on Substack Chat to connect with fellow developers, share your experiences, and get your questions answered. Don't miss out on the opportunity to grow and learn together!

ASP Today

Discussion about this post