DEV Community

Code_Regina
Code_Regina

Posted on

[.NET R & R] Project Overview and API Basics

     -Project Over view 
     -Creating the dotnet solution
     -Adding VS code extensions
     -Creating a new c# class for the product
     -Adding the Db context class 
     -Creating an entity framework migration
     -Creating a class to seed the data 
     -Creating an API controller return a list of products
     -Using async methods when querying a database 
     -sabving our code 
Enter fullscreen mode Exit fullscreen mode

Project Overview

This project will be creating full-stack an e-commerce website using .NET with React and Redux [.NET R & R] from scratch.
Source: https://www.udemy.com/user/neil-cummings-2/

Creating the dotnet solution

To begin the project it is important to start at the terminal / command line. Using the first few commands to set up the project.
Create a template for a starter API at the terminal / command line. The command

dotnet new sln

will create a solution file for the project. The solution file is a container for the code. Next command will be

dotnet new webapi -o API

to create and name the API.

Then it is time to open the project in IDE for this project I chose visual studio code a short cut to opening a project from the terminal into VS code is to type

code .

To start the project
CD into the API then run
CD API
dotnet run

dotnet watch run

This will make it where the program will be automatically updated so that there is not a need to stop the program and restart the program.

the output

Image description

Adding VS code extensions

Here are some of the most helpful VS code extensions for creating this project.

Image description

Image description

Image description

Image description

Image description

Image description

Creating a new c# class for the product

Start buy creating a Entities Folder
Then create a new c# class file called products
Image description

then create the properties.

public class Product
    {

        public int Id { get; set; }

        public string Name { get; set; }

        public string Description { get; set; }

        public long Price { get; set; }

        public string PictureUrl { get; set; }

        public string Type { get; set; }

        public string Brand { get; set; }

        public int QuantityInStock { get; set; }    



    }

}

Enter fullscreen mode Exit fullscreen mode

Adding the Db context class

Start by looking for the NuGet gallery and search for
Microsoft.EntityFrameworkcore make sure to select the correct package.

Image description

Then create a new folder for Data and a new c# class StoreContext.cs

within that file

public class StoreContext : DbContext 
{
    public StoreContext(DbContextOptions)
        {

        }
    public DbSet<Product> Products { get; set; }
}
Enter fullscreen mode Exit fullscreen mode

Creating an entity framework migration

Creating a migration based on the code written so far.
The tool that will help us do this is

Dotnet-ef

https://www.nuget.org/packages/dotnet-ef/

The command to install in the project

dotnet tool install --global dotnet-ef --version 6.0.0

Enter fullscreen mode Exit fullscreen mode

to see all the tools

dotnet tool list -g

Enter fullscreen mode Exit fullscreen mode

to use the tool in the project

dotnet ef migrations add InitialCreate -o Data/Migrations

Enter fullscreen mode Exit fullscreen mode

a new folder will be created to hold the migrations in.

Image description

to show the database information
open the command panel and look for sqlite
open database

Image description

A new list of options appear to view the database

Image description

Creating a class to seed the data

Putting data into the project.

Inside the data folder create a new class

Image description

The name of the new class will be DbInitializer
This class will be used to create a list of products then add them to the database.

The point of this is if anything were to go wrong with the database it will be easy to drop the database and create a new one and add the same data back into it.

Next Up in the project

React Basics!!

Top comments (0)