Skip to main content

GraphQL–Strawberry Shake GraphQL client

Until recently I always used the GraphQL.Client as the GraphQL client of my choice. This client is straightforward and easy-to-use.

For a new project I decided to give Strawberry Shake a try. Strawberry Shake was created by Chilicream, the creators of the HotChocolate GraphQL backend for .NET.

Strawberry Shake is using a different approach as the GraphQL.Client as it heavily relies on code generation and looks similar to the Apollo GraphQL client from a design point of view.

I mostly followed the “Get started” documentation to get the Strawberry Shake client up and running, but I didn’t get everything up and running immediatelly so I’ll add some extra detail on the points where I got into trouble.

Add the CLI tools

  • We start by adding the Strawberry Shake CLI tools
  • Open the folder that contains the project where you want to add the Strawberry Shake GraphQL client.
  • Now wee need to first create a dotnet tool-manifest.

dotnet new tool-manifest

Getting ready...

The template "Dotnet local tool manifest file" was created successfully.

  • After doing that we can install the Strawberry Shake tools locally.

dotnet tool install StrawberryShake.Tools –local

You can invoke the tool from this directory using the following commands: 'dotnet tool run dotnet-graphql' or 'dotnet dotnet-graphql'.

Tool 'strawberryshake.tools' (version '12.0.1') was successfully installed. Entry is added to the manifest file C:\projects\graphqlclientexample\.config\dotnet-tools.json.

Add the NuGet packages

  • Now we need to add some NuGet packages:

dotnet add package StrawberryShake.Transport.Http

dotnet add package StrawberryShake.CodeGeneration.CSharp.Analyzers

dotnet add package Microsoft.Extensions.DependencyInjection

dotnet add package Microsoft.Extensions.Http

Add the GraphQL client

  • Next step is to add a client using the following command  dotnet graphql init {{ServerUrl}} -n {{ClientName}}.

dotnet graphql init https://example.graphql.be/graphql/ -n ExampleClient

Download schema started.

Download schema completed in 399 ms

Client configuration started.

Client configuration completed in 137 ms

  •  A .graphqlrc.json is generated together with a schema.graphql file and a schema.extensions.graphql file:

    Add a GraphQL query

    • At this moment no code is generated yet. Therefore we have to write our first graphql query.
    • Create a new .graphql file and write the query you want to execute
    • The next step mentioned in the documentation is that you only need to compile your code to let the code generation do its work. But nothing happened when I tried to do that.
    • I discovered that I had to take one extra step. I needed to set the build action for the graphql file to GraphQL compiler:

    • Now when I build my code a Generated folder appears containing an ExampleClient. StrawberryShake.cs file.
    • Register the generated client in your Startup.cs file:

    Use the generated query

    • To use the query I first need to inject the generated client:
    • Then I can invoke the query in a type safe manner:

    Popular posts from this blog

    DevToys–A swiss army knife for developers

    As a developer there are a lot of small tasks you need to do as part of your coding, debugging and testing activities.  DevToys is an offline windows app that tries to help you with these tasks. Instead of using different websites you get a fully offline experience offering help for a large list of tasks. Many tools are available. Here is the current list: Converters JSON <> YAML Timestamp Number Base Cron Parser Encoders / Decoders HTML URL Base64 Text & Image GZip JWT Decoder Formatters JSON SQL XML Generators Hash (MD5, SHA1, SHA256, SHA512) UUID 1 and 4 Lorem Ipsum Checksum Text Escape / Unescape Inspector & Case Converter Regex Tester Text Comparer XML Validator Markdown Preview Graphic Color B

    Help! I accidently enabled HSTS–on localhost

    I ran into an issue after accidently enabling HSTS for a website on localhost. This was not an issue for the original website that was running in IIS and had a certificate configured. But when I tried to run an Angular app a little bit later on http://localhost:4200 the browser redirected me immediately to https://localhost . Whoops! That was not what I wanted in this case. To fix it, you need to go the network settings of your browser, there are available at: chrome://net-internals/#hsts edge://net-internals/#hsts brave://net-internals/#hsts Enter ‘localhost’ in the domain textbox under the Delete domain security policies section and hit Delete . That should do the trick…

    Azure DevOps/ GitHub emoji

    I’m really bad at remembering emoji’s. So here is cheat sheet with all emoji’s that can be used in tools that support the github emoji markdown markup: All credits go to rcaviers who created this list.