Skip to content

Integration Options

React Components

The React component library provides pre-built, customizable UI components for seamless integration into your React applications. This is the recommended approach for most web applications.

Demo

Installation

npm
npm install @ecp.eth/sdk
# install peer dependencies
npm install viem wagmi @tanstack/react-query @tanstack/query-core

Usage

import React from "react";
import { CommentsEmbed } from "@ecp.eth/sdk/embed";
 
export function Comments() {
  return (
    <div>
      <h3>Comments</h3>
      <CommentsEmbed
        uri={
          new URL(
            window.location.pathname,
            // replace with your url
            "https://demo.ethcomments.xyz",
          )
        }
        theme={{
          mode: "light",
          // ...
        }}
      />
    </div>
  );
}
  • Please note that if you are rendering the CommentsEmbed with server-side rendering (SSR), you do not have access to the window object. Instead, you may want to construct the uri out of the HttpRequest object of your server-side framework.
  • Please also read the targetUri carefully in Comment Data for choosing an appropriate uri.

API reference

Next Steps