Stay ahead of the web evolution with elegant combination front-end developmentFront-End Development with ASP.NET Core, Angular, and Bootstrap is the professional's guide to fast, responsive web development. Utilizing the most popular combination of web technologies for Microsoft developers, this guide provides the latest best practices and ASP.NET MVP guidance to get you up to speed quickly. The newest ASP.NET - now called ASP.NET Core - is leaner, easier to use, and less bound to the operating system and IDE.colle, giving you the perfect opportunity to leverage third-party frameworks and libraries that provide functionalities not native to ASP.NET Core and Visual Studio. This book shows you how to integrate ASP.NET Core with Angular, Bootstrap, and similar frameworks, with a bit of jQuery Mobile, Nuget, continuous deployment, Bower dependencies, and Gulp/Grunt build systems, including development beyond Windows on Mac and Linux. With clear, concise instruction and expert insight, this guide is an invaluable resource for meeting the demands of modern web development.* Combine ASP.NET Core with different tools, frameworks, and libraries* Utilize third-party libraries with non-native functionalities* Adopt the most up-to-date best practices for front-end development* Develop flexible, responsive design sitesThe world of web development is evolving faster than ever before, and the trend is toward small, focused frameworks with modular capabilities. Microsoft has noticed, and upgraded ASP.NET Core to align with the latest industry expectations. Front-End Development with ASP.NET Core, Angular, and Bootstrap helps you elegantly integrate these technologies to develop the sites that the industry demands.

FOREWORD xxvINTRODUCTION xxviiCHAPTER 1: WHAT'S NEW IN ASP.NET CORE MVC 1Getting the Names Right 1ASP.NET Core 2.NET Core 2Visual Studio Code 2Visual Studio 2017 2Versions Covered in this Book 2A Brief History of the Microsoft .NET Web Stack 3ASP.NET Web Forms 3ASP.NET MVC 4ASP.NET Web API 4OWIN and Katana 5The Emergence of ASP.NET Core and .NET Core 5.NET Core 5Getting Started with .NET Core 6The dotnet Command Line 6Introducing ASP.NET Core 7Overview of the New ASP.NET Core Web Application Project 7OWIN 10OWIN Layers 11OWIN Communication Interface 11A Better Look at Middleware 12Anatomy of an ASP.NET Core Application 12Host Builder Console Application 13ASP.NET Core Startup Class 14New Fundamental Features of ASP.NET Core 15Environments 15Dependency Injection 17What Is Dependency Injection? 17Using Dependency Injection in ASP.NET Core 18Logging 19Logger Instantiation 19Writing Log Messages 19Additional Logging Configuration 19Configuration 21Setting Up the Configuration Sources 21Reading Values from Configuration 22Using Strongly-Typed Configuration 22An Overview of Some ASP.NET Core Middleware 25Diagnostics 25Serving Static Files 26Application Frameworks 27ASP.NET Core MVC 27Using the MVC Framework inside ASP.NET Core 27Using Dependency Injection in Controllers 28View Components 30Tag Helpers 32Using Tag Helpers from ASP.NET Core 32Writing Custom Tag Helpers 34View Components as Tag Helpers 35Web API 35Summary 36CHAPTER 2: THE FRONT-END DEVELOPER TOOLSET 37Additional Languages You Have to Know 38Node.js 38JSON 39Sass and Less 40The Future of JavaScript 42TypeScript 42JavaScript Frameworks 43Angular 43Knockout 46React 47jQuery 49CSS Frameworks 49Bootstrap 50Primer CSS 51Material Design Lite 52Semantic UI 52Package Managers 53NuGet 53Bower 54NPM 55The Folder Structure 56Task Runners 56Summary 57CHAPTER 3: ANGULAR IN A NUTSHELL 59Angular Concepts 60The Language of Angular 61Setting Up an Angular Project 62Using an Online Editor 62Starting from the Quickstart Seed 63Using the Angular-CLI Tool 63The Structure of an Angular App 64Application Entry Point 64Root Module 64Root Component 66Main HTML Page 67Data Binding 68Interpolation 68One-Way Binding 69Event binding 69Two-Way Binding 70Directives 70Services and Dependecy Injection 71Multiple Components 73Input and Output Properties 75Talking to the Back End 78Using the Http Module 79Consuming the RxJS Observable 80Subscribing to the Observable 80Using the async Pipe 80Using Promises 81Using Angular with ASP.NET MVC 83Combining Angular and ASP.NET Core Projects 84Keeping Angular and ASP.NET Core as Two Separate projects 85Combining Angular and ASP.NET Core into One Project Using theAngular CLI 86Using JavaScriptServices 89Deciding Which Integration Method to Use 91Visual Studio 2017 Support for Angular 92Code Snippets 92IntelliSense in TypeScript Files 93IntelliSense in HTML Files 94Summary 95CHAPTER 4: BOOTSTRAP IN A NUTSHELL 97Introduction to Bootstrap 98Installing Bootstrap 98The Main Features 100Bootstrap Styles 100Grid System 100Typography 104Tables 105Forms 106Buttons 107Components 107Glyphicons 107Dropdown 108Input Groups 109Navigation 110Navigation Bar 111Pagination 113Breadcrumbs 114Tabs and Pills 115Other Components 116JavaScript 116Tabbed Content 117Activating Tab Navigation with JavaScript 117Activating Tab Navigation with Data Attributes 118Modal Dialog 118Tooltips and Popovers 120Customizing Bootstrap with Less 122Customizing via the Website 122Customizing with Less 123Bootstrap Support in Visual Studio 2017 and ASP.NET Core 124Bootstrap Snippet Pack 126Glyphfriend 126Tag Helpers for ASP.NET Core 127Summary 128CHAPTER 5: MANAGING DEPENDENCIES WITH NUGET AND BOWER 129General Concepts 130NuGet 130Getting Packages via NuGet 131Using the Package Manager GUI 131Using the Package Manager Console 132Manually Editing the .csproj Project File 133What Happens Once You Install a Package 135Publishing Your Own Packages 135Adding Metadata for the Package 135Creating the Package 136Publishing to the Nuget.org Gallery 137NPM (Node.js Package Manager) 137Installing NPM 137NPM Usage 138Using the NPM Command Line 138Using NPM within Visual Studio 139Where Packages Are Installed 139Bower 139Installing Bower 140Getting Packages with Bower 140Using the Bower Command Line 140Using the Bower Package Manager GUI in Visual Studio 141Editing the bower.json File 141Where Packages Are Installed 142Creating Your Own Packages 142Summary 143CHAPTER 6: BUILDING YOUR APPLICATION WITH GULP AND WEBPACK 145What Front-End Build Systems Are For 146A Deeper Look at Gulp 146Getting Started with Gulp 147The Gulpfile.js File 147gulp.task() 147gulp.watch() 148gulp.src() 148gulp.dest() 148A Typical Gulp Build File 148More Gulp Recipes 150Naming Output Files from a Package Name 150Generating Source maps 151Checking JavaScript Using JSHint 151Executing Tasks When Files Change 153Managing Bower Dependencies 153Replacing References Directly in the HTML Files 154Introduction to webpack 156webpack's Main Concepts 156Using webpack 156Bundling JavaScript 156Bundling Stylesheets 158Minifying and Adding Sourcemaps 159More Things webpack Can Do 160Visual Studio 2017 and Build Systems 160The Bundler and Minifier Extension 160The Task Runner Explorer 164IntelliSense for Gulp 164Summary 165CHAPTER 7: DEPLOYING ASP.NET CORE 167The New Hosting Model of ASP.NET Core 167Installing on Internet Information ServicesOn Premise 168Making Sure All Is Well 169Installing AspNetCoreModule 171Publishing Applications via the Command Line 171Creating the Website 172Publishing the Applications via Visual Studio 173Deploying on Azure 174Deploying to Azure from Visual Studio with Web Deploy 174Continuous Deployment to Azure with Git 179Configuring the Azure Web App 179Confi guring the Local Repository 180Deploying to Docker Containers 183Installing the Docker Support 183Publishing a Docker Image 186Summary 187CHAPTER 8: DEVELOPING OUTSIDE OF WINDOWS 189Installing .NET Core on macOS 190Building the First ASP.NET Core App on macOS 191Using dotnet Command-Line Interface 191Using Yeoman 195Visual Studio Code 196Setting It Up 197Development Features in Visual Studio Code 197IntelliSense 197Refactoring 198Errors and Suggestions 198Debugging 199Version Control 200Tasks 202Other Features 203OmniSharp 203Other IDEs 204Using Command-Line Tools 204Summary 205CHAPTER 9: PUTTING IT ALL TOGETHER 207Building a Triathlon Race Results Web Site 207Building the Back-Office Site 208Setting Up Entity Framework 211The Object Model 211The EF Core Context 213Migrations 214Building CRUD Screens 216The Controller 217The View 218Building the Registration Page 219Showing Real-Time Results 223Creating the Angular Client-Side Application 223Building the Web APIs 228Connecting with IoT Devices 232Deploying 235Summary 237INDEX 239