Asp.Net Core, Angular and Webpack
This series is designed to be an ongoing effort to demonstrate how we approach the construction of
an Asp.Net Core web application using many different technologies the chief among them being Angular Js
and Webpack. It of course goes without saying that we must start the series using particular versions
of the underlying technologies but as they evolve and mature we will continue to update this series so
that our application matures along with them. You can also rest assured that this will not be just another
silly and useless tutorial on how to create a 'todo' app, which we hope will be evident from the very
beginning of the series.
#6 What is a Form Group?
In this article we will create the ability for our component to know whether or not the user is attempting to login or register and
create an angular form group object to be the backing store for our inputs form. Along the way we will create a form controller
class that will help us to access the controls contained within the form group.
#5 Authenticator Validators
In this article we will finish the ui of our authenticator component by creating and styling the validators for our inputs. Once we have completed
this we will also create a service for parsing a url. We will import this service into our component and we will eventually use it to tell
whether the user is attempting to login or register.
#4 Authenticator Inputs
In this article we will create and style the controls that we need for our authenticator component. In order to simplify
the process we will learn how to create mixins in our pug files and define functions in our scss files. We will also see how
Asp.Net will help us with the failure to load resources from a CDN by simplifying fallback to resources stored on
our servers.
#3 Our Very First Angular Component
In this article we will begin the effort to allow users to register and login to our application. We begin by creating our
first Angular component. And once created we will configure a corresponding module that will allow Angular to bootstrap
our component and display it in our browser window.
#2 Webpack: Transpiling and Bundling
In this article we configure Webpack to handle all of our transpiling and bundling requirements. When this is done
we will be able to transpile all of our .scss files for both the pages of our web application as well as for our
Angular components. We will also be able to process all of our .pug (formerly known as jade) and typescript files.
The results will be added to bundles that can be served with our page to drastically reduce the number of calls our
pages need to make to the server. We will also configure the output of our bundles to perform minification for use in
production.
#1 Creation and Basic Setup
In this article we will perform the creation and basic setup for our project.