Building Web Applications in .NET — Peter Himschoot Blazor Revealed Building Web Applications in .NET
Total Page:16
File Type:pdf, Size:1020Kb
Blazor Revealed Building Web Applications in .NET — Peter Himschoot Blazor Revealed Building Web Applications in .NET Peter Himschoot Blazor Revealed: Building Web Applications in .NET Peter Himschoot Melle, Belgium ISBN-13 (pbk): 978-1-4842-4342-8 ISBN-13 (electronic): 978-1-4842-4343-5 https://doi.org/10.1007/978-1-4842-4343-5 Library of Congress Control Number: 2019932722 Copyright © 2019 by Peter Himschoot This work is subject to copyright. All rights are reserved by the Publisher, whether the whole or part of the material is concerned, specifically the rights of translation, reprinting, reuse of illustrations, recitation, broadcasting, reproduction on microfilms or in any other physical way, and transmission or information storage and retrieval, electronic adaptation, computer software, or by similar or dissimilar methodology now known or hereafter developed. Trademarked names, logos, and images may appear in this book. Rather than use a trademark symbol with every occurrence of a trademarked name, logo, or image we use the names, logos, and images only in an editorial fashion and to the benefit of the trademark owner, with no intention of infringement of the trademark. The use in this publication of trade names, trademarks, service marks, and similar terms, even if they are not identified as such, is not to be taken as an expression of opinion as to whether or not they are subject to proprietary rights. While the advice and information in this book are believed to be true and accurate at the date of publication, neither the authors nor the editors nor the publisher can accept any legal responsibility for any errors or omissions that may be made. The publisher makes no warranty, express or implied, with respect to the material contained herein. Managing Director, Apress Media LLC: Welmoed Spahr Acquisitions Editor: Jonathan Gennick Development Editor: Laura Berendson Coordinating Editor: Jill Balzano Cover designed by eStudioCalamar Cover image designed by Freepik (www.freepik.com) Distributed to the book trade worldwide by Springer Science+Business Media New York, 233 Spring Street, 6th Floor, New York, NY 10013. Phone 1-800-SPRINGER, fax (201) 348-4505, e-mail orders-ny@springer- sbm.com, or visit www.springeronline.com. Apress Media, LLC is a California LLC and the sole member (owner) is Springer Science + Business Media Finance Inc (SSBM Finance Inc). SSBM Finance Inc is a Delaware corporation. For information on translations, please e-mail [email protected], or visit www.apress.com/ rights-permissions. Apress titles may be purchased in bulk for academic, corporate, or promotional use. eBook versions and licenses are also available for most titles. For more information, reference our Print and eBook Bulk Sales web page at www.apress.com/bulk-sales. Any source code or other supplementary material referenced by the author in this book is available to readers on GitHub via the book’s product page, located at www.apress.com/9781484243428. For more detailed information, please visit www.apress.com/source-code. Printed on acid-free paper Table of Contents About the Author ..................................................................................................... ix About the Technical Reviewer ................................................................................. xi Acknowledgments ................................................................................................. xiii Introduction to WebAssembly and Blazor ...............................................................xv Chapter 1: Your First Blazor Project ......................................................................... 1 Installing Blazor Prerequisites ������������������������������������������������������������������������������������������������������ 1 .NET Core ��������������������������������������������������������������������������������������������������������������������������������� 1 Visual Studio 2017 ������������������������������������������������������������������������������������������������������������������� 2 ASP.NET Core Blazor Language Services ��������������������������������������������������������������������������������� 3 Visual Studio Code ������������������������������������������������������������������������������������������������������������������� 3 Installing the Blazor Templates for VS/Code ���������������������������������������������������������������������������� 4 Generating Your Project with Visual Studio ����������������������������������������������������������������������������������� 5 Creating a Project with Visual Studio �������������������������������������������������������������������������������������� 6 Generating the Project with dotnet cli ������������������������������������������������������������������������������������� 7 Running the Project ����������������������������������������������������������������������������������������������������������������� 8 Examining the Project’s Parts ����������������������������������������������������������������������������������������������������� 10 The Solution ��������������������������������������������������������������������������������������������������������������������������� 10 The Server ����������������������������������������������������������������������������������������������������������������������������� 10 The Shared Project ���������������������������������������������������������������������������������������������������������������� 12 The Client Blazor Project ������������������������������������������������������������������������������������������������������� 13 Summary ������������������������������������������������������������������������������������������������������������������������������������ 17 iii TABLE OF CONtENtS Chapter 2: Data Binding .......................................................................................... 19 A Quick Look at Razor ����������������������������������������������������������������������������������������������������������������� 19 One-Way Data Binding ���������������������������������������������������������������������������������������������������������������� 21 One-Way Data Binding Syntax ����������������������������������������������������������������������������������������������� 21 Conditional Attributes ������������������������������������������������������������������������������������������������������������ 22 Event Handling and Data Binding ������������������������������������������������������������������������������������������������ 23 Event Binding Syntax ������������������������������������������������������������������������������������������������������������� 23 Event Arguments ������������������������������������������������������������������������������������������������������������������� 23 Using C# Lambda Functions �������������������������������������������������������������������������������������������������� 24 Two-Way Data Binding ���������������������������������������������������������������������������������������������������������������� 24 Two-Way Data Binding Syntax ����������������������������������������������������������������������������������������������� 24 Formatting Dates ������������������������������������������������������������������������������������������������������������������� 26 Reporting Changes ���������������������������������������������������������������������������������������������������������������������� 26 The Pizza Place Single Page Application ������������������������������������������������������������������������������������ 28 Creating the PizzaPlace Project ��������������������������������������������������������������������������������������������� 29 Adding Shared Classes to Represent the Data ���������������������������������������������������������������������� 30 Building the UI to Show the Menu ����������������������������������������������������������������������������������������� 34 Enter the Customer ���������������������������������������������������������������������������������������������������������������� 42 Validating the Customer Information ������������������������������������������������������������������������������������� 45 Summary ������������������������������������������������������������������������������������������������������������������������������������ 52 Chapter 3: Components and Structure for Blazor Applications .............................. 53 What Is a Blazor Component? ����������������������������������������������������������������������������������������������������� 53 Examining the SurveyPrompt Component ����������������������������������������������������������������������������� 54 Building a Simple Alert Component with Razor ��������������������������������������������������������������������� 55 Separating View and View-Model ������������������������������������������������������������������������������������������ 58 Building a Component Library ����������������������������������������������������������������������������������������������������� 66 Creating the Component Library Project ������������������������������������������������������������������������������� 67 Adding Components to the Library ���������������������������������������������������������������������������������������� 68 Refering to the Library from Your Project ������������������������������������������������������������������������������ 70 iv TABLE OF CONtENtS Refactoring