Parafin Elements Quickstart

Parafin Widget is a React component available via the @parafin/react npm package that allows you to embed Parafin's capital experience directly within your app. Get up and running in minutes with this quickstart guide.

Prerequisites

• Access to a Parafin dashboard
• Node.js

Instructions

1. Clone repo

First, clone the quickstart repository and install dependencies:

$ git clone https://github.com/efassor/embedded-demo-parafin.git
$ cd embedded-demo-parafin
$ npm install
$ npm install @parafin/react
$ npm install jwt-decode

2. Fetch and include API keys

Next, Navigate to the Settings > API keys in your Parafin dashboard and fetch your sandbox Client ID and Client secret.

Rename the sample.env file to .env and populate with your Client ID and Client secret.

$ mv sample.env .env

# .env
REACT_APP_PARAFIN_CLIENT_ID="<your-client-id>"
REACT_APP.PARAFIN_CLIENT_SECRET="<your-client-secret>"

3. Run the app

You're now ready to run the app and check out your embedded offer!

In the project directory, run:

$ npm run dev

Open http://localhost:3000 to view the app with an embedded Parafin Widget in your browser.