Prerequisite: Create a react app project (guide).

​
1) Install the Clasp SDK

Using a package manager:

npm install clasp-components

​
2) Add Clasp’s stylesheet

You’ll need to import the style.css CSS file distributed by the package. This should be done at the root of your project (in index.js or App.tsx of your React app) and will look like:

import 'clasp-components/dist/style.css';
...

​
3) Import and embed a component from the SDK

In this guide we’re importing the Employer Component.

import React from "react";
import { ClaspEmployer } from "clasp-components";

const App = () => (
  <div className="app-container">
    <ClaspEmployer />
  </div>
);

export default App;

​
4) Reload the page

Congrats! You just embedded your first benefits component 🎉