Example implementations showing how to integrate RateAPI into your applications
Pick a Demo • Demo Details • Documentation • Get API Key
This is a collection of developer demos — working code examples that show how to integrate RateAPI's mortgage rate data into different types of applications. Fork the code, learn from it, and adapt it for your own projects.
git clone https://github.com/rate-api/demos.git
cd rateapi-demos
node run.js rate-explorer # Auto-creates API key, explore the APIThese demos show integration patterns for:
- Real Estate Platforms — Rate widgets for property listings
- Financial Planning Apps — Refinance recommendations, mortgage optimization
- AI Assistants — Natural language mortgage rate queries
- Rate Comparison Sites — Credit union rate aggregators
- Monitoring & Alerts — Webhook-powered rate drop notifications
- Browser Extensions — Contextual rate overlays on real estate sites
Get your free API key: https://rateapi.dev
| Demo | What It Demonstrates | API Features |
|---|---|---|
| Rate Explorer | CLI interaction with Decision Engine | Key creation, decisions, lookups |
| Webhook Monitor | Rate alert system architecture | Monitors, webhooks, HMAC verification |
| AI Agent | LLM tool integration patterns | Function calling, natural language → API |
| React Widget | Embeddable UI component | React hooks, server-side key protection |
| LangChain Agent | Full AI agent architecture | Multi-tool orchestration, memory |
| Discord Bot | Hosted bot (one-click install) | Add to Server |
| Chrome Extension | Content injection patterns | DOM extraction, Shadow DOM, proxies |
| Rate Explorer | Webhook Monitor | AI Agent | React Widget | LangChain | Discord | Chrome Ext | |
|---|---|---|---|---|---|---|---|
| API Key Creation | ✓ | ||||||
| Decision Engine | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ |
| Credit Union Lookup | ✓ | ✓ | ✓ | ✓ | |||
| Monitor CRUD | ✓ | ||||||
| Webhook Verification | ✓ | ||||||
| LLM Tool Integration | ✓ | ✓ | |||||
| React Hooks | ✓ | ||||||
| Web Components | ✓ | ||||||
| Content Injection | ✓ |
Start with Rate Explorer — it auto-creates an API key the other demos will use.
Find the best mortgage rates in seconds. Zero dependencies, just Node.js.
node run.js rate-explorerWhat you'll learn:
- Self-service API key creation (
POST /keys) - Decision engine (
POST /v1/decisions) - Credit union lookups (
GET /credit-unions/{state}/{slug})
Get alerts when mortgage rates drop. Production-ready webhook verification included.
cd rate-monitor && npm install
node server.jsWhat you'll learn:
- Creating rate monitors with conditions
- HMAC-SHA256 signature verification
- Monitor lifecycle (create, list, delete)
Chat-based mortgage advisor. Works without OpenAI key (mock mode).
node run.js rate-agent # Mock mode
node run.js rate-agent --real # GPT-4 mode (needs OPENAI_API_KEY)What you'll learn:
- LLM function/tool calling
- Natural language → API queries
- Testing AI integrations without API costs
Embeddable rate comparison widget. Light/dark themes, TypeScript support.
cd react-rate-widget && npm install
RATEAPI_KEY=your-key npm startWhat you'll learn:
- React integration patterns
- Custom hooks (
useRateAPI) - Server-side API key protection
Full mortgage advisor with LangChain. CLI and web interface.
cd langchain-mortgage-agent && npm install
npm run chat # CLI
npm run web # Web UI at localhost:3000What you'll learn:
- LangChain agent architecture
- Multi-tool orchestration
- Conversational AI patterns
Free hosted bot — add RateAPI to your Discord server with one click. No setup, no API key required.
Features:
- Real-time rate comparisons across thousands of credit unions
- Rate drop alerts — get notified when rates hit your target
- Natural language queries — ask questions in plain English
Great for:
- Real estate investing Discord communities
- Personal finance servers
- Mortgage professional groups
View documentation and add the bot →
See credit union rates while browsing Zillow, Redfin, Realtor.com & ProjectionLab. Supports both home purchase and refinance contexts.
node run.js chrome-extension
# Then load unpacked extension in chrome://extensionsWhat you'll learn:
- Chrome Manifest V3 extension architecture
- Lit web components with Shadow DOM for style isolation
- Site-specific DOM scraping and content injection
- Background service workers for API communication
- Bridge pattern for MAIN/ISOLATED world messaging
- Cloudflare Worker proxy for API key protection
- Refinance vs. purchase context handling
Key features:
- Purchase context: Auto-detects listings on Zillow, Redfin, Realtor.com
- Refinance context: Integrates with ProjectionLab financial planning dashboards
- Extracts price/balance and location from page DOM
- Displays floating overlay with best credit union rates
- Shows potential monthly savings vs. current rate or national average
- Expandable to show top 5 credit union offers
- State persistence across sessions (Chrome storage)
- In-memory caching to reduce API calls
- Demo mode with realistic sample data (no API key needed)
NEW: ProjectionLab Integration 🔥
- First Chrome extension for the FIRE community
- Auto-detects mortgage liabilities from your financial dashboard
- Shows refinance rates to help accelerate your path to FI
- Saves $214/mo on average ($400k mortgage, 7% → 6.125%)
- Read full integration guide
Developers have used these demos as starting points for:
- Real estate platform integrations
- AI-powered mortgage chatbots
- Rate monitoring dashboards
- Credit union comparison tools
Built something with RateAPI? Submit a PR to share your implementation.
All demos share a .env file in the root:
RATEAPI_KEY=your-key # Auto-created by Rate Explorer
RATEAPI_URL=https://api.rateapi.dev
OPENAI_API_KEY=sk-... # Only for AI demos in real mode
Requirements: Node.js 18+
- RateAPI Platform — Product overview and API access
- Discord Bot — Add to your server
- MCP Integration — Claude Desktop setup
PRs welcome! Ideas for new integration patterns:
- Discord bot (hosted service)
- Chrome extension (content scripts, DOM extraction, Shadow DOM)
- Telegram bot (inline queries, notifications)
- Google Sheets (custom functions, data import)
- Python SDK (requests wrapper, async support)
- Slack bot (slash commands, Block Kit)
- Firefox extension (port WebExtension patterns)
Want to contribute? Each demo should:
- Demonstrate a specific API integration pattern
- Include working, runnable code
- Explain what developers can learn from it
RateAPI — Mortgage rate data for developers