Front-end Development with ASP.NET Core, Angular, and Bootstrap

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