Building modern applications with GraphQL and Blazor

@michael_staib

https://bit.ly/graphql-github

If you like what we do give us a star on GitHub

{
  me {
    name
  }
}

{
  "me": {
    "name": "Michael Staib"
  }
}

{
  me {
    name
  }
}

{
  me {
    name
    image {
      width
      height
      url
    }
  }
}

{
  "me": {
    "name": "Michael Staib",
    "image": {
      "width": 200,
      "height": 300,
      "url": "http://some/images/123.png"          
    }
  }
}

{
  me {
    name
    image {
      width
      height
      url
    }
  }
}

{
  me {
    name
    lastSeen
    friends {
      name
      lastSeen
    }
  }
}

{
  "me": {
    "name": "Michael Staib",
    "lastSeen": "2018-05-19T18:45",
    "friends": [
      {
        "name": "Rafael Staib",
        "lastSeen": "2018-05-24T12:37"
      },
      {
        "name": "Pascal Senn",
        "lastSeen": "2018-06-07T17:13"
      }
    ]
  }
}

{
  me {
    name
    lastSeen
    friends {
      name
      lastSeen
    }
  }
}

{
  "me": {
    "name": "Michael Staib",
    "lastSeen": "2018-05-19T18:45",
    "friends": [
      {
        "name": "Rafael Staib",
        "lastSeen": "2018-05-24T12:37"
      },
      {
        "name": "Pascal Senn",
        "lastSeen": "2018-06-07T17:13"
      }
    ]
  }
}

{
  me {
    ... PersonInfo
    friends {
      ... PersonInfo
    }
  }
}

fragment PersonInfo on Person {
  name
  lastSeen
}

One Endpoint
One Request
No over- or under-fetching
Type System
Predictable

.NET Core in the browser
Existing code can be re-used
Less JavaScript
More .NET
Near Native Performance
WebAssembly
OpenSource

C# Code and Razor Views

.NET Assemblies

Mono WebAssembly Runtime

Shadow DOM

WebAssembly VM

JavaScript

compiles

DOM

Blazor Server - Shipped with .NET Core 3.0
Blazor WebAssembly - Shipped in May 2020
Blazor PWA & Electron - Previews with .NET 5
Blazor Desktop with .NET 6
Blazor Hybrid Apps with .NET 7

The State of Blazor

Blazor with .NET 6

• lavaScript initializers
• JavaScript modules per
component
• Infer generic types from parent
• Generic type constraints
• Handle large binary data
• Remove Signal message size
limitations
• Required parameters
• Handle query string parameters
• Influence the HTML head
• SVG support

• NET Hot reload
• State persistence during
prerendering
• Error boundaries
• WebAssembly AOT
• Runtime relinking
• Native dependencies
• Smaller download size
• Dynamic component rendering
• Render components from IS
• Custom event args