Connect with Vercel

Set up a Vercel Project

On the Vercel Dashboard, create a new project. You can also leverage one of Vercel's templates, such as Next.js Boilerplate, which facilitates the development of your web application.

Connect to your SingleStore Helios Workspace

Once your Vercel project is deployed, perform the following tasks:

1. Go to the SingleStore Helios - Vercel integration page, and select Add Integration.

2. On the Add SingleStoreDB Cloud dialog, select your Vercel account in which to add the integration, and then select Continue.

   

3. Select the project(s) to integrate with your workspace, and then select Continue.

   

4. Verify the permissions, and select Add Integration.

   

5. In the dialog that opens, log in or sign up for the Cloud Portal.

6. If you have already created a workspace, select it from the Workspace list, and then select Connect. If there aren't any active workspaces, you can create a new workspace and then select it.

Your Vercel project is now connected to your workspace. The project will now have three additional environment variables (go to <your_project> -> Settings -> Environment Variables):

• SINGLESTORE_WORKSPACE_HOST

• SINGLESTORE_WORKSPACE_USERNAME

• SINGLESTORE_WORKSPACE_PASSWORD

Build and Deploy

There are multiple options available for building and deploying your application. For example, for a basic deployment, you can use Vercel Functions and create a serverless function. The following example connects to SingleStore Helios from a serverless function using the Data API:

var SingleStoreClient = require('@singlestore/http-client');
var instance = SingleStoreClient.ApiClient.instance;

var BasicAuth = instance.authentications['BasicAuth'];
BasicAuth.username = process.env.SINGLESTORE_WORKSPACE_USERNAME;
BasicAuth.password = process.env.SINGLESTORE_WORKSPACE_PASSWORD;

instance.basePath = 'https://' + process.env.SINGLESTORE_WORKSPACE_HOST;

// Get the API handle. var api = new SingleStoreClient.HttpApi();

export default function handler(req, res) {
    api.rows({
        queryInput: {
            database: 'mydatabase',
            sql: 'SELECT * FROM purchases LIMIT 200;'
        }
    }).then(dbResponse => {
        res.send(dbResponse.results[0].rows);
    }).catch(err => {
        res.send(err);
    });
}

Refer to Connect to Your Workspace for additional connectivity options that suit your application stack.