⌘K

Typescript + React SDK

Nativeblocks supports Typescript + React, for SDUI and SDA

Get started

Install vscode or any preferred code editor / IDE

Make sure that your project meets these requirements:

  • Uses node version 20.10.0 or higher
  • Uses Typescript
yarn add @nativeblocks/nativeblocks-react

Or

npm i @nativeblocks/nativeblocks-react

Let's get started by initializing the SDK

App.tsx
NativeblocksManager.initialize({
  endpoint: "NATIVEBLOCKS_API_URL",
  apiKey: "NATIVEBLOCKS_API_KEY",
  developmentMode: true,
})

To initialize the SDK two parameters needed:

  • API Url: you can get specific version from support team
  • API Key: Once you created a new project in the Nativeblocks, you can get the API key from project information
  • DevelopmentMode: this parameter allows to SDK to load published frames or developing frames, for production usage, make sure the DevelopmentMode is false

And in return of the react component use NativeblocksProvider

App.tsx
return (
  <>
    <NativeblocksProvider />
  </>
)

The core SDK by itself does not have any integrations, All integrations need to register on the Nativeblocks integration marketplace and provide to the SDK,

Current version of SDK supports following integration

  • Block
  • Action
  • Logger

here is the Nativeblocks API how you can connect your integration with it.

Block

NativeblocksManager.getInstance().provideBlock(
  "INTEGRATION_UNIQUE_KEY_TYPE",
  new CustomBlockInstance()
)

Action

NativeblocksManager.getInstance().provideAction(
  "INTEGRATION_UNIQUE_KEY_TYPE",
  new CustomActionInstance()
)

Logger

NativeblocksManager.getInstance().provideLogger(
  "INTEGRATION_UNIQUE_KEY_TYPE",
  new CustomLoggerInstance()
)