ASP.NET Core 3 and Angular 9
Total Page:16
File Type:pdf, Size:1020Kb
ASP.NET Core 3 and Angular 9 Third Edition Full stack web development with .NET Core 3.1 and Angular 9 Valerio De Sanctis BIRMINGHAM - MUMBAI ASP.NET Core 3 and Angular 9 Third Edition Copyright © 2020 Packt Publishing All rights reserved. No part of this book may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written permission of the publisher, except in the case of brief quotations embedded in critical articles or reviews. Every effort has been made in the preparation of this book to ensure the accuracy of the information presented. However, the information contained in this book is sold without warranty, either express or implied. Neither the author, nor Packt Publishing or its dealers and distributors, will be held liable for any damages caused or alleged to have been caused directly or indirectly by this book. Packt Publishing has endeavored to provide trademark information about all of the companies and products mentioned in this book by the appropriate use of capitals. However, Packt Publishing cannot guarantee the accuracy of this information. Commissioning Editor: Ashwin Nair Acquisition Editor: Larissa Pinto Content Development Editor: Aamir Ahmed Senior Editor: Hayden Edwards Technical Editor: Sachin Sunilkumar Copy Editor: Safis Editing Project Coordinator: Kinjal Bari Proofreader: Safis Editing Indexer: Priyanka Dhadke Production Designer: Arvindkumar Gupta First published: October 2016 Second edition: November 2017 Third edition: February 2020 Production reference: 1130220 Published by Packt Publishing Ltd. Livery Place 35 Livery Street Birmingham B3 2PB, UK. ISBN 978-1-78961-216-5 www.packt.com Packt.com Subscribe to our online digital library for full access to over 7,000 books and videos, as well as industry leading tools to help you plan your personal development and advance your career. For more information, please visit our website. Why subscribe? Spend less time learning and more time coding with practical eBooks and Videos from over 4,000 industry professionals Improve your learning with Skill Plans built especially for you Get a free eBook or video every month Fully searchable for easy access to vital information Copy and paste, print, and bookmark content Did you know that Packt offers eBook versions of every book published, with PDF and ePub files available? You can upgrade to the eBook version at www.packt.com and as a print book customer, you are entitled to a discount on the eBook copy. Get in touch with us at [email protected] for more details. At www.packt.com, you can also read a collection of free technical articles, sign up for a range of free newsletters, and receive exclusive discounts and offers on Packt books and eBooks. Contributors About the author Valerio De Sanctis is a skilled IT professional with more than 15 years of experience in lead programming, web-based development, and project management using ASP.NET, PHP, and Java. He has held senior positions at a range of financial and insurance companies, most recently serving as Chief Technology Officer, Chief Security Officer, and Chief Operating Officer at a leading after-sales and IT service provider for multiple top-tier life and non-life insurance groups. During the course of his career, Valerio has helped many private organizations to implement and maintain .NET based solutions, working side by side with many IT industry experts and leading several frontend, backend, and UX development teams. He designed the architecture and actively oversaw the development of a wide number of corporate-level web application projects for high-profile clients, customers, and partners, including the London Stock Exchange Group, Zurich Insurance Group, Allianz, Generali, Harmonie Mutuelle, Honda Motor, FCA Group, Luxottica, ANSA, Saipem, ENI, Enel, Terna, Banzai Media, Virgilio.it, Repubblica.it, and Corriere.it. He is an active member of the Stack Exchange network, providing advice and tips for .NET, JavaScript, HTML5, and web-related topics on the StackOverflow, ServerFault, and SuperUser communities. Most of his projects and code samples are available under open source licenses on GitHub, BitBucket, NPM, CocoaPods, JQuery Plugin Registry, and WordPress Plugin Repository. He's also a Microsoft Most Valuable Professional (MVP) for Developer Technologies, an annual award that recognizes exceptional technology community leaders worldwide who actively share their high- quality, real-world expertise with users and Microsoft. Since 2014, he has operated an IT-oriented, web-focused blog at www.ryadel.com, featuring news, reviews, code samples, and guides designed to help developers and tech enthusiasts from all around the world. He has written various books on web development, many of which have become best-sellers on Amazon, with tens of thousands of copies sold worldwide. You can reach him on LinkedIn at https://www.linkedin.com/in/darkseal/ About the reviewers Anand Narayanaswamy works as a freelance writer and reviewer based in Thiruvananthapuram. He has had articles published in leading print magazines and on online tech portals. He was the recipient of the Microsoft MVP award from 2002 to 2011. He is currently a Windows Insider MVP and also part of the prestigious ASPInsiders group. Anand has also worked as a technical editor and reviewer for several publishers and authored Community Server Quickly for Packt Publishing. He has contributed content for Digit Magazine and Manorama Year Book. Anand works as an Unacademy educator and also runs his own blogs – Netans and Learnxpress. He is active on social media and can be reached at @visualanand on Twitter and @netanstech on Instagram. I would like to thank God for giving me the power to work daily. I would also like to thank Amrita Venugopal, Kinjal Bari, and Manthan Patel for their excellent support and patience. The manner in which Packt editors handle reviewers from the start of a project is highly impressive. I am also grateful to my father, mother, and brother for their constant support and encouragement. Santosh Yadav is from Pune, India, and holds a bachelor's degree in computing. He has more than 11 years' experience as a developer, and has worked with multiple technologies, including .NET, Node.js, and Angular. He is a Google Developer Expert in Angular and web technologies. He is the author of the ng deploy library for Netlify and a writer for Angular In Depth. He is also a speaker and organizer for the Pune Tech Meetup, and a contributor to projects including Angular and NgRx. Packt is searching for authors like you If you're interested in becoming an author for Packt, please visit authors.packtpub.com and apply today. We have worked with thousands of developers and tech professionals, just like you, to help them share their insight with the global tech community. You can make a general application, apply for a specific hot topic that we are recruiting an author for, or submit your own idea. Table of Contents Preface 1 Chapter 1: Getting Ready 8 Technical requirements 9 Two players, one goal 9 The ASP.NET Core revolution 10 ASP.NET Core 1.x 11 ASP.NET Core 2.x 12 ASP.NET Core 3.x 15 What's new in Angular? 17 GetAngular 17 AngularJS 18 Angular 2 19 Angular 4 21 Angular 5 22 Angular 6 23 Angular 7 23 Angular 8 25 Angular 9 26 Reasons for choosing .NET Core and Angular 27 A full-stack approach 29 SPAs, NWAs, and PWAs 30 Single-page application 31 Native web application 32 Progressive web application 32 Product owner expectations 35 A sample SPA project 37 Not your usual Hello World! 38 Preparing the workspace 38 Disclaimer – do (not) try this at home 39 The broken code myth 39 Stay hungry, stay foolish, yet be responsible as well 41 Setting up the project 42 Installing the .NET Core SDK 42 Checking the SDK version 43 Creating the .NET Core and Angular project 44 Opening the new project in Visual Studio 44 Performing a test run 47 Summary 48 Suggested topics 49 References 49 Table of Contents Chapter 2: Looking Around 52 Technical requirements 53 Solution overview 53 The .NET Core back-end 54 Razor Pages 55 Controllers 55 Configuration files 57 Program.cs 57 Web host versus web server 58 Startup.cs 60 appsettings.json 66 The Angular front-end 67 Workspace 68 angular.json 68 package.json 69 Upgrading (or downgrading) Angular 70 Upgrading (or downgrading) the other packages 72 tsconfig.json 74 Other workspace-level files 76 The /ClientApp/src/ folder 76 The /app/ folder 78 AppModule 78 Server-side AppModule for SSR 79 AppComponent 80 Other components 80 Testing the app 81 HomeComponent 81 NavMenuComponent 82 CounterComponent 83 The specs.ts file(s) 84 Our first app test 84 Getting to work 86 Static file caching 86 A blast from the past 87 Back to the future 88 Testing it out 90 The strongly-typed approach(es) 92 Client app cleanup 93 Trimming down the Component list 93 The AppModule source code 96 Updating the NavMenu 96 Summary 99 Suggested topics 100 References 100 Chapter 3: Front-end and Back-end Interactions 101 Technical requirements 102 Introducing .NET Core health checks 102 [ ii ] Table of Contents Adding the HealthChecks middleware 103 Adding an Internet Control Message Protocol (ICMP) check 105 Possible outcomes 106 Creating an ICMPHealthCheck class 106 Adding the ICMPHealthCheck to the pipeline 108 Improving the ICMPHealthCheck class 109 Adding parameters and response messages 109 Updating the middleware setup 111 Implementing a custom output message 112 About health check responses and HTTP status codes