Connecting to StepZen

Once you have your API is up and running, you will likely want to connect to it via your application's frontend or an API testing tool like Postman. In order to do so, you'll need to use your StepZen API key. This is available on your My Account page. Let's look at how to use it.

Getting Your Endpoint URL

The stepzen start command will automatically open a browser with a GraphiQL editor to test your API. The editor will already have a connection open to the project that is deployed on StepZen. It will also provide you the URL you'll need to connect to your API via your frontend application or API testing tool in two places:

1. The URL of the deployed endpoint is displayed on the bottom-right-hand side of the GraphiQL editor. You can see an example highlighted below:

   

2. Via the command-line where stepzen start is running. You'll see a message like the following:

Deploying to StepZen...... done

Successfully deployed api/example at 4:22:19 PM

Your endpoint is available at https://myaccount.stepzen.net/api/example/__graphql

Next, let's see how to use that endpoint in your frontend or via popular API testing tools.

You can see a full list of all the APIs you've deployed to StepZen by running stepzen list schemas from the command line.

Your StepZen API Key

In order to connect to StepZen from outside of the GraphiQL editor launched by stepzen start, you'll need to use your API key. This is always accessible via your My Account page, which has three items:

1. Your account name - your endpoint URL will always start with your account name in the following format https://[account-name].stepzen.net.
2. Your admin API key - this key is allows to make changes to your account such as deploying new or updated code to StepZen. This is the key you enter when logging into the StepZen CLI that allows commands like stepzen start to automatically deploy your API and connect to it.
3. Your API key - this key is needed to connect to the APIs you deploy to StepZen. Querying your APIs whether via code or via an API testing tool will require that you pass this key via the Authorization header in the following format:

Authorization: apikey MY_API_KEY

In the following sections, we'll look at some examples of connecting to a StepZen API.

Calling Your StepZen API From JavaScript

It's important to keep in mind that you do not want to expose your API key publicly. Therefore, although you technically can, you do not want to call your StepZen API directly from the browser as anyone could inspect the request and then have access to your API key. The best way to handle the API call is on the server or via a serverless function, either of which can be written in Node.js.

Connecting API Testing Tools

Although stepzen start provides a very helpful GraphiQL editor for testing your API, you may want to use some other popular tools.

Connecting Postman

To set up Postman to connect to your StepZen GraphQL API, select the Authorization option beneath the endpoint URL. For the Type, choose "API Key". Fill in the options as follows:

• Key: Authorization
• Value: apikey MY_API_KEY
• Add to: Header

It should look like the image below:

Once your Authorization settings are set, you'll be able to add your GraphQL query under Body > GraphQL.

Connecting GraphQL Playground

GraphQL Playground is a popular desktop GraphQL IDE.

Open a new workspace using a URL endpoint in the following format:

https://[ACCOUNT_NAME].stepzen.net/api/example/__graphql

Click on the "HTTP Headers" tab at the bottom of the Playground, and configure your API Key as follows:

{
"Authorization": "apikey MY_API_KEY"
}

It should look like the image below:

Now you will be able to inspect and query your GraphQL endpoint running on StepZen.