Skip to main content

SDK / Examples

Examples

Same CDN script works in every environment. Destroy widgets on unmount.

HTML

<div id="calc"></div>
<script src="https://bestrao.com/sdk/v1/bestrao.min.js"></script>
<script>
  Bestrao.render({ target: "#calc", tool: "emi-calculator", theme: "auto" });
</script>

React / Next.js

"use client";
import { useEffect, useRef } from "react";

declare global {
  interface Window { Bestrao?: { render: (o: object) => { destroy: () => void } } }
}

export function EmiEmbed() {
  const ref = useRef<HTMLDivElement>(null);
  useEffect(() => {
    const el = ref.current;
    if (!el || !window.Bestrao) return;
    const widget = window.Bestrao.render({
      target: el,
      tool: "emi-calculator",
      theme: "auto",
      locale: "en-IN",
      currency: "INR",
    });
    return () => widget.destroy();
  }, []);
  return <div ref={ref} />;
}

// In layout or page: <Script src="https://bestrao.com/sdk/v1/bestrao.min.js" strategy="afterInteractive" />

Web Component

<script src="https://bestrao.com/sdk/v1/bestrao.min.js"></script>
<bestrao-tool tool="bmi-calculator" theme="light" locale="en-IN" currency="INR"></bestrao-tool>

CMS platforms

  • WordPress / Shopify / Webflow / Wix / Blogger — paste the HTML snippet into a Custom HTML / Embed block.
  • Vue / Svelte / Angular / Astro — mount on a ref after the script loads; call destroy() on teardown.

Generate live snippets in the playground.