ASP.NET Core with GraphQL using .NET Boxed

GraphQL is something I have been meaning to look into for awhile, but haven’t found the time. Muhammad Rehan Saeed recent release of .NET Boxed, which is a rebranding of his ASP.NET Core Boilerplate templates, contains a template for GraphQL. This brought GraphQL back to the front of my mind so this post is going to walk through installing and using .NET Boxed to get a GraphQL project up and running.

Template Installation

As with all templates, installation is very easy using the .NET CLI. Open a command prompt and enter the following command.

The * at the end of the command is just making sure the latest version gets installed. After the installation is done you will get a list of all the template you have installed. The two new ones provided by .NET Boxed are highlighted in the screenshot.

Project Creation

For this post, we will be creating a project using the graphql template. Both of the templates provided by .NET Boxed have a lot of optional flags that can be used configure the resulting project. Make sure to run the help command for the template you are using to see if there are any option you want to set. For example, the following command would list all the options for the GraphQL template.

Create and navigate to the directory you want the new project to be created in and then run the following command to create the project with the default setting with the exception of turning off HTTPS. Not something you want to turn off for a production application, but it reduces the complexity of the initial exploration.

With the project created run the following command from the same directory to open it in Visual Studio Code.

Some Project Notes

The project generation creates a ReadMe.html in the root of the project. Make sure and check it out. It has a list of pre-requisites needed for the project as well as a lot of good information on general good practices.

We aren’t going to dig too far into the project itself in this post, but it is helpful to know where the data lives and what it looks like for when we are trying out some GraphQL queries. The backing data is in a static class found in the Repositories/Database.cs file.

The data is Star Wars themed and consists of two lists of characters one for droid and one for humans which get combined into a list of characters. The following is the  Database class for reference.

Try it out

When you run the project in development mode (the default) it will show a GraphQL playground which is made available by GraphQL.NET. It looks like the following.

Box 1 is the area where you enter the query you want to execute against the GraphQL backend. Box 2 is the play button which sends the query to the backend. Finally, box 3 is where the results of the query are displayed.

The following query is asking for ID, Name, and Appears In properties for the human that matches the provided ID.

On our sample data, the query returns the following.

Now let’s try creating a new human. Clear the query area and enter the following query.

If you tried to run the above it would fail. For this query to work we need to define what  $human is. You do this in the Query Variables area which is right below box 1 in the screenshot above. Enter the following and hit the play button.

This will result in the following. Your ID will be different of course.

Wrapping Up

The above information is enough to get started playing with GraphQL with ASP.NET Core. There is a lot more that I want to dig into so look for more posts on these topics. The code can be found here.

Also published on Medium.

2 thoughts on “ASP.NET Core with GraphQL using .NET Boxed”

  1. This is a great post showing how to get started with GraphQL project template. GraphQL.NET (which is what the project template uses) NuGet packages labelled as alpha but it’s really more of a release candidate according to it’s main contributor. That said, there are a few features I want to implement before I’d be willing to use it in production. You can see what they are on GitHub here:

    .NET is lagging behind other languages a bit when it comes to GraphQL support, it would be great to get more visibility and contributions to GraphQL.NET.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.