In this tutorial I want to share the process of creating GraphQL server using Nestjs and deploy the server in Firebase.

Requirements:

You need to have installed in your environment:

Nodejs v10.18.1 Firebase v7.12.1 Nestjs v6.6.4

Create Nestjs Project

Let's create a new Nestjs project by running the following command

$ nest new graphql-nestjs-firebase-demo

By the end, you should have a project structure like this:

project structure

Install GQL

Nestjs have a powerful module that helps developers integrate in a easy way GraphQL in an Nestjs project, let’s run the following command in order to install the packages you’ll need.

$ npm i --save @nestjs/graphql graphql-tools graphql apollo-server-express

Configure GQL

In order to use GraphQL in a Nestjs project we need to initialize the module in the main module.

app.module.ts

The authoSchemaFile: true means that the schema will be generated in memory

Create your Resolver

$ nest generate resolver app --flat

The --flat config option means the resolver will be created in the root directory of the project.

Create your first Query

app.resolver.ts

Now let’s try to run for the first time our server. If you try to run the server without creating at least one Query resolver, your server will fail because the GraphQL module will try to look into the code and generate the schema based on the resolvers. To start the server we can execute in the terminal the following command:

$ npm start

After the server is up and running you’ll be able to access to localhost and you should see something like this:

graphql playground

The GraphQL playground is a tool that is going to be accessible in development mode and will allow you to try the queries and mutations. If you type in the left panel the following code:

query {

hello

}

you should receive a response in the right panel similar to:

{

"data": {

"hello": "Hello World!"

}

}

Install Firebase Tools

In order to use Firebase it’s necessary to have installed in your system the firebase tools:

$ npm i -g firebase-tools

Add firebase functions to project

Now let’s add Firebase to your project. In order to deploy the Nestjs Server in Firebase we are going to use Firebase functions, you may initialize the project by running:

$ firebase init

firebase init command output

Select “Functions” using the arrows and space keys, then press enter, once done you’ll be able to create or select a new project in Firebase.

create a new project in firebase

add a name to your firebase project

Select “typescript” as your default language and select “no” to install the dependencies. Once finished your project should look like this:

project folder after initializing a firebase project with functions

Firebase creates a functions subproject because it expect to use this folder as the entry point for the deployment process but we don't want to have a project inside our own project so we are going to change the structure.

Install firebase dependencies in our project.

$ npm i firebase-admin firebase-functions

With the objective to test our functions in local we need to install also another package:

$ npm i -D firebase-functions-test

Change project structure and entry point

Now we need to do some changes in our code:

In our src folder create a new file called server.ts, and add the following code:

server.ts

Now that we have a method implemented that give us back our Nest app, we can use it into our Firebase function but before, let’s use it to run our app locally modifying our main.ts

main.ts

After this modifications, try to run the project again and you should be able to access the playground without problems.

Create Firebase entry point

Firebase uses the field “main” in the package.json file to get the entry point for your functions, also it is necessary to indicate the source of our code in firebase.json

package.json

firebase.json

Now that we had configured our firebase entry point we need to actually create it. In the src folder let’s create an index.ts file so we can add our firebase function.

index.ts

As you can see we are using the previously created app method from our server.ts and using the express server instance generated to handle all requests received in the firebase function.

Now that we create our own entry point for the firebase function we can remove the functions folder:

$ rm -rf functions

Serve firebase function

Now it’s time to test if our firebase function works locally but first let’s compile our code:

$ npm run build

Now that our project is compiled let’s run it

$ firebase serve --only functions

output in command line tool

If everything was good you should see in the console your firebase function running. To test it you can try to run the following code in your command line tool:

$ curl --request POST --url 'http://localhost:5000/graphql-nestjs-firebase-demo/us-central1/api/graphql' --header 'Content-Type: application/json' --data '{"operationName":null,"variables":{},"query":"{

hello

}

"}'

Your response should be like:

{"data":{"hello":"Hello World!"}}

Deploy Firebase function

Now it’s time to deploy your firebase function in Firebase, It is important to notice that in the package.json file the node engine is “10” because Firebase does not support the newest version of nodejs. Let’s run the following command:

$firebase deploy --only functions

If everything was good in the deployment process you should see in the console something like this:

output in command line tool

To verify if the function is running properly you can go to the firebase console and check in the functions tab if the app is running.

Source Code

You can find the source code to this project here.

Conclusion

In this tutorial I’ve showed you how to create and deploy a GraphQL server in a firebase function using Nestjs. I hope you found this article useful.