BioCatch

BioCatch CDN Integrator

About BioCatch CDN Integrator

A production-ready tool for generating BioCatch edge integration configuration, code, UI guides, and documentation.

What Is BioCatch CDN Integrator?

BioCatch CDN Integrator is a web application that helps you configure and deploy BioCatch edge integrations across multiple CDN vendors. Instead of manually writing configuration files, worker code, and deployment scripts, you answer a few questions and get production-ready artifacts with UI navigation guides instantly.

The tool supports four major edge computing platforms: Cloudflare Workers, Akamai EdgeWorkers, AWS CloudFront (Functions and Lambda@Edge), and Fastly Compute@Edge.

Key Features

Multi-Vendor Support

Configure integrations for Cloudflare, Akamai, AWS CloudFront, and Fastly using a unified interface. Each vendor gets tailored configuration and code.

Integration Options

Choose from worker forwarding, DNS configuration, page rules, and vendor-specific options. Mix and match to fit your architecture.

Auto-Generated Documentation

Get comprehensive step-by-step guides with prerequisites, architecture diagrams, verification commands, and troubleshooting tips.

Export & Share

Download all configuration files and scripts as a ZIP archive. Share integration guides via URL or print to PDF.

Supported Vendors

Cloudflare

  • Workers with routing
  • DNS configuration
  • Page Rules & Transform Rules
  • WAF & custom headers

Akamai

  • EdgeWorkers deployment
  • Property Manager config
  • PAPI JSON snippets
  • Behavior rules

AWS CloudFront

  • CloudFront Functions
  • Lambda@Edge
  • Route53 DNS
  • Cache behaviors

Fastly

  • Compute@Edge (Rust/JS)
  • VCL snippets
  • Backend configuration
  • Cache rules

Tech Stack

Built with Next.js 14 (App Router), TypeScript, Tailwind CSS, and shadcn/ui components. The design is strictly monochrome with a focus on typography, spacing, and accessibility.

  • Framework: Next.js 14 with App Router
  • Language: TypeScript
  • Styling: Tailwind CSS (monochrome palette)
  • UI Components: shadcn/ui + Radix UI primitives
  • Icons: Lucide React
  • Forms: React Hook Form + Zod validation

Extending the Tool

Edge Integrator is designed to be easily extensible. To add a new vendor or integration option:

  1. Add the vendor definition to lib/vendors.ts
  2. Define integration options with form fields, guide templates, and artifacts
  3. The wizard and guide generation will automatically adapt

See the README for detailed instructions on extending the schema.