> ## Documentation Index
> Fetch the complete documentation index at: https://docs.getruba.com/llms.txt
> Use this file to discover all available pages before exploring further.
# Build with Ruba in TypeScript
> SDK for JavaScript runtimes (Node.js and Browser)
export const RubaSocials = () => {
if (typeof document === "undefined") {
return null;
}
const inject = () => {
const footer = document.getElementById("footer");
if (!footer || document.getElementById("ruba-socials")) {
return false;
}
const isDark = document.querySelector("html.dark") || document.querySelector('html[class*="dark"]');
const lineColor = isDark ? "#383838" : "#e8e8ed";
const iconColor = isDark ? "#8e8e93" : "#86868b";
const markColor = isDark ? "#ffffff" : "#08080c";
const hoverColor = "#0071e3";
const div = document.createElement("div");
div.id = "ruba-socials";
div.style.cssText = `display:flex;align-items:center;gap:20px;padding-top:20px;margin-top:20px;border-top:1px solid ${lineColor};width:100%`;
const logo = `Ruba`;
const spacer = ``;
const ig = ``;
const li = ``;
const x = ``;
const github = ``;
div.innerHTML = logo + spacer + ig + li + x + github;
footer.appendChild(div);
return true;
};
if (!document.documentElement.dataset.rubaSocialsObserver) {
document.documentElement.dataset.rubaSocialsObserver = "true";
const observer = new MutationObserver(() => {
if (!document.getElementById("ruba-socials")) {
inject();
}
});
observer.observe(document.body, {
childList: true,
subtree: true
});
}
setTimeout(() => {
if (!inject()) {
const interval = setInterval(() => {
if (inject()) {
clearInterval(interval);
}
}, 500);
setTimeout(() => clearInterval(interval), 10000);
}
}, 300);
return null;
};
## Installing
```bash Terminal theme={"system"}
npm install @getruba/sdk
```
```bash Terminal theme={"system"}
yarn add @getruba/sdk
```
```bash Terminal theme={"system"}
pnpm add @getruba/sdk
```
## Make the first connection
```typescript icon="square-js" index.js theme={"system"}
import { Ruba } from '@getruba/sdk'
const ruba = new Ruba({
accessToken: process.env.RUBA_ACCESS_TOKEN,
server: 'sandbox'
})
async function run() {
const result = await ruba.benefits.list({ page: 1, limit: 10 })
for await (const page of result) {
// Handle the page
console.log(page)
}
}
run()
```
**camelCase vs. snake\_case**
Our API (and docs) is built around `snake_case`. Still, our TS SDK currently
converts this into camelCase to match JS/TS conventions. Modern IDEs will
suggest the camelCase parameters automatically thanks to strong typing, but
keep in mind the difference when flipping between code & docs.
We plan to add a toggle for this down the road, letting you opt into
`snake_case` even in TypeScript so it maps more directly onto our documentation
and the API's own design.
### Framework Adapters
Build Checkout & Webhook handlers in just a handful of lines.
* [Better Auth](/integrate/sdk/adapters/better-auth)
* [Express](/integrate/sdk/adapters/express)
* [Hono](/integrate/sdk/adapters/hono)
* [Fastify](/integrate/sdk/adapters/fastify)
* [Next.js](/integrate/sdk/adapters/nextjs)