O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Blazor Quick Start Guide

Book Description

Work with the fundamentals of Blazor to create rich and interactive web application

Key Features

  • First book about the new .NET-based framework for client and server side applications
  • Explore Blazor, and create client side applications with C#
  • Build rich, modern single-page application (SPA) using .NET end-to-end across server and client

Book Description

Blazor is an open source .NET web framework based on C#, Razor, and HTML that runs in the browser with WebAssembly. It simplifies web development by allowing us to write .NET-based web apps that run client-side in web browsers. We can take advantage of our existing knowledge of C# to write both client - side and server-side applications, and have a full stack .NET development experience.

This book introduces you to the core concepts of Blazor, and how to apply these to a real-world web app with the help of Entity Framework Core and SQL Server.

The book begins with an introduction to Blazor and its advantages. Then, you will learn about the building blocks of Blazor, including Blazor components, data binding, dependency injection, routing, and JavaScript Interop.

Moving on, you will learn how to create a Single Page Application (SPA) using Blazor. You will also use the Entity Framework Core and ADO.NET with Blazor to extend your application's data-handling capabilities. Toward the end, you will deploy the application on IIS and Azure.

By the end of this book, you will have a solid foundation working with the Blazor framework as it stands today. Using it, you will be able to create rich and interactive web applications using Blazor on the frontend, and SQL Server as a database provider

What you will learn

  • Familiarize yourself with the core concepts of Blazor
  • Develop applications with Blazor
  • Blazor applications with Visual Studio code and Command Line Interface (CLI)
  • Create a Tic-Tac-Toe game with Blazor
  • Design and build a calculator app with Blazor
  • Create an ASP.NET core-hosted Blazor application using SQL Server 2017
  • Use EF Core and ADO.NET to access data in a Blazor application
  • Deploy a Blazor application on IIS and Azure

Who this book is for

This book is for people who want to explore .NET's latest framework, Blazor. If you want to move beyond concepts and learn how to put Blazor to work, this book is for you. Knowledge of C# and basic web development experience is required.

Downloading the example code for this book You can download the example code files for all Packt books you have purchased from your account at http://www.PacktPub.com. If you purchased this book elsewhere, you can visit http://www.PacktPub.com/support and register to have the files e-mailed directly to you.

Table of Contents

  1. Title Page
  2. Copyright and Credits
    1. Blazor Quick Start Guide
  3. Dedication
  4. Packt Upsell
    1. Why subscribe?
    2. Packt.com
  5. Foreword
  6. Contributors
    1. About the author
    2. About the reviewer
    3. Packt is searching for authors like you
  7. Preface
    1. Who this book is for
    2. What this book covers
    3. To get the most out of this book
      1. Download the example code files
      2. Code in action
      3. Conventions used
    4. Get in touch
      1. Reviews
  8. An Introduction to Blazor
    1. Technical requirements
    2. What is Blazor?
    3. What is WebAssembly?
    4. How does Blazor run in the browser?
    5. Why should we use Blazor?
    6. Features of Blazor
    7. Creating our first Blazor application
      1. Prerequisites
      2. Steps to create the Blazor application
    8. Understanding the Blazor boot process
    9. HTML generation by Blazor
    10. How Blazor generates render trees
    11. Demo execution of a Blazor application
    12. Summary
  9. Exploring Blazor Concepts
    1. Technical requirements
    2. Creating a sample Blazor application
    3. Components in Blazor
      1. Creating a component in Blazor
        1. Using a single file
        2. Using a code-behind file
      2. Using a component within another component
    4. Data binding in Blazor
      1. One-way data binding
      2. Two-way data binding
    5. Event handling with Blazor
    6. Life cycle methods of Blazor
    7. Layouts in Blazor
    8. Dependency injection in Blazor
    9. Routing in Blazor
      1. Defining the route for a page
      2. Parameterized routing
      3. Navigation between components
      4. NavLink component
    10. Rendering raw HTML
    11. Summary
  10. A Deep Dive into JavaScript Interop
    1. Technical requirements
    2. What is JavaScript Interop?
    3. Creating an example Blazor application
    4. How to call a JavaScript function from C# code
      1. Defining JavaScript methods
      2. Calling a JavaScript function without parameters
      3. Calling a JavaScript function with parameters
    5. Capturing references to HTML elements
    6. Calling a C# method from JavaScript code
    7. Using third-party JS libraries
    8. Summary
  11. Getting Started with Blazor Using Visual Studio 2017
    1. Technical requirements
    2. Setting up the Blazor development environment using Visual Studio 2017
    3. Creating a Tic-Tac-Toe game using Blazor
      1. Creating the components
      2. Implementing the game logic
      3. Creating the application's UI 
      4. Adding a navigation link
      5. Running the application
    4. Creating a basic calculator app using Blazor
      1. Creating the component
      2. Creating the UI of the application 
      3. Adding the calculator logic
      4. Running the application
    5. Summary
  12. Creating a Single Page Application Using Blazor
    1. Creating the database objects
      1. Creating the table
      2. Creating the stored procedures
        1. Adding an employee record
        2. Updating an employee record
        3. Deleting an employee record
        4. Fetching all employee records
        5. Fetching cities records
    2. Creating the Blazor application using VS 2017
    3. Scaffolding the model using EF Core's database-first approach
    4. Creating the data access layer for the application
      1. Data access using EF Core
        1. Fetching all employee records
        2. Adding a new employee record
        3. Updating an employee record
        4. Fetching the records of an employee
        5. Deleting an employee record
        6. Fetching the list of cities
      2. Data access using ADO.NET
        1. Fetching all employee records
        2. Adding a new employee record
        3. Updating an employee record
        4. Fetching the record of an employee
        5. Deleting an employee record
        6. Fetching the list of cities
    5. Adding the API controller to the application
    6. Summary
  13. Extending your Application
    1. Technical requirements
    2. Creating the Blazor component
    3. Adding references for JS Interop
    4. Adding code to the component
      1. Coding the EmployeeData.cshtml.cs file
      2. Coding the EmployeeData.cshtml file
    5. Adding the navigation link to our component
    6. Execution demo
    7. Summary
  14. Hosting and Deployment
    1. Deploying a Blazor app on IIS
      1. Prerequisites
        1. Installing IIS
        2. Installing the URL rewrite module
        3. Installing .NET Core hosting bundle
      2. Publishing the Blazor app to IIS
      3. Configuring IIS
      4. Configuring the DNS host
      5. Execution demo
      6. Troubleshoot IIS hosting issues
    2. Deploying the Blazor app on Azure
      1. Creating a resource group
      2. Creating database objects
        1. Creating a SQL database and database server
        2. Creating DB tables and stored procedures
      3. Setting the DB connection string
      4. Publishing application to Azure
    3. Summary
  15. Other Books You May Enjoy
    1. Leave a review - let other readers know what you think