Skip to main content

​
Welcome to Saykit

Saykit is a modern, framework-agnostic internationalization (i18n) framework that brings compile-time message extraction and type-safe configuration to your applications.

Quick Start

Get up and running with Saykit in minutes

Core Concepts

Learn about Saykit’s architecture and design

React Integration

Use Saykit with React applications

API Reference

Explore the complete API documentation

​
Key Features

Template Literal Syntax

Define messages using intuitive template literal syntax with compile-time macro expansion

Compile-Time Extraction

Automatically extract translatable messages from your source code during build

Framework Agnostic

Works with React, Next.js, and any JavaScript framework or vanilla JS

ICU MessageFormat

Full support for pluralization, ordinals, and select messages using ICU standards

Type-Safe Configuration

Zod-powered configuration schema with full TypeScript support

Flexible Formats

Built-in PO file support with extensible custom formatter API

​
How It Works

Saykit uses a macro-based approach to define translatable messages directly in your source code: 
import { Say } from 'saykit';

const say = new Say({
  locales: ['en', 'fr'],
  messages: {
    en: { 'greeting': 'Hello, {name}!' },
    fr: { 'greeting': 'Bonjour, {name}!' }
  }
});

say.activate('en');

// Use template literals with compile-time transformation
const message = say`Hello, ${name}!`;
During build, Saykit’s Babel plugin extracts these messages and generates translation files in your preferred format (PO, JSON, etc.).

​
Why Saykit?

Write messages inline using familiar template literal syntax. No more hunting for translation keys or managing separate locale files manually.
Catch missing translations and format errors during build time, not runtime. Saykit extracts messages from your code and validates them before deployment.
Use Saykit with any JavaScript framework or none at all. The core runtime has zero dependencies, and framework integrations are opt-in.
Built on ICU MessageFormat for pluralization and formatting, ensuring compatibility with industry-standard translation tools and workflows.

​
Quick Example

Here’s a complete example showing pluralization with Saykit: 
import { Say } from 'saykit';

const say = new Say({
  locales: ['en', 'fr'],
  messages: {
    en: {
      'cart-items': '{count, plural, =0 {No items} one {# item} other {# items}} in cart'
    },
    fr: {
      'cart-items': '{count, plural, =0 {Aucun article} one {# article} other {# articles}} dans le panier'
    }
  }
});

say.activate('en');

// Use the plural macro
console.log(say.plural(0, { 
  0: 'No items', 
  one: '# item', 
  other: '# items' 
}));
// Output: "No items in cart"

​
Next Steps

1

Install Saykit

Add Saykit to your project using your preferred package managerInstallation Guide →
2

Configure Your Project

Set up your saykit.config.ts file to define locales and message extraction rulesConfiguration Guide →
3

Add a Framework Integration

Install the React, Babel, or unplugin integration for your build setupIntegrations →
4

Extract and Compile Messages

Use the CLI tools to extract messages and compile translationsCLI Reference →

​
Community and Support

Saykit is an open-source project. Contributions, issues, and feedback are welcome on GitHub.
Saykit is currently in active development (WIP). APIs may change before the stable 1.0 release.

Build docs developers (and LLMs) love

Get started for freeTalk to us