Learn Full-Stack Vue, .NET Core, PostgreSQL Web Development

In this lecture, we begin the Data Layer of our Web API, and set up Git!

Topics covered:

• Web API Data Layer

• Git

Let's hook our API up to PostgreSQL!

Using a Makefile can make development a bit easier.  We'll also begin adding Data Models to our API.

• MVC Controllers

• Services

• Interfaces

• SQL SELECT and INSERT Statements

• Wiring up our API to our data

Let's talk about our View Models, and continue general back-end service development.

Let's continue work on our service layer!

Let's expand our serializer behavior and controllers.

Postman is one of the most powerful tools for developing APIs.  Let's hook it up!

Let's wrap up our initial (first-pass) API development!

• Vue Application Structure

• Data binding and reactivity

• Functions

• Lifecycle Hooks

Let's use flex in our SCSS to create the basic layout of our web application.

Let's look at creating and displaying data in a table

In this video, we'll build a modal to receive inventory.  We'll also talk about named slots.

Modals are a part of many web applications - let's build a New Product modal for ours.

• Making HTTP Requests with axios

• Thinking about the Service Layer of the Front End

Configuring CORS properly can be a bit tricky, but we'll fix a bug on our back end, and work on our Inventory data.

Robust JSON serialization to and from our API is required, so we'll implement Newtonsoft.  We'll also make great use of Typescript types.

Let's break for some stylistic updates and save new products.

As we expand our API, we will be adding new endpoints in our controllers.

We need a way to manage our customer base, so let's integrate that into our app.

Let's keep the development on these features rolling.

We need to build an invoice wizard, so we'll do that in Vue.

Our customers want PDF invoices! Let's add this as a feature.

We need to track Sales Orders. Let's add the feature!

Let's add charts, and talk about Vuex.

A much-needed upgrade to our charts.

On to testing! But first, a bug fix.  In this video, we'll start unit testing our back-end code.

Let's test our Vue components using Jest.

Let's set up automation tests with Cypress.