100% found this document useful (1 vote)
25 views

Essential Angular for ASP.NET Core MVC 1st Edition Adam Freeman - Download the ebook and start exploring right away

The document provides information about various eBooks available for download at ebookmeta.com, including titles by Adam Freeman on Angular and ASP.NET Core MVC. It lists several recommended digital products and outlines the content structure of the book 'Essential Angular for ASP.NET Core MVC.' Additionally, it includes details about the authors, copyright information, and installation guides for necessary software to get started with the projects discussed in the book.

Uploaded by

jooseehupfer
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
100% found this document useful (1 vote)
25 views

Essential Angular for ASP.NET Core MVC 1st Edition Adam Freeman - Download the ebook and start exploring right away

The document provides information about various eBooks available for download at ebookmeta.com, including titles by Adam Freeman on Angular and ASP.NET Core MVC. It lists several recommended digital products and outlines the content structure of the book 'Essential Angular for ASP.NET Core MVC.' Additionally, it includes details about the authors, copyright information, and installation guides for necessary software to get started with the projects discussed in the book.

Uploaded by

jooseehupfer
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 54

Read Anytime Anywhere Easy Ebook Downloads at ebookmeta.

com

Essential Angular for ASP.NET Core MVC 1st Edition


Adam Freeman

https://ebookmeta.com/product/essential-angular-for-asp-net-
core-mvc-1st-edition-adam-freeman/

OR CLICK HERE

DOWLOAD EBOOK

Visit and Get More Ebook Downloads Instantly at https://ebookmeta.com


Recommended digital products (PDF, EPUB, MOBI) that
you can download immediately if you are interested.

Pro Entity Framework Core 2 for ASP.NET Core MVC 1st


Edition Adam Freeman

https://ebookmeta.com/product/pro-entity-framework-core-2-for-asp-net-
core-mvc-1st-edition-adam-freeman/

ebookmeta.com

Pro ASP.NET Core 7, Tenth Edition (MEAP V03) Adam Freeman

https://ebookmeta.com/product/pro-asp-net-core-7-tenth-edition-
meap-v03-adam-freeman/

ebookmeta.com

Pro ASP.NET Core 7, MEAP V03 10th Edition Adam Freeman

https://ebookmeta.com/product/pro-asp-net-core-7-meap-v03-10th-
edition-adam-freeman/

ebookmeta.com

Iranian Women in the Memoir Comparing Reading Lolita in


Tehran and Persepolis 1 and 2 1st Edition Emira Derbel

https://ebookmeta.com/product/iranian-women-in-the-memoir-comparing-
reading-lolita-in-tehran-and-persepolis-1-and-2-1st-edition-emira-
derbel/
ebookmeta.com
Given 1st Edition Amy Pennza

https://ebookmeta.com/product/given-1st-edition-amy-pennza/

ebookmeta.com

Mountain Daddy s Milk Honey Spice in the Mountains Book 1


1st Edition Elena Dawne

https://ebookmeta.com/product/mountain-daddy-s-milk-honey-spice-in-
the-mountains-book-1-1st-edition-elena-dawne/

ebookmeta.com

Property Investing Essentials For Dummies Australian


Edition Nicola Mcdougall

https://ebookmeta.com/product/property-investing-essentials-for-
dummies-australian-edition-nicola-mcdougall/

ebookmeta.com

The Artist 1st Edition Sheri Lewis Wohl

https://ebookmeta.com/product/the-artist-1st-edition-sheri-lewis-wohl/

ebookmeta.com

Digital Imaging of Artefacts Developments in Methods and


Aims 1st Edition Kate Kelley

https://ebookmeta.com/product/digital-imaging-of-artefacts-
developments-in-methods-and-aims-1st-edition-kate-kelley/

ebookmeta.com
Pietro Monte s Collectanea The Arms Armour and Fighting
Techniques of a Fifteenth Century Soldier 6 Armour and
Weapons Jeffrey L Forgeng
https://ebookmeta.com/product/pietro-monte-s-collectanea-the-arms-
armour-and-fighting-techniques-of-a-fifteenth-century-
soldier-6-armour-and-weapons-jeffrey-l-forgeng/
ebookmeta.com
Essential
Angular for
ASP.NET Core MVC

Adam Freeman

www.allitebooks.com
Essential Angular for
ASP.NET Core MVC

Adam Freeman

www.allitebooks.com
Essential Angular for ASP.NET Core MVC
Adam Freeman
London, UK
ISBN-13 (pbk): 978-1-4842-2915-6 ISBN-13 (electronic): 978-1-4842-2916-3
DOI 10.1007/978-1-4842-2916-3
Library of Congress Control Number: 2017949481
Copyright © 2017 by Adam Freeman
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.
Cover image by Freepik (www.freepik.com)
Managing Director: Welmoed Spahr
Editorial Director: Todd Green
Acquisitions Editor: Gwenan Spearing
Development Editor: Laura Berendson
Technical Reviewer: Fabio Claudio Ferracchiati
Coordinating Editor: Mark Powers
Copy Editor: Kim Wimpsett
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 rights@apress.com, 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/9781484229156. For more
detailed information, please visit www.apress.com/source-code.
Printed on acid-free paper

www.allitebooks.com
Dedicated to my lovely wife, Jacqui Griffyth.
(And also to Peanut.)

www.allitebooks.com
Contents at a Glance

About the Author�����������������������������������������������������������������������������������������������������xv


About the Technical Reviewer�������������������������������������������������������������������������������xvii


■Chapter 1: Understanding Angular and ASP.NET Core MVC����������������������������������� 1

■Chapter 2: Getting Ready��������������������������������������������������������������������������������������� 5

■Chapter 3: Creating the Project��������������������������������������������������������������������������� 21

■Chapter 4: Creating the Data Model�������������������������������������������������������������������� 43

■Chapter 5: Creating a Web Service���������������������������������������������������������������������� 69

■Chapter 6: Completing the Web Service������������������������������������������������������������ 103

■Chapter 7: Structuring an Angular Application������������������������������������������������� 135

■Chapter 8: Creating the Store���������������������������������������������������������������������������� 159

■Chapter 9: Completing the Angular Store���������������������������������������������������������� 187

■Chapter 10: Creating Administration Features�������������������������������������������������� 227

■Chapter 11: Securing the Application���������������������������������������������������������������� 251

■Chapter 12: Preparing for Deployment�������������������������������������������������������������� 279

Index��������������������������������������������������������������������������������������������������������������������� 295

www.allitebooks.com
Contents

About the Author�����������������������������������������������������������������������������������������������������xv


About the Technical Reviewer�������������������������������������������������������������������������������xvii


■Chapter 1: Understanding Angular and ASP.NET Core MVC����������������������������������� 1
Who Is This Book For?������������������������������������������������������������������������������������������������������ 1
What Does This Book Cover?�������������������������������������������������������������������������������������������� 1
What Doesn’t This Book Cover?��������������������������������������������������������������������������������������� 1
What Do You Need to Know?�������������������������������������������������������������������������������������������� 2
Are There Lots of Examples?�������������������������������������������������������������������������������������������� 2
Where Can You Get the Example Code?��������������������������������������������������������������������������� 4
Where Can You Get Corrections for This Book?���������������������������������������������������������������� 4
Contacting the Author������������������������������������������������������������������������������������������������������� 4
Summary�������������������������������������������������������������������������������������������������������������������������� 4

■Chapter 2: Getting Ready��������������������������������������������������������������������������������������� 5
Getting Ready on Windows����������������������������������������������������������������������������������������������� 5
Installing .NET Core�������������������������������������������������������������������������������������������������������������������������������� 6
Installing Node.js������������������������������������������������������������������������������������������������������������������������������������ 6
Installing Git�������������������������������������������������������������������������������������������������������������������������������������������� 8
Installing Docker������������������������������������������������������������������������������������������������������������������������������������� 8
Installing Visual Studio 2017���������������������������������������������������������������������������������������������������������������� 10
Installing Visual Studio Code���������������������������������������������������������������������������������������������������������������� 11

Getting Ready on Linux�������������������������������������������������������������������������������������������������� 12


Installing .NET Core������������������������������������������������������������������������������������������������������������������������������ 12
Installing Node.js���������������������������������������������������������������������������������������������������������������������������������� 13

vii

www.allitebooks.com
■ Contents

Installing Git������������������������������������������������������������������������������������������������������������������������������������������ 13
Installing Docker����������������������������������������������������������������������������������������������������������������������������������� 14
Installing Visual Studio Code���������������������������������������������������������������������������������������������������������������� 15

Getting Ready on macOS������������������������������������������������������������������������������������������������ 15


Installing .NET Core������������������������������������������������������������������������������������������������������������������������������ 16
Installing Node.js���������������������������������������������������������������������������������������������������������������������������������� 16
Installing Git������������������������������������������������������������������������������������������������������������������������������������������ 17
Installing Docker����������������������������������������������������������������������������������������������������������������������������������� 17
Installing Visual Studio Code���������������������������������������������������������������������������������������������������������������� 19

Summary������������������������������������������������������������������������������������������������������������������������ 19

■Chapter 3: Creating the Project��������������������������������������������������������������������������� 21
Preparing to Create a Project����������������������������������������������������������������������������������������� 21
Creating the Project�������������������������������������������������������������������������������������������������������� 22
Creating the Angular Part of the Project����������������������������������������������������������������������������������������������� 22
Creating the ASP.NET Core MVC Part of the Project������������������������������������������������������������������������������ 24
Configuring the Project������������������������������������������������������������������������������������������������������������������������� 25
Removing Files������������������������������������������������������������������������������������������������������������������������������������� 30
Updating the Controller, Layout, and View�������������������������������������������������������������������������������������������� 30

Running the Project�������������������������������������������������������������������������������������������������������� 32


Understanding the Combined Project and Tools������������������������������������������������������������� 34
Understanding the Structure of the Project������������������������������������������������������������������������������������������ 34
Understanding the Tool Integration������������������������������������������������������������������������������������������������������� 35
Detecting TypeScript Errors������������������������������������������������������������������������������������������������������������������ 38

Summary������������������������������������������������������������������������������������������������������������������������ 41

■Chapter 4: Creating the Data Model�������������������������������������������������������������������� 43
Preparing for This Chapter��������������������������������������������������������������������������������������������� 43
Starting the Data Model������������������������������������������������������������������������������������������������� 44
Preparing the Database Server������������������������������������������������������������������������������������������������������������ 44
Creating the ASP.NET Core MVC Data Model���������������������������������������������������������������������������������������� 46
Starting the Angular Data Model���������������������������������������������������������������������������������������������������������� 54

viii

www.allitebooks.com
■ Contents

Understanding the TypeScript Data Model Classes������������������������������������������������������������������������������ 56


Integrating the Angular Data Model������������������������������������������������������������������������������������������������������ 60
Displaying the Data������������������������������������������������������������������������������������������������������������������������������ 63

Reviewing the Application Structure������������������������������������������������������������������������������ 66


Reviewing the ASP.NET Core MVC Application Structure���������������������������������������������������������������������� 67
Reviewing the Angular Application Structure��������������������������������������������������������������������������������������� 67

Summary������������������������������������������������������������������������������������������������������������������������ 68

■Chapter 5: Creating a Web Service���������������������������������������������������������������������� 69
Preparing for This Chapter��������������������������������������������������������������������������������������������� 70
Introducing a Web Service��������������������������������������������������������������������������������������������� 71
Understanding RESTful Web Services�������������������������������������������������������������������������������������������������� 71
Creating the Web Service��������������������������������������������������������������������������������������������������������������������� 72
Using the Web Service in the Angular Application�������������������������������������������������������������������������������� 74
Loading Related Data��������������������������������������������������������������������������������������������������������������������������� 81

Implementing the GET Method for Multiple Objects������������������������������������������������������� 90


Implementing the Web Service Action Method������������������������������������������������������������������������������������� 90
Querying Multiple Objects in the Angular Application�������������������������������������������������������������������������� 92
Filtering the Data���������������������������������������������������������������������������������������������������������������������������������� 96

Understanding the Structure of the Web Service��������������������������������������������������������� 100


Summary���������������������������������������������������������������������������������������������������������������������� 101

■Chapter 6: Completing the Web Service������������������������������������������������������������ 103
Preparing for This Chapter������������������������������������������������������������������������������������������� 103
Implementing the POST Method����������������������������������������������������������������������������������� 104
Understanding the API Enhancements����������������������������������������������������������������������������������������������� 104
Creating the Data Binding Classes����������������������������������������������������������������������������������������������������� 105
Implementing the Web Service Action Methods��������������������������������������������������������������������������������� 107
Creating Data Objects in the Angular Application������������������������������������������������������������������������������� 110

Implementing the PUT Method������������������������������������������������������������������������������������� 115


Implementing the Web Service Action Methods��������������������������������������������������������������������������������� 115
Replacing Products in the Angular Application����������������������������������������������������������������������������������� 117

ix

www.allitebooks.com
■ Contents

Implementing the PATCH Method��������������������������������������������������������������������������������� 120


Understanding JSON Patch���������������������������������������������������������������������������������������������������������������� 121
Enhancing the Product Binding Target����������������������������������������������������������������������������������������������� 122
Implementing the Web Service Action Method����������������������������������������������������������������������������������� 123
Updating Objects in the Angular Application�������������������������������������������������������������������������������������� 124

Implementing the DELETE Method������������������������������������������������������������������������������� 127


Configuring the Database������������������������������������������������������������������������������������������������������������������� 128
Implementing the Web Service Action Method����������������������������������������������������������������������������������� 130
Deleting Objects in the Angular Application��������������������������������������������������������������������������������������� 131

Summary���������������������������������������������������������������������������������������������������������������������� 134

■Chapter 7: Structuring an Angular Application������������������������������������������������� 135
Preparing for This Chapter������������������������������������������������������������������������������������������� 136
Using the Data Model for Component Cooperation������������������������������������������������������ 137
Creating the Display Component�������������������������������������������������������������������������������������������������������� 137
Creating the Filter Component������������������������������������������������������������������������������������������������������������ 140
Applying the New Components���������������������������������������������������������������������������������������������������������� 141
Understanding the Application Structure�������������������������������������������������������������������������������������������� 143
Adding Another Component���������������������������������������������������������������������������������������������������������������� 143

Understanding Angular Routing����������������������������������������������������������������������������������� 147


Creating the Routing Configuration���������������������������������������������������������������������������������������������������� 147
Applying the Routing Configuration���������������������������������������������������������������������������������������������������� 149
Navigating Using Routes�������������������������������������������������������������������������������������������������������������������� 150
Improving Navigation�������������������������������������������������������������������������������������������������������������������������� 153
Understanding the Application Structure�������������������������������������������������������������������������������������������� 158

Summary���������������������������������������������������������������������������������������������������������������������� 158

■Chapter 8: Creating the Store���������������������������������������������������������������������������� 159
Preparing for This Chapter������������������������������������������������������������������������������������������� 160
Starting the Product Selection Feature������������������������������������������������������������������������ 161
Blocking Out the Feature Components����������������������������������������������������������������������������������������������� 161
Configuring the Angular URL Routes�������������������������������������������������������������������������������������������������� 167
Removing the Layout Header������������������������������������������������������������������������������������������������������������� 167
x

www.allitebooks.com
■ Contents

Displaying the Product List������������������������������������������������������������������������������������������ 168


Understanding the Product List Template Features���������������������������������������������������������������������������� 169

Creating the Category Filter����������������������������������������������������������������������������������������� 171


Enhancing the ASP.NET Core MVC Application������������������������������������������������������������������������������������ 172
Receiving Category Data in the Angular Data Repository������������������������������������������������������������������� 173
Updating the Filter Component and Template������������������������������������������������������������������������������������ 174

Creating the Pagination Controls���������������������������������������������������������������������������������� 176


Creating and Registering a Pagination Service���������������������������������������������������������������������������������� 176
Updating the Pagination Button Component��������������������������������������������������������������������������������������� 178
Paging the Product Data��������������������������������������������������������������������������������������������������������������������� 180

Displaying Ratings�������������������������������������������������������������������������������������������������������� 181


Adding the Font Awesome Package��������������������������������������������������������������������������������������������������� 181
Updating the Rating Component and Template���������������������������������������������������������������������������������� 182
Applying the Rating Component��������������������������������������������������������������������������������������������������������� 184

Summary���������������������������������������������������������������������������������������������������������������������� 186

■Chapter 9: Completing the Angular Store���������������������������������������������������������� 187
Preparing for This Chapter������������������������������������������������������������������������������������������� 187
Creating the Shopping Cart������������������������������������������������������������������������������������������ 188
Extending the Angular Data Model����������������������������������������������������������������������������������������������������� 188
Registering the Cart as a Service������������������������������������������������������������������������������������������������������� 190
Wiring Up the Buttons������������������������������������������������������������������������������������������������������������������������� 191
Creating the Cart Summary Component��������������������������������������������������������������������������������������������� 191
Displaying the Cart Detail������������������������������������������������������������������������������������������������������������������� 193

Storing Carts���������������������������������������������������������������������������������������������������������������� 197


Extending the ASP.NET Core MVC Data Model������������������������������������������������������������������������������������ 198
Creating the Cart Storage Web Service���������������������������������������������������������������������������������������������� 199
Storing and Retrieving Cart Data�������������������������������������������������������������������������������������������������������� 203

Creating the Checkout Process������������������������������������������������������������������������������������ 206


Extending the ASP.NET Core MVC Data Model������������������������������������������������������������������������������������ 206
Creating the ASP.NET Core MVC Web Service������������������������������������������������������������������������������������� 208
Creating the Angular Checkout Process��������������������������������������������������������������������������������������������� 210
xi

www.allitebooks.com
■ Contents

Creating the Checkout Components��������������������������������������������������������������������������������������������������� 213


Registering the Components and Creating the Routes����������������������������������������������������������������������� 220
Storing Checkout Details as Session Data������������������������������������������������������������������������������������������ 223

Summary���������������������������������������������������������������������������������������������������������������������� 226

■Chapter 10: Creating Administration Features�������������������������������������������������� 227
Preparing for This Chapter������������������������������������������������������������������������������������������� 227
Adding Administration Features����������������������������������������������������������������������������������� 229
Creating the Administration Components������������������������������������������������������������������������������������������� 230

Administering Products������������������������������������������������������������������������������������������������ 235


Creating the Editor Component���������������������������������������������������������������������������������������������������������� 236
Creating the Product Table����������������������������������������������������������������������������������������������������������������� 238

Administering Orders��������������������������������������������������������������������������������������������������� 242


Dealing with Request Errors����������������������������������������������������������������������������������������� 244
Creating the Error Handling and Distribution Service������������������������������������������������������������������������� 244
Displaying Errors�������������������������������������������������������������������������������������������������������������������������������� 246
Reporting Validation Errors����������������������������������������������������������������������������������������������������������������� 247

Summary���������������������������������������������������������������������������������������������������������������������� 249

■Chapter 11: Securing the Application���������������������������������������������������������������� 251
Preparing for This Chapter������������������������������������������������������������������������������������������� 251
Restricting Access to Action Methods�������������������������������������������������������������������������� 253
Restricting Access to Suppliers���������������������������������������������������������������������������������������������������������� 253
Restricting Access to Orders�������������������������������������������������������������������������������������������������������������� 253
Restricting Access to Products����������������������������������������������������������������������������������������������������������� 254
Testing the Restrictions���������������������������������������������������������������������������������������������������������������������� 257

Installing and Configuring ASP.NET Core Identity��������������������������������������������������������� 258


Installing the ASP.NET Core Identity NuGet Package�������������������������������������������������������������������������� 258
Creating the Identity Context Class and Seed Data���������������������������������������������������������������������������� 258
Adding Identity to the Application Configuration�������������������������������������������������������������������������������� 260
Creating the Database Migration�������������������������������������������������������������������������������������������������������� 263

xii
■ Contents

Creating the Authentication Controller and View���������������������������������������������������������� 263


Understanding the Conventional Authentication Flow������������������������������������������������������������������������ 265
Authenticating Directly in Angular������������������������������������������������������������������������������������������������������ 267
Testing the Client Authentication Process������������������������������������������������������������������������������������������ 278

Summary���������������������������������������������������������������������������������������������������������������������� 278

■Chapter 12: Preparing for Deployment�������������������������������������������������������������� 279
Preparing for This Chapter������������������������������������������������������������������������������������������� 279
Preventing Cross-Site Request Forgery Attacks���������������������������������������������������������� 280
Enabling Anti-CSRF Tokens����������������������������������������������������������������������������������������������������������������� 281
Sending and Receiving Anti-CSRF Tokens������������������������������������������������������������������������������������������ 283

Creating the Database Migration Command���������������������������������������������������������������� 286


Disabling Logging Messages���������������������������������������������������������������������������������������� 289
Disabling Automatic Angular Builds and Hot Modules������������������������������������������������� 290
Preparing the Angular Startup Sequence������������������������������������������������������������������������������������������� 291

Performing the Production Dry Run����������������������������������������������������������������������������� 292


Preparing the Database���������������������������������������������������������������������������������������������������������������������� 292
Building the Angular Application��������������������������������������������������������������������������������������������������������� 292
Starting the ASP.NET Core MVC Application���������������������������������������������������������������������������������������� 293

Summary���������������������������������������������������������������������������������������������������������������������� 294

Index��������������������������������������������������������������������������������������������������������������������� 295

xiii
About the Author

Adam Freeman is an experienced IT professional who has held senior


positions in a range of companies, most recently serving as chief
technology officer and chief operating officer of a global bank. Now retired,
he spends his time writing and long-distance running.

xv
About the Technical Reviewer

Fabio Claudio Ferracchiati is a senior consultant and a senior analyst/developer using Microsoft
technologies. He works for BluArancio (www.bluarancio.com). He is a Microsoft Certified Solution
Developer for .NET, a Microsoft Certified Application Developer for .NET, a Microsoft Certified Professional,
and a prolific author and technical reviewer. Over the past ten years, he’s written articles for Italian and
international magazines and coauthored more than ten books on a variety of computer topics.

xvii
CHAPTER 1

Understanding Angular
and ASP.NET Core MVC

This book is about using Angular and ASP.NET Core MVC together to build rich applications. Individually,
each of these frameworks is powerful and feature-rich, but using them together combines the dynamic
flexibility of Angular with the solid infrastructure of ASP.NET Core MVC.

Who Is This Book For?


This book is for ASP.NET Core MVC developers who want to add Angular to their projects but don’t know
where to start. Angular is a complex framework that can be overwhelming to learn, and this book provides
a solid foundation by using ASP.NET Core MVC to support an Angular application. By the end of this book,
you will understand how ASP.NET Core MVC and Angular can work together and will have gained a basic
understanding of how Angular development works.

What Does This Book Cover?


This book explains how to use Angular in an ASP.NET Core MVC project. I demonstrate how to create a
Visual Studio or Visual Studio Code project that contains Angular and ASP.NET Core MVC and show you
how to get them working together. I show you how to use Entity Framework Core to store the application
data and ASP.NET Core Identity to authenticate and authorize users. Each ASP.NET Core package adds its
complexities, and I show you how these can be managed to deliver functionality to Angular.
This book also introduces Angular development, focusing on just those features that are required by
most applications. I explain how Angular applications work, how to structure an Angular application, and
how individual building blocks can collaborate to create complex features.
The examples are based around SportsStore, which will be familiar if you have read any of my other
books. SportsStore is a fictional online store that contains the features that most projects need. The
SportsStore examples in this book have been adapted so that I can highlight problems between Angular
and ASP.NET Core MVC and explain how to solve them.

What Doesn’t This Book Cover?


This book is not a deep-dive into Angular or ASP.NET Core MVC. I assume you are already familiar with C#
and ASP.NET Core MVC development, and I describe only the essential Angular features.

© Adam Freeman 2017 1


A. Freeman, Essential Angular for ASP.NET Core MVC, DOI 10.1007/978-1-4842-2916-3_1
Chapter 1 ■ Understanding Angular and ASP.NET Core MVC

I have written other books that provide the deep-dive for each framework. If you are unfamiliar with
ASP.NET Core MVC development, then you should read Pro ASP.NET Core MVC before this book. Once
you have mastered the basics of Angular development, then Pro Angular provides a comprehensive tour of
Angular features.

What Do You Need to Know?


Before reading this book, you should have a working knowledge of ASP.NET Core MVC development and
have a good understanding of JavaScript, HTML, and CSS.

Are There Lots of Examples?


There are loads of examples. The best way to learn is by example, and I have packed as many of them as
I can into this book. To maximize the number of examples in this book, I have adopted a simple convention
to avoid listing the same code over and over again.
To help you navigate the project, the caption for each listing includes the name of the file and the folder
in which it can be found, like in Listing 1-1.

Listing 1-1. The Contents of the CheckoutState.cs File in the Models/BindingTargets Folder
namespace SportsStore.Models.BindingTargets {

    public class CheckoutState  {

        public string name { get; set; }


        public string address { get; set; }
        public string cardNumber { get; set; }
        public string cardExpiry { get; set; }
        public string cardSecurityCode { get; set; }
    }
}

This is a listing from Chapter 9, and the caption tells you that it refers to a file called CheckoutState.cs,
which can be found in the Models/BindingTargets folder. A project that combines Angular and ASP.NET
Core MVC can have a lot of files, and it is important to change the right one. (Don’t worry about the code in
this listing or the folder structure for the moment.)
When I make changes to a file, I show the altered statements in bold, like in Listing 1-2.

Listing 1-2. Adding Methods in the SessionValuesController.cs File in the Controllers Folder
using Microsoft.AspNetCore.Http;
using Microsoft.AspNetCore.Mvc;
using Newtonsoft.Json;
using SportsStore.Models;
using SportsStore.Models.BindingTargets;

namespace SportsStore.Controllers {

    [Route("/api/session")]
    public class SessionValuesController : Controller {

2
Chapter 1 ■ Understanding Angular and ASP.NET Core MVC

        [HttpGet("cart")]
        public IActionResult GetCart() {
            return Ok(HttpContext.Session.GetString("cart"));
        }

        [HttpPost("cart")]
        public void StoreCart([FromBody] ProductSelection[] products) {
            var jsonData = JsonConvert.SerializeObject(products);
            HttpContext.Session.SetString("cart", jsonData);
        }

        [HttpGet("checkout")]
        public IActionResult GetCheckout() {
            return Ok(HttpContext.Session.GetString("checkout"));
        }

        [HttpPost("checkout")]
        public void StoreCheckout([FromBody] CheckoutState data) {
            HttpContext.Session.SetString("checkout",
                JsonConvert.SerializeObject(data));
        }
    }
}

This is another listing from Chapter 9, and the bold statements indicate the changes that you should
make if you are following the example.
I use two different conventions to avoid repeating code in long files. For long class files, I omit methods
and properties, like in Listing 1-3.

Listing 1-3. Restricting Access in the SupplierValuesController.cs File in the Controllers Folder
using Microsoft.AspNetCore.Mvc;
using SportsStore.Models;
using SportsStore.Models.BindingTargets;
using System.Collections.Generic;
using Microsoft.AspNetCore.Authorization;

namespace SportsStore.Controllers {

    [Route("api/suppliers")]
    [Authorize(Roles = "Administrator")]
    public class SupplierValuesController : Controller {
        private DataContext context;

        // ...methods omitted for brevity...


    }
}

This listing from Chapter 11 shows you that a new attribute must be applied to the
SupplierValuesController class but doesn’t list the constructor or other methods, which remain
unchanged.

3
Chapter 1 ■ Understanding Angular and ASP.NET Core MVC

This is the convention that I follow to highlight changes to a region within a file, such as when new
statements are required in a single method in a long file, like in Listing 1-4.

Listing 1-4. Configuring the JSON Serializer in the Startup.cs File in the SportsStore Folder
...
public void ConfigureServices(IServiceCollection services) {
    services.AddDbContext<DataContext>(options =>
        options.UseSqlServer(Configuration
            ["Data:Products:ConnectionString"]));

    services.AddMvc().AddJsonOptions(opts => {
        opts.SerializerSettings.ReferenceLoopHandling
            = ReferenceLoopHandling.Serialize;
        opts.SerializerSettings.NullValueHandling = NullValueHandling.Ignore;
    });
}
...

This is a listing from Chapter 5 that requires a new statement in the ConfigureServices method of the
Startup class, which is defined in the Startup.cs file in the SportsStore folder, while the rest of the file
remains unchanged.

Where Can You Get the Example Code?


You can download the example projects for all the chapters in this book from https://github.com/apress/
esntl-angular-for-asp.net-core-mvc. The download is available without charge and includes all the
supporting resources that are required to re-create the examples without having to type them in. You don’t
have to download the code, but it is the easiest way of experimenting with the examples and makes it easy
to copy and paste code into your own projects.

Where Can You Get Corrections for This Book?


You can find corrections for this book in the Errata file in the GitHub repository for this book
(https://github.com/apress/esntl-angular-for-asp.net-core-mvc).

Contacting the Author


If you have problems making the examples in this chapter work or if you find a problem in the book, then
you can e-mail me at adam@adam-freeman.com, and I will try my best to help. Please check the errata for this
book at https://github.com/apress/esntl-angular-for-asp.net-core-mvc to see if it contains a solution
to your problem before contacting me.

Summary
In this chapter, I described the purpose and content of this book, explained how you can download the
project used for each chapter of the book, and described the conventions I use in the code listings.
In the next chapter, I show you how to set up your development environment in preparation for creating a
combined Angular and ASP.NET Core MVC project in Chapter 3.

4
CHAPTER 2

Getting Ready

In this chapter, I explain how to set up the tools and packages required for Angular and ASP.NET Core MVC
development. There are instructions for Windows, Linux, and macOS, which are the three operating systems
that can be used for .NET Core projects. For quick reference, Table 2-1 lists the packages and explains their
purpose. Follow the instructions for your preferred operating system to install the tools that are required for
the rest of this book.

Table 2-1. The Software Packages Used in This Book

Name Description
Visual Studio Visual Studio is the Windows-only IDE that provides the full-featured development
experience for .NET.
Visual Studio Code Visual Studio Code is a lightweight IDE that can be used on Windows, macOS,
and Linux. It doesn’t provide the full range of features of the Windows-only Visual
Studio product but is well-suited to Angular and ASP.NET Core MVC development.
.NET SDK The .NET Core Software Development Kit includes the .NET runtime for
executing .NET applications and the development tools required to build and test
applications.
Node.js Node.js is used for many client-side development tools, delivered through its
package manager, NPM. It is used to prepare the Angular code for the browser.
Git Git is a revision control system. It is used by some of the NPM packages commonly
used for client-side development.
Docker The Docker package includes the tools required to run applications in containers.
The databases in this book are run inside Docker containers, which makes them
easy to install and manage.

Getting Ready on Windows


The following sections describe the setup required for Windows. All the tools used are available for free,
although some are offered in commercial versions with additional features (but these are not needed for the
examples in this book). If you are using Windows, you can use Visual Studio, which is the traditional IDE for
.NET projects, or Visual Studio Code, which offers a lighter-weight alternative.

© Adam Freeman 2017 5


A. Freeman, Essential Angular for ASP.NET Core MVC, DOI 10.1007/978-1-4842-2916-3_2
Chapter 2 ■ Getting Ready

Installing .NET Core


The .NET Core Software Development Kit (SDK) includes the runtime and development tools needed to
start the development project and perform database operations. To install the .NET Core SDK on Windows,
download the installer from https://download.microsoft.com/download/B/9/F/B9F1AF57-C14A-4670-
9973-CDF47209B5BF/dotnet-dev-win-x64.1.0.4.exe. This URL is for the 64-bit .NET Core SDK, which is
the version that I use throughout this book and which you should install to ensure that you get the expected
results from the examples. Rather than type in a complex URL, you can to go to https://www.microsoft.
com/net/download/core and select the 64-bit installer for the .NET Core SDK. (Microsoft also publishes a
runtime-only installer, but this does not contain the tools that are required for this book.)
Run the installer. Once the install process is complete, open a new PowerShell command prompt and
run the command shown in Listing 2-1 to check that .NET Core is working.

Listing 2-1. Testing .NET Core

dotnet --version

The output from this command will display the latest version of the .NET Core runtime that is installed.
If you have installed only the version specified, this will be 1.0.4.

Installing Node.js
Node.js is a runtime for server-side JavaScript applications and has become a popular platform for
development tools. In this book, Node.js is used by the Angular build tools to compile and prepare the code
that ASP.NET Core MVC will send to the browser.
It is important that you download the same version of Node.js that I use throughout this book. Although
Node.js is relatively stable, there are still breaking API changes from time to time, and they may stop the
examples from working. To install Node.js, download and run the installer from https://nodejs.org/dist/
v6.10.3/node-v6.10.3-x64.msi. This is the installer for version 6.10.3. You may prefer more recent releases
for your projects, but you should stick with the 6.10.3 release for the rest of this book. Run the installer and
ensure that the npm package manager and Add to PATH options are selected, as shown in Figure 2-1.

6
Chapter 2 ■ Getting Ready

Figure 2-1. Installing Node.js on Windows

The NPM package manager is used to download and install Node packages. Adding Node.js to the PATH
ensures that you can use the Node.js runtime at the command prompt just by typing node. Once you have
completed the installation, open a new command prompt and run the command shown in Listing 2-2.

Listing 2-2. Checking That Node.js Is Installed Correctly

node -v

You should see the following version number displayed: v6.9.2. If the installation has been successful,
then proceed to the “Installing NPM Packages” section.

Installing Bower
Once you have installed Node, run the command shown in Listing 2-3 to install the Bower package, which
is used to manage client-side packages.

Listing 2-3. Installing the Bower Package

npm install -g bower@1.8.0

7
Chapter 2 ■ Getting Ready

Installing Git
The Git revision control tool is required to download the client-side packages used by the Bower package
installed in the previous section. Download and run the installer from https://git-scm.com/downloads.
When the installation is complete, open a new command prompt and run the command in Listing 2-4 to
check that Git is installed and working properly.

Listing 2-4. Checking the Git Install

git --version

This command prints out the version of the Git package that has been installed. At the time of writing,
the latest version of Git for Windows is 2.13.0.

Installing Docker
Docker is available in Community and Enterprise editions, the difference being the support and
certifications offered for the Enterprise edition. Both editions provide the same set of core features, and I use
the free Docker Community edition throughout this book.
Go to https://store.docker.com/editions/community/docker-ce-desktop-windows, click the
Get Docker CE for Windows (stable) link, and run the installer that is downloaded. Docker will start
automatically when the installation is complete. You may be prompted to enable Hyper-V, as shown in
Figure 2-2. Click the Ok button.

Figure 2-2. Enabling Hyper-V

Once the installation has completed, right-click the Docker icon in the taskbar and select Settings from
the pop-up menu. Navigate to the Advanced section and increase the memory allocated to Docker so that
it is at least 3500MB, which is the minimum required to run SQL Server, as shown in Figure 2-3. Click the
Apply button to save the configuration change and restart Docker with the new configuration.

8
Chapter 2 ■ Getting Ready

Figure 2-3. Assigning memory to Docker

Once Docker has restarted, open a new PowerShell command prompt and run the command shown in
Listing 2-5 to check that the installation was successful.

Listing 2-5. Checking That Docker Is Working

docker run --rm hello-world

Docker will download the files it needs to run a simple Hello World application. Docker will write out
messages like these, indicating that everything is working as expected (the command produces more output
than is shown here, but this is the important part):

...
Unable to find image 'hello-world:latest' locally
latest: Pulling from library/hello-world

c04b14da8d14: Pull complete


Digest: sha256:0256e8a36e2070f7bf2d0b0763dbabdd67798512411de4cdcf9431a1feb60fd9
Status: Downloaded newer image for hello-world:latest

Hello from Docker!


This message shows that your installation appears to be working correctly.
...

9
Chapter 2 ■ Getting Ready

Installing Visual Studio 2017


Visual Studio is the traditional development environment for ASP.NET Core and Entity Framework Core
projects. It offers a full-featured development experience, but it can be resource hungry. Consider using
Visual Studio Code if you want a lighter-weight development experience, which I describe in the next
section.
Download the installer from https://www.visualstudio.com/vs. There are different editions of
Visual Studio 2017 available, but the free Community edition is sufficient for the examples in this book. Run
the installer and ensure that the .NET Core Cross-Platform Development workload is selected, as shown in
Figure 2-4.

Figure 2-4. Selecting the Visual Studio packages

Click the Install button to begin the process of downloading and installing the Visual Studio features.

Adding the Visual Studio Extensions


Two Visual Studio extensions are essential for working on ASP.NET Core MVC projects. The first is called
Razor Language Service, and it provides IntelliSense support for tag helpers when editing Razor views. The
second is called Project File Tools, and it provides automatic completion for editing .csproj files, which
simplifies the process of adding NuGet packages to projects.
Select Extensions and Updates from the Visual Studio Tools menu, select the Online section, and use
the search box to locate the extensions. Click the Download button, as shown in Figure 2-5, to download the
extension files.

10
Chapter 2 ■ Getting Ready

Figure 2-5. Downloading Visual Studio extensions

Click the Close button to dismiss the list of extensions and then close Visual Studio, which will trigger
the installation process for the extensions you downloaded. You will be prompted to accept the changes that
will be made and the license terms, as shown in Figure 2-6. Click the Modify button to install the extensions.
Once the process has completed, you can start Visual Studio and begin development.

Figure 2-6. Installing Visual Studio extensions

Installing Visual Studio Code


Visual Studio Code is a lightweight editor that doesn’t have all the features of the full Visual Studio product
but works across platforms and is perfectly capable of handling ASP.NET Core MVC and Entity Framework
Core projects.

11
Chapter 2 ■ Getting Ready

I find myself increasingly using Visual Studio Code, in part because it means I can use the same IDE on
different platforms and in part because it is more responsive and less resource hungry than Visual Studio 2017.
To install Visual Studio code, visit http://code.visualstudio.com and click the download link for
Windows. Run the installer and then start Visual Studio Code.
Once the installation is complete, start Visual Studio Code, click the Extensions button in the sidebar,
and locate and install the C# package, which provides support for working with C# code files.

Getting Ready on Linux


The following sections describe the setup required for Linux. Microsoft has taken Linux support for .NET
Core seriously because of its popularity as a deployment platform, which makes it a good platform for
development, too. .NET Core supports a range of Linux distributions, and I have used Ubuntu 16.04 for this
book, which is the current Long-Term Support (LTS) release at the time of writing.

Installing .NET Core


The .NET Core Software Development Kit (SDK) includes the runtime and development tools needed to
start the development project and perform database operations. The easiest way to install .NET Core on
Linux is to visit https://www.microsoft.com/net/core, select your distribution from the list, and copy and
paste the commands into a command prompt to ensure you don’t mistype any configuration arguments.
To install .NET Core SDK on Ubuntu 16.04, open a command prompt and enter the commands in
Listing 2-6 to configure package management so that Microsoft packages can be installed.

Listing 2-6. Preparing Package Management for .NET Core

sudo sh -c 'echo "deb [arch=amd64] https://apt-mo.trafficmanager.net/repos/dotnet-release/


xenial main" > /etc/apt/sources.list.d/dotnetdev.list'
sudo apt-key adv --keyserver hkp://keyserver.ubuntu.com:80 --recv-keys 417A0893
sudo apt-get update

Run the command shown in Listing 2-7 to download and install the .NET Core SDK package. It is
important that you use the version number shown in the listing so that you get the expected results from the
examples in this book.

Listing 2-7. Installing the .NET Core Package

sudo apt-get install dotnet-dev-1.0.4

Once the package has been downloaded and installed, run the command shown in Listing 2-8 to check
that .NET Core is installed and working.

Listing 2-8. Testing the .NET Core Package

dotnet --version

The output from this command will display the latest version of the .NET Core runtime that is installed.
If you have installed only the version specified, this will be 1.0.4.

12
Chapter 2 ■ Getting Ready

Installing Node.js
N The easiest way to install Node.js is through a package manager, using the procedures described at
https://nodejs.org/en/download/package-manager. For Ubuntu, I ran the commands shown in
Listing 2-9 to download and install Node.js.

Listing 2-9. Installing Node.js on Ubuntu

curl -sL https://deb.nodesource.com/setup_6.x | sudo -E bash -


sudo apt-get install nodejs

Once you have installed Node.js, run the command shown in Listing 2-10 to check that the installation
was successful and that you have the right version.

Listing 2-10. Checking That Node.js Is Installed Correctly

node -v

You should see that version 6.x.x is installed. Version 6.10.3 is the latest at the time of writing, but there
may be updates pushed into the package manager feed for version 6.x by the time you read this.

Installing Bower
Once you have installed Node, run the command shown in Listing 2-11 to install the Bower package, which
is used to manage client-side packages.

Listing 2-11. Installing the Bower Package

sudo npm install -g bower@1.8.0

Installing Git
Git is already installed on most Linux distributions. If you want to install the latest version, then consult the
installation instructions for your distribution at https://git-scm.com/download/linux. For Ubuntu, I used
the command in Listing 2-12.

Listing 2-12. Installing Git

sudo apt-get install git

Once you have completed the installation, open a new command prompt and run the command in
Listing 2-13 to check that Git is installed and available.

Listing 2-13. Checking the Git Install

git --version

13
Chapter 2 ■ Getting Ready

This command prints out the version of the Git package that was installed. At the time of writing, the
latest version of Git for Linux is 2.7.4.

Installing Docker
To install Docker on Linux, visit https://www.docker.com/community-edition, select the distribution that
you are using from the list, and follow the installation instructions, copying and pasting the commands to
avoid typos.
For Ubuntu 16.04, open a new command prompt and enter the commands in Listing 2-14 to configure
the package manager and install the prerequisite packages that Docker relies on.

Listing 2-14. Preparing the Package Manger and Installing Prerequisite Packages

sudo apt-get -y install apt-transport-https ca-certificates curl


curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo apt-key add -
sudo add-apt-repository \
       "deb [arch=amd64] https://download.docker.com/linux/ubuntu \
       $(lsb_release -cs) stable"
sudo apt-get update

To install Docker, run the command shown in Listing 2-15.

Listing 2-15. Installing Docker

sudo apt-get -y install docker-ce

Once Docker is installed, run the commands shown in Listing 2-16 so that you can use Docker without
sudo.

Listing 2-16. Configuring Docker So That Root Access Is Not Required

sudo groupadd docker


sudo usermod -aG docker $USER

Log out of your current session and log back in again for the commands in Listing 2-16 to take effect.
Once you have logged back in, run the command shown in Listing 2-17 to check that the installation has
been successful.

Listing 2-17. Checking That Docker Is Working

docker run --rm hello-world

14
Chapter 2 ■ Getting Ready

Docker will download the files it needs to run a simple Hello World application. Docker will write out
messages like these, indicating that everything is working as expected (the command produces more output
than is shown here, but this is the important part):

...
Unable to find image 'hello-world:latest' locally
latest: Pulling from library/hello-world

c04b14da8d14: Pull complete


Digest: sha256:0256e8a36e2070f7bf2d0b0763dbabdd67798512411de4cdcf9431a1feb60fd9
Status: Downloaded newer image for hello-world:latest

Hello from Docker!


This message shows that your installation appears to be working correctly.
...

Once you have confirmed that Docker is installed and working properly, then run the command shown
in Listing 2-18 to install Docker Compose, which is required for the examples in this book.

Listing 2-18. Installing Docker Compose

sudo curl -L https://github.com/docker/compose/releases/download/1.13.0/docker-compose-


`uname -s`-`uname -m` -o /usr/local/bin/docker-compose
sudo chmod +x /usr/local/bin/docker-compose

Once the installation is complete, run the command shown in Listing 2-19 to check that Docker
Compose works as expected.

Listing 2-19. Checking Docker Compose

docker-compose --version

If the installation has been successful, you will see this response: docker-compose version 1.13.0,
build 1719ceb.

Installing Visual Studio Code


To install Visual Studio code, visit http://code.visualstudio.com and click the download link for your
platform. Run the installer and then start Visual Studio Code, which will present a standard integrated
development environment.
Once the installation is complete, start Visual Studio Code, click the Extensions button in the sidebar,
and locate and install the C# package, which provides support for working with C# code files.

Getting Ready on macOS


The following sections describe the setup required for macOS, which provides a good platform .NET
development through Visual Studio Code. Although my main development machine runs Windows, my
laptop runs macOS, and I use it for development when traveling.

15
Chapter 2 ■ Getting Ready

Installing .NET Core


Before installing .NET Core, open a new command prompt and run the command in Listing 2-20 to install
the HomeBrew package manager.

Listing 2-20. Installing the Package Manager

/usr/bin/ruby -e \
  "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

Once installation is complete, run the commands shown in Listing 2-21 to install the OpenSSL library,
which is a prerequisite for some .NET Core features.

Listing 2-21. Installing the OpenSSL Package

brew install openssl


mkdir -p /usr/local/lib
ln -s /usr/local/opt/openssl/lib/libcrypto.1.0.0.dylib /usr/local/lib/
ln -s /usr/local/opt/openssl/lib/libssl.1.0.0.dylib /usr/local/lib/

To install .NET Core on macOS, download the SDK installer from https://go.microsoft.com/
fwlink/?linkid=848823. This URL is for the .NET Core SDK version I use throughout this book and that you
should install to ensure you get the expected results from the examples.
Run the installer. Once the process is complete, open a Terminal window and run the command shown
in Listing 2-22 at the prompt to check that .NET Core is working.

Listing 2-22. Testing .NET Core

dotnet --version

The output from this command will display the latest version of the .NET Core runtime that is installed.
If you have installed only the version specified, this will be 1.0.4.

Installing Node.js
To install Node.js on macOS, download and run the installer available from https://nodejs.org/dist/
v6.10.3/node-v6.10.3.pkg. Once the installation is complete, open a new Terminal window and run the
command shown in Listing 2-23 at the command prompt once the installer has completed.

Listing 2-23. Checking That Node.js Is Installed Correctly

node -v

You should will see the following version number displayed: v6.10.3.

16

www.allitebooks.com
Chapter 2 ■ Getting Ready

Installing Bower
Once you have installed Node, run the command shown in Listing 2-24 to install the Bower package, which
is used to manage client-side packages.

Listing 2-24. Installing the Bower Package

sudo npm install -g bower@1.8.0

Installing Git
The Git revision control tool is required to download the client-side packages used by the Bower package
installed in the previous section. Download and run the installer from https://git-scm.com/downloads.
When the installation is complete, open a new command prompt and run the command in Listing 2-25 to
check that Git is installed and working properly.

Listing 2-25. Checking the Git Install

git --version

This command prints out the version of the Git package that has been installed. At the time of writing,
the latest version of Git for macOS is 2.13.0.

Installing Docker
Go to https://store.docker.com/editions/community/docker-ce-desktop-mac, click the Get Docker for
CE Mac (stable) link, and run the installer that is downloaded. Drag the whale to the Applications folder, as
shown in Figure 2-7.

Figure 2-7. Installing Docker

17
Chapter 2 ■ Getting Ready

Open Launchpad and click the Docker icon to perform the setup process. Once Docker has started,
click the Docker menu bar icon and select Preferences from the pop-up menu.
Navigate to the Advanced section and increase the memory allocated to Docker so that it is at least
3500MB, which is the minimum required to run SQL Server, as shown in Figure 2-8. Click the Apply button
to save the configuration change and restart Docker with the new configuration.

Figure 2-8. Assigning memory to Docker

Click Apply & Restart to change the memory and restart the Docker process. When Docker is running
again, dismiss the Preferences window, open a new Terminal window, and run the command shown in
Listing 2-26 to check that the installation was successful.

Listing 2-26. Checking That Docker Is Working

docker run --rm hello-world

18
Chapter 2 ■ Getting Ready

Docker will download the files it needs to run a simple Hello World application. Docker will write out
messages like these, indicating that everything is working as expected (the command produces more output
than is shown here, but this is the important part):

...
Unable to find image 'hello-world:latest' locally
latest: Pulling from library/hello-world

c04b14da8d14: Pull complete


Digest: sha256:0256e8a36e2070f7bf2d0b0763dbabdd67798512411de4cdcf9431a1feb60fd9
Status: Downloaded newer image for hello-world:latest

Hello from Docker!


This message shows that your installation appears to be working correctly.
...

Installing Visual Studio Code


Developing for .NET on macOS is done using Visual Studio Code. To install Visual Studio Code, visit
http://code.visualstudio.com, click the download link, run the installer, and then start Visual Studio Code.
Once the installation is complete, start Visual Studio Code, click the Extensions button in the sidebar,
and locate and install the C# package, which provides support for working with C# code files.

Summary
In this chapter, I explained how to install the tools and packages that are required to use Angular and ASP.
NET Core MVC, and in the next chapter, I show you how to create a project that combines them.

19
CHAPTER 3

Creating the Project

In this chapter, I show you how to create a project that contains ASP.NET Core MVC and Angular
applications, which means both parts of the project can be developed using Visual Studio or Visual Studio
Code. This project forms the foundation for the rest of this book, as I explain how to use Angular and
ASP.NET Core MVC to create a rich web application. Table 3-1 puts the combined project in context.

Table 3-1. Putting a Combined Project in Context

Question Answer
What is it? A combined project includes Angular and ASP.NET Core MVC in a single
folder structure.
Why is it useful? A combined project makes it easy to develop both parts of an application
using a single IDE, such as Visual Studio, as well as simplifying the process
of using an ASP.NET Core MVC web service to provide data to Angular.
How is it used? The Angular application is created first, followed by ASP.NET Core MVC.
Additional NuGet packages are used to allow both parts of the project to
work together at runtime.
Are there any pitfalls or A combined project makes managing the development process easier, but
limitations? you still need a good working knowledge of both Angular and ASP.NET Core
MVC to create an effective application.
Are there any alternatives? You can develop the Angular and ASP.NET Core MVC parts of the
application separately, although this tends to complicate the development
process.

■■Tip You can download the complete project for this chapter from https://github.com/apress/esntl-
angular-for-asp.net-core-mvc. This is also where you will find updates and corrections for this book.

Preparing to Create a Project


There are several different ways to create a project that combines Angular and ASP.NET Core MVC. The
approach that I use in this book relies on the @angular/cli package, used in conjunction with the .NET tools
for creating a new MVC project.

© Adam Freeman 2017 21


A. Freeman, Essential Angular for ASP.NET Core MVC, DOI 10.1007/978-1-4842-2916-3_3
Chapter 3 ■ Creating the Project

USING THE DOTNET NEW ANGULAR COMMAND

Microsoft provides a template that can be used to create a similar project structure (which you can
use by running dotnet new angular at the command line). The process I use in this chapter is more
manual, but it means you will understand how the different building blocks fit together and have a
better idea of where to look when you don’t get the results you expect. Once you are familiar with how
Angular and ASP.NET Core MVC can work together, using this template is perfectly reasonable, with the
caveat that you are unable to specify the versions of ASP.NET Core MVC and Angular that are used in
the project.

The @angular/cli package provides a command-line interface that simplifies the process of creating
and working with a new Angular project. During development, the Angular code is compiled, packaged, and
delivered to the browser using webpack, a popular tool for creating JavaScript bundles that contain only the
code required to run a project.
To create a project that combines Angular and ASP.NET Core MVC, I start with @angular/cli and access
he underlying webpack configuration, which can then be used to integrate the Angular tools and libraries
into the ASP.NET Core project.
To start this process, open a new command prompt and run the command in Listing 3-1 to install the
@angular/cli package. If you are using Linux or macOS, you may need to use sudo to run this command.

Listing 3-1. Installing the @angular/cli Package

npm install --global @angular/cli@1.0.2

This command takes a while to run because the package has a lot of dependencies, all of which have to
be downloaded and installed.

Creating the Project


The process for creating a combined Angular and ASP.NET Core MVC project requires careful attention:
both development platforms have their tools and conventions, and getting them to work together requires
a specific set of steps to be performed in order. In the sections that follow, I walk through the process and
explain each step.

■■Tip You must follow each step exactly as shown, without missing a step or changing the order. If you get
stuck, then you can download a ready-made project from the source code repository, which is linked from the
Apress.com page for this book.

Creating the Angular Part of the Project


The first step is to create a new Angular project, which is done using the @angular/cli package installed
in Listing 3-1. Open a new command prompt, navigate to the folder where you keep your development
projects, and run the command shown in Listing 3-2.

22
Chapter 3 ■ Creating the Project

Listing 3-2. Creating an Angular Project

ng new SportsStore --skip-git --skip-commit --skip-tests --source-dir ClientApp

The ng command is provided by the @angular/cli package, and ng new creates a new Angular project.
The arguments that start with --skip tell @angular/cli not to perform some of the standard setup steps that
are usually included in projects, and the --source-dir argument specifies the name of the folder that will
contain the source code for the Angular application. The Angular code lives in a folder called ClientApp in
projects that combine Angular and ASP.NET Core MVC.
The command in Listing 3-2 creates a folder called SportsStore that contains the tools and
configuration files for an Angular project, along with some placeholder code so that the tools and project
structure can be tested. The ng new command downloads a large number of packages, which can take a long
time to complete.
The rest of the setup is performed inside the project folder, so run the command shown in Listing 3-3 to
change the working directory.

Listing 3-3. Changing the Working Directory

cd SportsStore

Getting the Angular tools to work with the .NET tools requires additional NPM packages. Run the
command shown in Listing 3-4 to install these packages.

Listing 3-4. Adding NPM Packages to the Project

npm install --save-dev webpack@2.3.2 aspnet-prerendering@2.0.3 aspnet-webpack@1.0.28


webpack-hot-middleware@2.17.1

Microsoft provides some of these NPM packages, and they are used to set up and run the Angular
development tools inside the ASP.NET Core runtime. These packages work directly with webpack, which is
usually hidden when working with projects created using @angular/cli. Run the command shown in
Listing 3-5 in the SportsStore folder to create a webpack configuration file that can be used to build and
run the project, a process known as ejecting the project from @angular/cli.

Listing 3-5. Ejecting the Project

ng eject

The ejection process updates the package.json file, which NPM uses to keep track of the packages used
by the project. In some cases, the ejection process will add additional NPM packages to the project.json file,
so run the command shown in Listing 3-6 to ensure that any new packages are downloaded and installed.

Listing 3-6. Updating the NPM Packages

npm install

23
Chapter 3 ■ Creating the Project

Creating the ASP.NET Core MVC Part of the Project


Once the Angular project has been set up, the next step is to create an MVC project in the same SportsStore
folder. Run the command shown in Listing 3-7 in the SportsStore folder to create a basic MVC project.

Listing 3-7. Creating the ASP.NET Core MVC Project

dotnet new mvc --language C# --auth None --framework netcoreapp1.1

Run the command shown in Listing 3-8 in the SportsStore folder to add a Microsoft package to the
project. This NuGet package is the .NET counterpart to the NPM packages installed earlier and is used to
integrate the Angular tools into Visual Studio.

Listing 3-8. Adding a NuGet Package to the Project

dotnet add package Microsoft.AspNetCore.SpaServices --version 1.1.0

The application will be stored using Microsoft SQL Server and accessed using Entity Framework Core.
Run the commands shown in Listing 3-9 in the SportsStore folder to add the NuGet packages required to
add these features to the application.

Listing 3-9. Adding the Data NuGet Packages to the Project

dotnet add package Microsoft.EntityFrameworkCore --version 1.1.1


dotnet add package Microsoft.EntityFrameworkCore.Design --version 1.1.1
dotnet add package Microsoft.EntityFrameworkCore.SqlServer --version 1.1.1

Not all the required packages can be added using the command-line tools. Open the project using
Visual Studio or Visual Studio Code. If you are using Visual Studio, then select File ➤ Open ➤ Project/Solution,
navigate to the SportsStore folder, and select the SportsStore.csproj file. To edit the NuGet packages,
right-click the SportsStore project item in the Solution Explorer, select Edit SportsStore.csproj from the pop-
up menu, and make the changes shown in Listing 3-10.
If you are using Visual Studio Code, open the SportsStore project, click SportsStore.csproj in the file
list to open the file for editing, and make the changes shown in Listing 3-10.

Listing 3-10. Adding NuGet Packages in the SportsStore.csproj File in the SportsStore Folder
<Project Sdk="Microsoft.NET.Sdk.Web">
  <PropertyGroup>
    <TargetFramework>netcoreapp1.1</TargetFramework>
  </PropertyGroup>
  <ItemGroup>
    <PackageReference Include="Microsoft.AspNetCore" Version="1.1.1" />
    <PackageReference Include="Microsoft.AspNetCore.Mvc" Version="1.1.2" />
    <PackageReference Include="Microsoft.AspNetCore.SpaServices" Version="1.1.0" />
    <PackageReference Include="Microsoft.AspNetCore.StaticFiles" Version="1.1.1" />
    <PackageReference Include="Microsoft.EntityFrameworkCore" Version="1.1.1" />
    <PackageReference Include="Microsoft.EntityFrameworkCore.Design"
         Version="1.1.1" />

24
Chapter 3 ■ Creating the Project

    <PackageReference Include="Microsoft.EntityFrameworkCore.SqlServer"
         Version="1.1.1" />
    <PackageReference Include="Microsoft.Extensions.Logging.Debug" Version="1.1.1" />
    <PackageReference Include="Microsoft.VisualStudio.Web.BrowserLink"
         Version="1.1.0" />

    <DotNetCliToolReference Include="Microsoft.EntityFrameworkCore.Tools"
         Version="1.0.0" />
    <DotNetCliToolReference Include="Microsoft.EntityFrameworkCore.Tools.DotNet"
         Version="1.0.0" />
  </ItemGroup>
</Project>

If you are using Visual Studio, the new packages will be downloaded when you save the SportsStore.
csproj file. If you are using Visual Studio Code, use a command prompt to run the command shown in
Listing 3-11 in the SportsStore folder.

Listing 3-11. Restoring Packages

dotnet restore

Configuring the Project


Now that the project foundation is in place, it is time to configure the different parts of the application to
work together.

Preparing the Project ( Visual Studio)


If you are using Visual Studio, select File ➤ Open Project/Solution, navigate to the SportsStore folder, and
select the SportsStore.csproj file. Select File ➤ Save All and save the SportsStore.sln file, which you can
use to open the project in the future.
Select Project ➤ SportsStore Properties, navigate to the Debug section of the options window, and
ensure that IIS Express is selected for the Launch field, as shown in Figure 3-1.

25
Chapter 3 ■ Creating the Project

Figure 3-1. Configuring the application

Ensure that the Launch URL button is selected and enter http://localhost:5000 in the App URL field,
as shown in Figure 3-1. Finally, click the Add button to create an environment variable called ASPNETCORE_
ENVIRONMENT, if it doesn’t already exist, with a value of Development. Save the changes and close the
properties window.

Creating and Editing the Configuration Files


Regardless of the IDE you are using, add a TypeScript file called boot.ts to the SportsStore/ClientApp
folder, with the code shown in Listing 3-12.

Listing 3-12. The Contents of the boot.ts File in the ClientApp Folder
import { enableProdMode } from "@angular/core";
import { platformBrowserDynamic } from "@angular/platform-browser-dynamic";
import { AppModule } from "./app/app.module";

const bootApplication = () => {


    platformBrowserDynamic().bootstrapModule(AppModule);
};

26
Chapter 3 ■ Creating the Project

if (module["hot"]) {
    module["hot"].accept();
    module["hot"].dispose(() => {
        const oldRootElem = document.querySelector("app-root");
        const newRootElem = document.createElement("app-root");
        oldRootElem.parentNode.insertBefore(newRootElem, oldRootElem);
        platformBrowserDynamic().destroy();
    });
}

if (document.readyState === "complete") {


    bootApplication();
} else {
    document.addEventListener("DOMContentLoaded", bootApplication);
}

This file is responsible for loading the Angular application and responding to changes to the client-side
code. Next, edit the Startup.cs file to change the code in the Configure method, as shown in Listing 3-13.
The additions enable the integration between the ASP.NET Core and Angular development tools.

Listing 3-13. Enabling Middleware in the Startup.cs File in the SportsStore Folder
using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.Extensions.Logging;
using Microsoft.AspNetCore.SpaServices.Webpack;

namespace SportsStore {
    public class Startup {
        public Startup(IHostingEnvironment env) {
            var builder = new ConfigurationBuilder()
              .SetBasePath(env.ContentRootPath)
              .AddJsonFile("appsettings.json", optional: false, reloadOnChange: true)
              .AddJsonFile($"appsettings.{env.EnvironmentName}.json", optional: true)
              .AddEnvironmentVariables();
            Configuration = builder.Build();
        }

        public IConfigurationRoot Configuration { get; }

        public void ConfigureServices(IServiceCollection services) {


            services.AddMvc();
        }

        public void Configure(IApplicationBuilder app,


                IHostingEnvironment env, ILoggerFactory loggerFactory) {
            loggerFactory.AddConsole(Configuration.GetSection("Logging"));
            loggerFactory.AddDebug();

27
Discovering Diverse Content Through
Random Scribd Documents
1.C. The Project Gutenberg Literary Archive Foundation (“the
Foundation” or PGLAF), owns a compilation copyright in the
collection of Project Gutenberg™ electronic works. Nearly all the
individual works in the collection are in the public domain in the
United States. If an individual work is unprotected by copyright
law in the United States and you are located in the United
States, we do not claim a right to prevent you from copying,
distributing, performing, displaying or creating derivative works
based on the work as long as all references to Project
Gutenberg are removed. Of course, we hope that you will
support the Project Gutenberg™ mission of promoting free
access to electronic works by freely sharing Project Gutenberg™
works in compliance with the terms of this agreement for
keeping the Project Gutenberg™ name associated with the
work. You can easily comply with the terms of this agreement
by keeping this work in the same format with its attached full
Project Gutenberg™ License when you share it without charge
with others.

1.D. The copyright laws of the place where you are located also
govern what you can do with this work. Copyright laws in most
countries are in a constant state of change. If you are outside
the United States, check the laws of your country in addition to
the terms of this agreement before downloading, copying,
displaying, performing, distributing or creating derivative works
based on this work or any other Project Gutenberg™ work. The
Foundation makes no representations concerning the copyright
status of any work in any country other than the United States.

1.E. Unless you have removed all references to Project


Gutenberg:

1.E.1. The following sentence, with active links to, or other


immediate access to, the full Project Gutenberg™ License must
appear prominently whenever any copy of a Project
Gutenberg™ work (any work on which the phrase “Project
Gutenberg” appears, or with which the phrase “Project
Gutenberg” is associated) is accessed, displayed, performed,
viewed, copied or distributed:

This eBook is for the use of anyone anywhere in the


United States and most other parts of the world at no
cost and with almost no restrictions whatsoever. You may
copy it, give it away or re-use it under the terms of the
Project Gutenberg License included with this eBook or
online at www.gutenberg.org. If you are not located in
the United States, you will have to check the laws of the
country where you are located before using this eBook.

1.E.2. If an individual Project Gutenberg™ electronic work is


derived from texts not protected by U.S. copyright law (does not
contain a notice indicating that it is posted with permission of
the copyright holder), the work can be copied and distributed to
anyone in the United States without paying any fees or charges.
If you are redistributing or providing access to a work with the
phrase “Project Gutenberg” associated with or appearing on the
work, you must comply either with the requirements of
paragraphs 1.E.1 through 1.E.7 or obtain permission for the use
of the work and the Project Gutenberg™ trademark as set forth
in paragraphs 1.E.8 or 1.E.9.

1.E.3. If an individual Project Gutenberg™ electronic work is


posted with the permission of the copyright holder, your use and
distribution must comply with both paragraphs 1.E.1 through
1.E.7 and any additional terms imposed by the copyright holder.
Additional terms will be linked to the Project Gutenberg™
License for all works posted with the permission of the copyright
holder found at the beginning of this work.

1.E.4. Do not unlink or detach or remove the full Project


Gutenberg™ License terms from this work, or any files
containing a part of this work or any other work associated with
Project Gutenberg™.

1.E.5. Do not copy, display, perform, distribute or redistribute


this electronic work, or any part of this electronic work, without
prominently displaying the sentence set forth in paragraph 1.E.1
with active links or immediate access to the full terms of the
Project Gutenberg™ License.

1.E.6. You may convert to and distribute this work in any binary,
compressed, marked up, nonproprietary or proprietary form,
including any word processing or hypertext form. However, if
you provide access to or distribute copies of a Project
Gutenberg™ work in a format other than “Plain Vanilla ASCII” or
other format used in the official version posted on the official
Project Gutenberg™ website (www.gutenberg.org), you must,
at no additional cost, fee or expense to the user, provide a copy,
a means of exporting a copy, or a means of obtaining a copy
upon request, of the work in its original “Plain Vanilla ASCII” or
other form. Any alternate format must include the full Project
Gutenberg™ License as specified in paragraph 1.E.1.

1.E.7. Do not charge a fee for access to, viewing, displaying,


performing, copying or distributing any Project Gutenberg™
works unless you comply with paragraph 1.E.8 or 1.E.9.

1.E.8. You may charge a reasonable fee for copies of or


providing access to or distributing Project Gutenberg™
electronic works provided that:

• You pay a royalty fee of 20% of the gross profits you


derive from the use of Project Gutenberg™ works
calculated using the method you already use to calculate
your applicable taxes. The fee is owed to the owner of
the Project Gutenberg™ trademark, but he has agreed to
donate royalties under this paragraph to the Project
Gutenberg Literary Archive Foundation. Royalty payments
must be paid within 60 days following each date on
which you prepare (or are legally required to prepare)
your periodic tax returns. Royalty payments should be
clearly marked as such and sent to the Project Gutenberg
Literary Archive Foundation at the address specified in
Section 4, “Information about donations to the Project
Gutenberg Literary Archive Foundation.”

• You provide a full refund of any money paid by a user


who notifies you in writing (or by e-mail) within 30 days
of receipt that s/he does not agree to the terms of the
full Project Gutenberg™ License. You must require such a
user to return or destroy all copies of the works
possessed in a physical medium and discontinue all use
of and all access to other copies of Project Gutenberg™
works.

• You provide, in accordance with paragraph 1.F.3, a full


refund of any money paid for a work or a replacement
copy, if a defect in the electronic work is discovered and
reported to you within 90 days of receipt of the work.

• You comply with all other terms of this agreement for


free distribution of Project Gutenberg™ works.

1.E.9. If you wish to charge a fee or distribute a Project


Gutenberg™ electronic work or group of works on different
terms than are set forth in this agreement, you must obtain
permission in writing from the Project Gutenberg Literary
Archive Foundation, the manager of the Project Gutenberg™
trademark. Contact the Foundation as set forth in Section 3
below.

1.F.
1.F.1. Project Gutenberg volunteers and employees expend
considerable effort to identify, do copyright research on,
transcribe and proofread works not protected by U.S. copyright
law in creating the Project Gutenberg™ collection. Despite these
efforts, Project Gutenberg™ electronic works, and the medium
on which they may be stored, may contain “Defects,” such as,
but not limited to, incomplete, inaccurate or corrupt data,
transcription errors, a copyright or other intellectual property
infringement, a defective or damaged disk or other medium, a
computer virus, or computer codes that damage or cannot be
read by your equipment.

1.F.2. LIMITED WARRANTY, DISCLAIMER OF DAMAGES - Except


for the “Right of Replacement or Refund” described in
paragraph 1.F.3, the Project Gutenberg Literary Archive
Foundation, the owner of the Project Gutenberg™ trademark,
and any other party distributing a Project Gutenberg™ electronic
work under this agreement, disclaim all liability to you for
damages, costs and expenses, including legal fees. YOU AGREE
THAT YOU HAVE NO REMEDIES FOR NEGLIGENCE, STRICT
LIABILITY, BREACH OF WARRANTY OR BREACH OF CONTRACT
EXCEPT THOSE PROVIDED IN PARAGRAPH 1.F.3. YOU AGREE
THAT THE FOUNDATION, THE TRADEMARK OWNER, AND ANY
DISTRIBUTOR UNDER THIS AGREEMENT WILL NOT BE LIABLE
TO YOU FOR ACTUAL, DIRECT, INDIRECT, CONSEQUENTIAL,
PUNITIVE OR INCIDENTAL DAMAGES EVEN IF YOU GIVE
NOTICE OF THE POSSIBILITY OF SUCH DAMAGE.

1.F.3. LIMITED RIGHT OF REPLACEMENT OR REFUND - If you


discover a defect in this electronic work within 90 days of
receiving it, you can receive a refund of the money (if any) you
paid for it by sending a written explanation to the person you
received the work from. If you received the work on a physical
medium, you must return the medium with your written
explanation. The person or entity that provided you with the
defective work may elect to provide a replacement copy in lieu
of a refund. If you received the work electronically, the person
or entity providing it to you may choose to give you a second
opportunity to receive the work electronically in lieu of a refund.
If the second copy is also defective, you may demand a refund
in writing without further opportunities to fix the problem.

1.F.4. Except for the limited right of replacement or refund set


forth in paragraph 1.F.3, this work is provided to you ‘AS-IS’,
WITH NO OTHER WARRANTIES OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO WARRANTIES OF
MERCHANTABILITY OR FITNESS FOR ANY PURPOSE.

1.F.5. Some states do not allow disclaimers of certain implied


warranties or the exclusion or limitation of certain types of
damages. If any disclaimer or limitation set forth in this
agreement violates the law of the state applicable to this
agreement, the agreement shall be interpreted to make the
maximum disclaimer or limitation permitted by the applicable
state law. The invalidity or unenforceability of any provision of
this agreement shall not void the remaining provisions.

1.F.6. INDEMNITY - You agree to indemnify and hold the


Foundation, the trademark owner, any agent or employee of the
Foundation, anyone providing copies of Project Gutenberg™
electronic works in accordance with this agreement, and any
volunteers associated with the production, promotion and
distribution of Project Gutenberg™ electronic works, harmless
from all liability, costs and expenses, including legal fees, that
arise directly or indirectly from any of the following which you
do or cause to occur: (a) distribution of this or any Project
Gutenberg™ work, (b) alteration, modification, or additions or
deletions to any Project Gutenberg™ work, and (c) any Defect
you cause.
Section 2. Information about the Mission
of Project Gutenberg™
Project Gutenberg™ is synonymous with the free distribution of
electronic works in formats readable by the widest variety of
computers including obsolete, old, middle-aged and new
computers. It exists because of the efforts of hundreds of
volunteers and donations from people in all walks of life.

Volunteers and financial support to provide volunteers with the


assistance they need are critical to reaching Project
Gutenberg™’s goals and ensuring that the Project Gutenberg™
collection will remain freely available for generations to come. In
2001, the Project Gutenberg Literary Archive Foundation was
created to provide a secure and permanent future for Project
Gutenberg™ and future generations. To learn more about the
Project Gutenberg Literary Archive Foundation and how your
efforts and donations can help, see Sections 3 and 4 and the
Foundation information page at www.gutenberg.org.

Section 3. Information about the Project


Gutenberg Literary Archive Foundation
The Project Gutenberg Literary Archive Foundation is a non-
profit 501(c)(3) educational corporation organized under the
laws of the state of Mississippi and granted tax exempt status
by the Internal Revenue Service. The Foundation’s EIN or
federal tax identification number is 64-6221541. Contributions
to the Project Gutenberg Literary Archive Foundation are tax
deductible to the full extent permitted by U.S. federal laws and
your state’s laws.

The Foundation’s business office is located at 809 North 1500


West, Salt Lake City, UT 84116, (801) 596-1887. Email contact
links and up to date contact information can be found at the
Foundation’s website and official page at
www.gutenberg.org/contact

Section 4. Information about Donations to


the Project Gutenberg Literary Archive
Foundation
Project Gutenberg™ depends upon and cannot survive without
widespread public support and donations to carry out its mission
of increasing the number of public domain and licensed works
that can be freely distributed in machine-readable form
accessible by the widest array of equipment including outdated
equipment. Many small donations ($1 to $5,000) are particularly
important to maintaining tax exempt status with the IRS.

The Foundation is committed to complying with the laws


regulating charities and charitable donations in all 50 states of
the United States. Compliance requirements are not uniform
and it takes a considerable effort, much paperwork and many
fees to meet and keep up with these requirements. We do not
solicit donations in locations where we have not received written
confirmation of compliance. To SEND DONATIONS or determine
the status of compliance for any particular state visit
www.gutenberg.org/donate.

While we cannot and do not solicit contributions from states


where we have not met the solicitation requirements, we know
of no prohibition against accepting unsolicited donations from
donors in such states who approach us with offers to donate.

International donations are gratefully accepted, but we cannot


make any statements concerning tax treatment of donations
received from outside the United States. U.S. laws alone swamp
our small staff.
Please check the Project Gutenberg web pages for current
donation methods and addresses. Donations are accepted in a
number of other ways including checks, online payments and
credit card donations. To donate, please visit:
www.gutenberg.org/donate.

Section 5. General Information About


Project Gutenberg™ electronic works
Professor Michael S. Hart was the originator of the Project
Gutenberg™ concept of a library of electronic works that could
be freely shared with anyone. For forty years, he produced and
distributed Project Gutenberg™ eBooks with only a loose
network of volunteer support.

Project Gutenberg™ eBooks are often created from several


printed editions, all of which are confirmed as not protected by
copyright in the U.S. unless a copyright notice is included. Thus,
we do not necessarily keep eBooks in compliance with any
particular paper edition.

Most people start at our website which has the main PG search
facility: www.gutenberg.org.

This website includes information about Project Gutenberg™,


including how to make donations to the Project Gutenberg
Literary Archive Foundation, how to help produce our new
eBooks, and how to subscribe to our email newsletter to hear
about new eBooks.

You might also like