Building a Web App with ASP.NET Core, MVC, Entity Framework Core, Bootstrap, and Angular

ASP.NET Core is a mature, stable platform for developing web applications and APIs. This course will walk you through building a web app from scratch using ASP.NET Core 2.1, Visual Studio 2017, Entity Framework Core 2.1, Bootstrap 4, and Angular (v6)
Course info
Rating
(342)
Level
Beginner
Updated
Aug 17, 2018
Duration
9h 58m
Table of contents
Course Overview
Getting Started
HTML5 and CSS Basics
Getting Started with JavaScript
Using ASP.NET MVC
Using Bootstrap to Prototype the App
Building the Database with Entity Framework Core
Creating the API with ASP.NET MVC
ASP.NET Core Identity
Brief Introduction to TypeScript
Client-side Development with Angular
Using Services in Angular
Routing with Angular
Deploying ASP.NET Core Apps
Description
Course info
Rating
(342)
Level
Beginner
Updated
Aug 17, 2018
Duration
9h 58m
Description

Hello! My name is Shawn Wildermuth, and welcome to Building a Web App with ASP.NET Core, MVC, Entity Framework Core, Bootstrap, and Angular. In this course, you will be building a website from scratch using the latest version of Microsoft's ASP.NET Core framework. You will get there by learning about major topics like explaining.NET Core, learning the basics of web technologies like HTML, JavaScript and CSS. You'll also be exploring technologies inside of ASP.NET Core like Entity Framework Core, using ASP.NET Identity, building APIs with ASP.NET MVC, and deploying your app to the server or the cloud. In addition, you'll be building an Angular application to show you how to mix server and client-side development in ASP.NET Core. By the end of this course, you will be able to build websites and APIs using ASP.NET Core. Before you begin, make sure you are already familiar with C#. Exposure to Visual Studio would help too but is not required. After this course, you'll have a very basic understanding of all the technologies used, but would benefit from moving on to more in-depth courses on Angular, API design, and web development. I hope you'll join me, and I look forward to helping you on your learning journey here at Pluralsight.

About the author
About the author

Shawn Wildermuth has been tinkering with computers and software since he got a Vic-20 back in the early '80s. As a Microsoft MVP since 2002, he's also involved with Microsoft as an ASP.NET Insider and ClientDev Insider.

More from the author
Less: Getting Started
Intermediate
1h 11m
19 Sep 2018
More courses by Shawn Wildermuth
Section Introduction Transcripts
Section Introduction Transcripts

Course Overview
Hi everyone, my name is Shawn Wildermuth, and welcome to my course, Building a Web App with ASP. NET Core, MVC, Entity Framework Core, Bootstrap, and Angular. I'm an author, speaker, and Microsoft MVP. I'm the author of over 20 courses here at Pluralsight, and I've been writing or teaching software development for over 30 years now. ASP. NET Core has matured from its initial version 1. 0. If you have already worked with ASP. NET Core, they've made it a lot easier. If you're new to ASP. NET Core, this is a great time to learn this open source framework from Microsoft. In this course, we're going to build an entire web application from soup to nuts. We'll start with a complete blank slate and end up with a small, but fully functional web application. Some of the major topics that we will cover include why ASP. NET Core is a better way to build web applications, creating web pages with ASP. NET MVC, building APIs with ASP. NET MVC, securing your pages and APIs with ASP. NET Identity, and using Angular for client-side development. By the end of this course, you'll know how to build your own applications with ASP. NET core. Before beginning this course, you should be familiar with Visual Studio. From here you should feel comfortable diving into ASP. NET Core MVC with courses on Bootstrap 3, Angular 2, and deploying apps with Docker. I hope you'll join me on this journey to learn web development with the Building a Web App with ASP. NET Core, MVC, Entity Framework Core, Bootstrap, and Angular course right here at Pluralsight.

HTML5 and CSS Basics
So now let's look at the way that HTML and CSS can help us build applications directly in the web. In this module, I'm going to show you some HTML and CSS basics, including describing what HTML is, describing how CSS works with HTML, and how to layout pages using both HTML and CSS. Let's get started.

Getting Started with JavaScript
Now let's talk about JavaScript. In this module, we're going to show you a quick introduction into the language of JavaScript, we're going to show you how to include it in your projects, we'll introduce jQuery, and we'll also show you how to use npm for package management. Package management is about getting all of those client-side dependencies that you need, including jQuery. Let's get started.

Using ASP.NET MVC
So next let's learn about the Model-View-Controller system called MVC 6 in ASP. NET Core. So in this module, I'll show you how to support MVC 6 in ASP. NET Core projects, how to create some controllers, how to create views and layouts to support those controllers, how to use model validation to accept data from those views, and how to use TagHelpers to simplify some common tasks in building your web app.

Using Bootstrap to Prototype the App
So what is Bootstrap? It's an open source framework for building web apps. Much of it is based on CSS and SASS. It uses JavaScript for its own components, and it focuses on being modular, as well as skinnable. It doesn't have its own look and feel to allow you to make the changes to make it look like your website, not like a generic Bootstrap site. And it has support for 80% of the common metaphors that most websites need. Let's add it to the project.

Building the Database with Entity Framework Core
In this module, we're going to talk about using Entity Framework Core to access data in data stores. This module is going to cover creating entities using a DbContext to load and save those entities, seeding and creating databases, introducing you to the repository pattern, and we'll use logging to make sure we're doing all the right things. So what exactly is Entity Framework Core? It's a complete rewrite of the original Entity Framework. One of the chief reasons for this rewrite is to remove the requirement for relational databases. It doesn't mean that you won't be using relational databases, but it means Entity Framework Core won't require you to only access databases that are relational. This opens up a whole world to document databases, graph databases, and other kinds of databases that can be useful in building great applications. Entity Framework Core, like ASP. NET Core, Entity Framework Core is completely open source. You may find that at times using Entity Framework 6 is preferable because it is more mature than Entity Framework Core, but since we're working with Entity Framework Core 2, a lot of this maturity is starting to show itself in the framework. If you do decide to use Entity Framework 6 instead, you will need to stick with the desktop. NET to run your ASP. NET Cores on top of. Let's see how Entity Framework Core works.

Creating the API with ASP.NET MVC
In this module, we'll create an API using MVC 6. We'll do this by first building an API controller, we'll use verbs for different actions on that controller, we'll use validation in our APIs, I'll introduce you to ViewModel mapping, we'll show you how to create association controllers, and then I'll introduce how to use query strings in your API. Let's start by building that API controller.

ASP.NET Core Identity
So now let's take a look at ASP. NET Core Identity. In this module, we're going to take a look at the Authorize attribute, how to configure Identity, storing Identity with Entity Framework Core, and using Identity in the API. Now let's talk about what ASP. NET Core Identity is. It's a replacement for the old ASP. NET membership facility that was in ASP. NET. ASP. NET Core Identity also supports different types of authentication including cookies, OAuth2, and even JSON Web Tokens. ASP. NET Core Identity is pluggable, which means you have complete control over how you store your entities and what properties are on them. You can store your entities or get your entities from non-relational sources, not just databases. You can even look at LDAP and AD stores for getting your identities. Let's see what this looks like in practice.

Brief Introduction to TypeScript
Before we get to the Angular part of our course we want to give you a brief introduction to TypeScript. In this module we're going to talk about the TypeScript classes, how transpiling in Visual Studio 2017 works, and then how to debug TypeScript in the browser. TypeScript has a direct relationship to JavaScript in that it is a superset of JavaScript. TypeScript generally looks at the future of ECMAScript and implements new features in TypeScript before the browsers can catch up with the JavaScript implementations. In addition, it also adds type safety to the language, though it does make it optional. Because TypeScript is a superset of JavaScript, that means everything you know and have learned about JavaScript also applies to TypeScript. TypeScript just adds new features to JavaScript and generates JavaScript that implements those new features. Let's look at our first TypeScript class next.

Client-side Development with Angular
In this module, we'll introduce you to Angular and show you how to get started with your first Angular project inside ASP. NET Core. We're going to start by installing Angular, I'm going to use the Angular CLI to generate a project, we'll integrate that project with ASP. NET Core, we'll show you how to use external templates, and then we'll create our first component.

Using Services in Angular
In this next module, we'll be talking about services with Angular. We'll start by creating a class that can represent a service in Angular. We'll introduce the HTTP stack for making network calls. I'll show you how to use type safety in Angular. We'll share some data across components using our new service. Then I'll show you how to use calculated data in your components and services.

Routing with Angular
In this next module, we'll introduce Angular routing and complete our Angular app. We'll start by adding routing to the project. We'll create some routes. We'll use tokens in Angular to call our APIs. I'll introduce form binding in Angular, add some validation to the form, and then implement the server-side code to complete our order. Let's get started.

Deploying ASP.NET Core Apps
In this last module, we'll talk about deploying your ASP. NET Core application. We'll do this first by introducing Gulp that will allow us to do some build-time processing on some of our files. We'll prepare the code for production environments. We'll introduce environment tag Helpers. And we'll deploy to a number of different platforms.