Gain insights into Blazor to build single page applications using C#. Delve into Razor syntax, components, JavaScript interoperability, security, and progressive web applications to enhance your full stack development skills.

blazor.tar.gz

Single Project Setup

Hosted app

Project Setup With DB

This course is a comprehensive overview of Blazor, a web framework used to build single page applications using C# on the server and client sides instead of JavaScript. The course is particularly beneficial for those developers who want to build full stack web applications using Microsoft technologies. 

In this course, you’ll start by learning various Blazor project types and when to use them. Next, you’ll cover Razor syntax and components, parameter passing between components, JavaScript interoperability, dynamic and prerendered Razor components, and CSS isolation. You’ll finish with learning how to secure Blazor applications, ahead of time compilation, and progressive web applications.

By the time you’re done with the course, you will be well on your way to become a full stack developer who can build dynamic and powerful web applications using the state of the art, modern technologies covered in this course.

Building Web Applications with Blazor

import React from 'react';
import { shallow, configure } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

configure({ adapter: new Adapter() });

import HelloWorld from './app';

var TestResult = function() {
    this.succeeded = false;
    this.reason = "";
    this.input = "";
    this.expected_output = "";
    this.actual_output = "";
}

export const executeTests = function() {

  var results = [];

  result = new TestResult();
  result.input = 'HelloWorld Component';
  result.expected_output = "span containing text 'Hello World'"

  let wrapper = shallow(<HelloWorld />);

  // Call your Challenge function here.

  let type = wrapper.type();
  let testSuccessful = true;
  let failureReason;

  if (type !== 'span') {
    testSuccessful = false;
    failureReason = "You need to render exactly one span HTML element";
  } else if (wrapper.props().children != "Hello World") {
     testSuccessful = false;
     failureReason = "You have rendered wrong message in your span element";
  }

  result.actual_output = wrapper.html();

  if (testSuccessful) {
    result.succeeded = true;
    result.reason = "Succeeded"
  } else {
    result.succeeded = false;
    result.reason = failureReason;
  }

  results.push(result);

  return results;
}


Introduction

Blazor Project Templates

Managing Blazor UI With Razor Components

Passing Parameters to Razor Components

Interoperating With JavaScript

Advanced Rendering Concepts in Blazor

Securing Blazor Applications

Advanced Blazor Features

Conclusion

Appendix

Basic Parameters in Blazor

Adding class parameters to Razor components