What are the Metrifox SDKs?
The Metrifox SDKs ship ready-made UI (customer portal, pricing table) and server-side helpers for billing, subscriptions, entitlements, and checkout—so you do not rebuild those flows from scratch.How it works
1
Install
Add the package for your stack (
npm / pnpm / yarn, or backend equivalents).2
Initialize
Frontend: client key via
metrifoxInit or MetrifoxService.initialize. Backend: secret key per SDK docs.3
Embed widgets
Mount portal and pricing components, then tune appearance using the v2.0.0+ theme API only.
Live playgrounds (by framework)
Use these environments to evaluate props, theming, and component behavior before integrating the SDK into your application:React playground
Customer Portal and Pricing Table in a React shell—best reference when building Next.js or Vite apps.
Angular playground
Same widgets with Angular standalone components and
MetrifoxService patterns.Frontend widgets
Customer Portal
Self-serve dashboard: subscription, plan, billing history, wallet, usage, payments.
Pricing Table
Plans and one-time purchases with checkout integration.
Backend capabilities
Checkout
Generate checkout URLs and server-side purchase flows.
Usage & entitlements
Record usage and verify access from your API layer.
Supported languages and frameworks
Frontend
React
React 18+, Next.js, Vite, and other React bundlers.
Angular
Angular 17–19, standalone components.
Backend
Python
Django, Flask, FastAPI, and similar.
Node.js
Express, NestJS, and more.
Ruby
Rails, Sinatra, and similar.
Demo source
Metrifox SDK demo repository
Reference implementations that pair with the playgrounds above.