Building a Site with Bootstrap, AngularJS, ASP.NET, EF and Azure

Starting Off
Welcome to the first module of Building a Site with Bootstrap, AngularJS, ASP. NET, Entity Framework, and Azure. In this first module, we're going to start off with a blank canvas. We're going to start completely without any code whatsoever. We're going to take a quick look at Bootstrap and what it does for us, and then find a Bootstrap template to start our website from. We'll then create a new ASP. NET MVC project to host our site. We'll import the template into the project, we'll create a Master Page, a Home Page, and finally, I'll give you a quick tour around Web Essentials and what it can do for you. Let's get going.

Creating Content
Welcome to Module 2 of Building a Site with Bootstrap, AngularJS, ASP. NET, Entity Framework, and Azure websites. In this module, we're going to be talking about how to use ASP. NET MVC to build your site. We're going to start by creating a View, we're going to show you how to use forms in HTML and how they relate to controllers. We're going to show how to validate those forms. We're going to create a service. We're going to use dependency injection to inject that service into controllers as we need it. And then we're going to bring it all together to have a completed Contact page. We're also going to show you how to use ActionLinks with new pages and how to turn on ASP. NET MVC security to allow your users to authenticate using custom credentials or using common credentials like Google, Yahoo, Microsoft ID, etc. Let's get started.

Prototyping the UI
Welcome to Module 3 of Building a Site with Bootstrap, AngularJS, ASP. NET, Entity Framework, and Azure. In this module, we're going to be talking about prototyping the UI before we go out and build our data structures, our services, those sorts of things. We're going to start out by talking about some layout basics from Bootstrap to understand how the Bootstrap grid works and how it will impact how you're going to design your site. Next, we're going to be talking about Zen Coding, a technique to quickly build prototyped apps. Then we're going to be designing the actual messages on our message board. We'll follow that up by designing the replies to each message. And then we're going to analyze the prototype to understand what sorts of data and services we're going to need for our website. Let's get started.

Building The Data Model
Welcome to Module 4 of Building a Site with Bootstrap, AngularJS, ASP. NET, Entity Framework, and Azure. In this module, we're going to building the data model with Entity Framework. We're going to start by building the model classes. These are the classes that represent the data in our system. And if you've been following along with the other modules, you'll know that we need something called a topic and need something else called a reply that is related to topics. We're also going to build something called the context, which is the gateway into the database. This is what marries the model classes and the database together. We're also going to building a repository, and that'll be a testable surface that does all of the data interaction for us so that we're not doing queries directly in our client code in the controllers. We'll then show you how to use the repository, how to configure the context to make the database updatable, and then finally we're going to be completing the repository with some initial operations. Let's get started.

Building the API
Welcome to Module 5 of Building a Site with Bootstrap, AngularJS, ASP. NET, Entity Framework, and Azure. In this module, we're going to be building the API. We're going to start out by creating a Web API controller and explain what that really means. We will then implement reading via that API. We're going to customize the controller in certain ways. We're going to deal with inserting via the API. We're going to talk about associations and routes and how those go together. And then we're going to talk about using query parameters in Web API projects.

AngularJS Basics
Welcome to Module 6 of Building a Site with Bootstrap, AngularJS, ASP. NET, Entity Framework, and Azure. My name is Shawn Wildermuth. In this module, we're going to be talking about AngularJS basics. We're going to start by introducing you to AngularJS. This is going to include the application directive, using AngularJS in ASP. NET MVC, we're going to build a controller; we're going to do some data binding, we're going to call the API we built in the last module, and then we're going to use some filters in our data binding. Let's get started.

Deeper Into AngularJS
Welcome to Module 7 of Building a Site with Bootstrap, AngularJS, ASP. NET, Entity Framework, and Azure. My name is Shawn Wildermuth. In this module, we're going to go deeper into AngularJS. We're going to start by looking at routing and views and how they're related and how you can create different views within a single session of a web page. We're going to show you two-way data binding with forms. We're going to introduce AngularJS validation. We're going to use AngularJS to push data back into the API to save new data to the server. We're going to show you how you can use AngularJS services to modularize your application, as well as be able to share data across views and controllers. Finally, we're going to show you how to build your controllers and services so that they work with minification. Let's get started.

Unit Testing
Welcome to Module 8 of Building a Site with Bootstrap, AngularJS, ASP. NET, Entity Framework, and Azure. My name is Shawn Wildermuth. In this module, we're going to be talking about unit testing. We're going to start out by adding a test project to our solution so that we can test code in our ASP. NET MVC project. We're going to then show you how to test Web API Services, show you how to do JavaScript testing with Jasmine. We're going to walk through testing our AngularJS code. We're going to dive into a specific problem space, and that is testing $http calls from within AngularJS code. And then we're going to show you how to run these same tests using the command-line tools, not just Visual Studio, so you can integrate with your builds with continuous integration. Let's get started.

Deploying to Azure
And finally, we're at Module 9 of Building of Site with Bootstrap, AngularJS, ASP. NET, Entity Framework, and Azure. In this module, we're going to be talking about deploying our website to Azure. We've taken all the time to build this website. We now need to get it out to the people, and that's where Azure can come into play. In this module, we're going to be talking about what Azure Web Sites actually is, we're going to be creating and configuring an Azure Web Site, we're going to be pushing our code to Azure, we're then going to create an Azure SQL database, we're going to be using a custom domain so we don't have to live on the Azure Web Site's. NET address, we'll then talk about scaling using Azure Web Sites, I show you how to monitor and debug your website once deployed to Azure, and finally how to manage your Azure SQL database. Let's get started.