Community
Getting Started
Here is an overview of how to get the Text Editor SDK up and running in your app in just a few steps.
Create an application
From My Appsopen in new window, create an application and give it a name, such as "Grammarbot" or "Grammarbot Development." You can edit your application name any time, and set a public display name later if you’re allowing users to connect their Grammarly accounts.
Clients
Your application will be created with a web client by default. Each client represents a unique ID and credentials for accessing Grammarly's services from either web or desktop. You can add clients using the Add New Client button in the left menu.
Install the Text Editor SDK
On the configuration page for each client, you’ll see a quick start guide for the Text Editor SDK. The guide contains installation commands and code snippets you can copy. With just a few lines of code, you can add the Grammarly Text Editor Plugin to the desired HTML elements in your app.
In the following docs, you’ll find more installation and usage options for each platform we support:
- Text Editor SDK for JavaScript
- Text Editor SDK for React
- Text Editor SDK for Vue
- Text Editor SDK for Electron (desktop clients)
Set up credentials
Below the quick start guide for each client, you'll find the credentials. The client ID is the unique public identifieropen in new window for your application. You will need it when initializing the Text Editor SDK in your application. The code samples in the quick start already contain this client ID.
Depending on the type of client you've selected, you'll see additional options in the Credentials section.
Origins (web clients)
For a web client, you can configure the allowed originsopen in new window. Grammarly will only allow the origins that you configure here to communicate with Grammarly's cloud using your application's client ID. You can add multiple allowed origins for your application. Each origin must include the protocol (http:// or https://) and domain; you may optionally specify a port.
Origins can also include the wildcard character * to permit all requests originating from your domain, for example https://*.example.com. You can also use the wildcard :* to allow communication from any port, for example https://www.example.com:*.
When you create a new application, Grammarly automatically adds http://localhost:* and http://127.0.0.1:* to the origins list to simplify development.
Redirect URIs (desktop clients)
For a desktop client, you can configure redirect URIs in the Credentials section. These are the URIs Grammarly can redirect to after a user attempts to connect their Grammarly account to your application. Redirect URIs are needed to turn on connected accounts for your desktop application.