Build a URL Shortener App with ASP.NET: Step by Step

What will you learn in this course? ?

- ? Make a simple web link shortener.

- ?️ Three projects: Admin site, Link Redirector, and Data Management.

- ?️ Start with basic SQL database, move to Azure SQL.

- ? Learn to use Entity Framework for handling data.

- ? Manage your code with GitHub.

- ? Keep your app safe with ASP.NET Identity.

- ? Use Bootstrap for easy and good-looking design.

- ☁️ Put your app online with Azure Web Services.

To get the most out of this course, I recommend that you follow along while I code. However, for you to be able to do so, there are some tools that you need to install.

To manage your code, you will use a GitHub repository. In this section, you will learn how I will structure my code throughout this course and how to push my code to a new GitHub repository.

ASP.NET MVC is a web application framework developed by Microsoft, which implements the model-view-controller (MVC) design pattern. It enables developers to build scalable and maintainable web applications by separating the application's concerns into three main components: the Model (data), the View (UI), and the Controller (business logic).

ASP.NET MVC comes with a set of default files that form the backbone of your web application. To understand these files and how they work together, check out this video. It's a great resource for getting started with ASP.NET MVC and lays a solid foundation for your development journey.

Creating your first controller is a pivotal step in ASP.NET MVC development. This video will guide you through the process, showing you how to set up, structure, and implement your first controller effectively. It's an essential watch for beginners looking to master the fundamentals of ASP.NET MVC controllers.

Creating your first Model in ASP.NET MVC is an essential step in defining the data structure of your application. This video tutorial will guide you through the process of creating and utilizing your first Model, teaching you how to define properties. It's crucial for effectively managing data and ensuring seamless interaction between your database and user interface in ASP.NET MVC applications.

Creating your first View in ASP.NET MVC is a key step in building your web application's user interface. This video will walk you through the process of creating your first View. You'll learn how to integrate C# code in HTML using Razor syntax.

Discover the key methods for passing data from a controller to a view in MVC in this concise video. I'll be highlighting the different approaches, including ViewData, ViewBag, TempData, and Model Binding, explaining their unique characteristics and differences.

In ASP.NET MVC, models are used to pass data from the controller to the view. A model typically is a class that represents the data of the application. When a controller handles a request, it can create and populate a model with data retrieved from a database or another source. This model is then passed to the view, which uses it to render the appropriate HTML to the user.

This pattern helps in separating the concerns of data management (model), request handling (controller), and user interface (view), making the code more organized and maintainable.

In ASP.NET MVC, ViewData is a dictionary object used to pass data from a controller to a view. It's a dynamic property of the ControllerBase class, allowing you to add any object with a key-value pair. Since it's loosely typed, you don't need to define a specific class for the data you're passing.

However, this lack of type safety requires casting in the view and can lead to runtime errors if not used carefully. ViewData is useful for passing small amounts of data, like dropdown lists or configuration settings, but for more complex data structures, using a model is recommended.

In ASP.NET MVC, ViewBag is a dynamic property provided by the Controller base class used for passing data from the controller to the view. It allows you to add properties to the `ViewBag` and then access them in the view with the same names. Like `ViewData`, it is dynamic and doesn't require pre-defined classes, offering flexibility but lacking type safety. This means there's no compile-time checking, which can lead to runtime errors if properties are not used correctly. `ViewBag` is ideal for transferring small pieces of data, such as titles, labels, or dropdown list items, from the controller to the view.

In ASP.NET MVC, TempData is used to pass data from the controller to the view, but it's designed for temporary storage, meaning it's meant to be used for a single redirect. TempData is a dictionary stored in session state and is capable of keeping data for the duration of an HTTP request. It's ideal for scenarios such as passing error messages or status data after a redirect, where ViewData and ViewBag would not persist the data after the redirect. Once TempData is read in the view, the information is discarded.

On the next parts you will start building the app step by step. You will create the key Controllers, Models and Views.

In this part you will clean up the HomeController by removing unused actions and Views to enhance performance and maintainability.

You will learn how to design a homepage using custom CSS for unique styles and Bootstrap for responsive, pre-designed components, achieving both personalized aesthetics and functionality.

On this part you will learn how to design the navigation bar and update the content of the footer.

The "All Links" page is where each user will see their shortened links, and the Administrator will see all links from all users. On this part, you will learn how to design it using the Bootstrap table component.

On this part you will learn how to pass dummy data from the Controller to the All Links page. You will pass the data using a model.

ASP.NET MVC ViewModel is used to organize and pass data from the controller to the view, making it easier to display specific data on web pages. It helps keep code clean and maintainable.

This is the first part of creating the User section where as an Administrator you can check all the users of the application and also the links that each user has created.

What to expect from this chapter?

Learn how to ensure URLs are correctly formatted using Regular Expressions (RegEx) in your applications. This video guides you through creating and implementing RegEx patterns to validate URLs, enhancing data integrity and user input validation in your software projects.

This video tutorial covers the essentials of handling login form submissions in ASP.NET MVC.

Discover how to implement data validation in your .NET applications using annotations. This guide explores the power of data annotations to simplify validation logic, enforce business rules, and ensure data integrity by annotating model properties directly in your code. Perfect for developers looking to streamline their validation processes.

This video tutorial covers the essentials of handling register form submissions in ASP.NET MVC.

Learn how to validate data of a register button like, fullname, email, and password strength. Here you will also learn how to validate if the Password and Confirm Password match.

Creating a custom validation attribute for email validation in .NET involves defining a class that inherits from the ValidationAttribute class. This custom attribute can then be used to annotate model properties to ensure they hold valid email addresses.

Entity Framework is an ORM that simplifies data access in .NET applications by letting you interact with databases using C# code. It offers benefits like increased productivity, strongly typed code, and a code-first approach.

In this quick tutorial, you'll learn how to install the powerful Entity Framework (EF) packages using NuGet. We'll cover finding the right package and adding it to your project in a few simple steps.

In the ASP.NET MVC framework, a model plays a crucial role in representing and managing the core data of your application

In Entity Framework (EF), the DbContext file is the heart of your interaction with the database. It acts as a bridge between your object-oriented code and your relational data.
Your DbContext class defines DbSet properties that correspond to tables in your database. Each DbSet represents a collection of entities of a specific type.
The DbContext provides methods for querying your database (using LINQ), saving changes to entities, and managing the database connection.

Configuring the AppDbContext file is crucial because it's the blueprint your application uses to interact with your database. It defines the shape of your data, the database connection details, and any special rules your application needs to follow when working with the data. A well-configured AppDbContext ensures smooth communication between your app and its data store.

Adding migrations in database development allows you to track and manage changes to your database schema in a structured way. These migrations hold instructions to modify the database, enabling you to easily apply updates or revert to earlier versions if needed.

Migrations offer a controlled and systematic way to modify the structure of your database schema. By creating migration files, you define precise changes such as adding or removing tables, altering columns, or adjusting data types, ensuring that your database evolves alongside your application's requirements.

Database seeder files provide a convenient way to populate your database with sample data. This is particularly useful for testing, demonstrations, or setting up a fresh development environment. Within the seeder file, you define the data you want to insert into specific database tables.

In this tutorial you will learn how to use entity framework core to load/get data from the database.

In this tutorial, you will learn how to shorten a URL and store it in the database with Entity Framework. To shorten a URL you will create a custom function which is going to generate a random string.

In this tutorial, you'll learn how to use TempData to pass information between actions, enabling you to display a notification message on the home page after a URL is shortened successfully.

In this tutorial, you will learn how to remove data from database with Entity Framework and also redirect user to the same page after the data is removed.

In this tutorial, you will learn how to load users from the database using Entity Framework.

In this tutorial, you will learn how to improve the user's view with more information. You will first add the total number of links and clicks, as well as a nested section where you can show the list of all the links with their click numbers.

In this tutorial, you will learn how to improve the All Links view with more information. For that you will first create a navigational property for the user, create a view model for the user, reference it and also update the select statement.

In this part, you will learn why should you use services in an ASP.NET application?

In this part, you will learn why you need to create and use interfaces with your services in an ASP.NET application.

On this part you will define the IUrlsService Interface method signatures it will contain. You will define the return types, method names and parameters

In this part, you will implement all the methods of the IUsersService interface. This will cover adding new users to the database, removing users, and updating existing user information.

In this part, you will implement all the methods of the IUrlsService interface. This will cover adding new urls to the database, removing urls, and updating existing url information.

In this part, you will learn how to inject the IUrlsService interface into the UrlsController and use its methods to retrieve, send, and update data in the database.

In ASP.NET Core, AddTransient, AddScoped, and AddSingleton dictate how long instances of your services persist within the application. AddTransient creates a new instance each time, AddScoped provides a single instance per request, and AddSingleton offers a single instance throughout the application's lifetime.

In this part, you will replace the DbContext injection in the AuthenticationController with IUsersService. You will use this service to perform all the operations.

AutoMapper simplifies object-to-object mapping in your ASP.NET Core applications. This eliminates tedious manual mapping code, improving code readability and maintainability.