Consuming a Standard API: An MVC Real Estate Example
Tags: api, github, tutorial, dotnet
Published: 2023-08-23 18:24:27

In this article, we will survey the process of consuming a .NET API service using a real estate application as an example. 

Throughout this guide, we will delve into the integration of a .NET MVC application with an existing API (a .NET API app which is included in the repository). 

{% embed https://github.com/tigerbluejay/MVC-App-Consuming-BARE-API %}

The MVC application will facilitate actions such as reading, creating, updating, and deleting information via API service calls, all within a user-friendly UI. 

Let's break down the components and steps involved in this integration.


## Project Structure

The MVC API-Consuming Service Solution comprises three essential projects:

* **MVC Web Project:** This houses the core functionality of the application.
* **Models Project:** This project contains the models and DTOs (Data Transfer Objects) that mirror those of the API.
* **Utilities Project:** This project provides auxiliary code to support object mapping functionalities (using the AutoMapper package).


![Project Structure - Solution Explorer](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/iyfjfye86kwsxh9rcop1.jpg)

## Integration Overview

The MVC app communicates with the API endpoints to perform CRUD (Create, Read, Update, Delete) operations on information related to Apartment Complexes and Apartment Units. Notably, this information is not stored directly in the MVC app's database. Instead, it is available through the API endpoints of the API app, which does itself then communicate with its own database.


![Landing Page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uln8z7t259jertgjf6fg.jpg)

### User Interface and Operations

Users access the application from the main menu on the home page. They can visualize information about Apartment Complexes and Apartment Units. Interaction with the API occurs through a set of services defined within the MVC app. Users can perform CRUD operations after registering and logging in.


![Login](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2ghdzzityawtaf2bwno8.jpg)


![Manage Apartment Complexes](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mu6myzw67hhospmtjbwe.jpg)


![Update Apartment Complex](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/senlz0zgw0fazpv9ptzv.jpg)

### Authentication and Authorization

The MVC app incorporates an Authentication Service responsible for sending user credentials and login tokens to authenticate users for API consumption. Communication is managed through **LoginRequestDTO** and **LoginResponseDTO**. The implementation of sessions enables the MVC app to recognize and maintain user login status.

API endpoints are restricted to logged-in users with the "admin" role, which is the default role for all users. Similarly, certain pages within the MVC app for performing CRUD operations are restricted to "admin" role users.

## MVC App Components

The MVC app consists of three main pillars:

1. **Authentication Functionality:** Handles user registration and login.
2. **Apartment Complex Functionality:** Manages CRUD operations for apartment complexes.
3. **Apartment Unit Functionality:** Manages CRUD operations for apartment units.


![Manage Apartment Units](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g8xhr5a1kiny7rgl4k92.jpg)


![Delete Apartment Unit](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/33fcmuagzb152jot84rj.jpg)


Each pillar (Auth, ApartmentComplex, ApartmentUnit) is supported by components:

* **Controllers:** These direct traffic between views and services, invoked based on the requested URL. There's a controller for each pillar.
* **Views:** User interfaces that display information and receive input. Views gather information, such as login credentials or data for updating/creating apartment complexes.
* **DTOs:** These mirror the DTOs defined in the API project, facilitating seamless communication between views, controllers, and services.
* **Services:** Each pillar has a dedicated service, and they inherit from a base service. Services configure requests, handle serialization/deserialization, and interact with API endpoints.


## Relationship with the API Project

The API Project is integrated into the solution as four separate projects. A detailed discussion of the API Project can be found in its own repository's readme file (that is, there exists a near duplicate repository containing only API related code). 

{% embed https://github.com/tigerbluejay/Buenos-Aires-Real-Estate-API %}

Minor discrepancies exist between the standalone API Repository and the one integrated with the MVC App, primarily related to data types within DTOs and Models. Despite these differences, approximately 99% of the projects' code remains consistent, so reading the standalone API's documentation will be of great use in understanding the code in the MVC App.

The standalone GitHub repo's readme.md file offers a comprehensive treatment of the API Project. Feel free to explore this file, as well as the standalone project, to gain a deeper understanding of the API integration.

Also if you wish, you may check out my post dealing with this project: [Navigating a Standard .NET API: A Real Estate Example](https://dev.to/josemariairiarte/navigating-a-standard-net-api-service-a-real-estate-example-1heb)


## In Closing

By exploring the github repo linked at the beginning of the article (the MVC App and its corresponding API), you can gain insights into effectively consuming a .NET API service within a real-world context.