fortify-schema
Version:
A modern TypeScript validation library designed around familiar interface syntax and powerful conditional validation. Experience schema validation that feels natural to TypeScript developers while unlocking advanced runtime validation capabilities.
225 lines (201 loc) • 10 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Fortify Schema - Developer Documentation</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/github-dark.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
<link rel="stylesheet" href="styles.css">
</head>
<body class="bg-gray-50">
<!-- Header -->
<header class="gradient-bg text-white shadow-lg">
<div class="container mx-auto px-6 py-8">
<div class="flex items-center justify-between">
<div>
<h1 class="text-4xl font-bold mb-2">Fortify Schema</h1>
<p class="text-xl text-purple-100">Developer Documentation & API Reference</p>
</div>
<a href="https://github.com/Nehonix-Team/fortify-schema" target="_blank"
class="bg-white text-purple-600 px-6 py-3 rounded-lg font-semibold hover:bg-purple-50 transition">
View on GitHub
</a>
</div>
</div>
</header>
<!-- Navigation -->
<nav class="bg-white shadow-md sticky top-0 z-50">
<div class="container mx-auto px-6">
<div class="flex space-x-8 overflow-x-auto py-4">
<a href="index.html" class="nav-link active">🏠 Home</a>
<a href="bug-fixes.html" class="nav-link">🐛 Bug Fixes</a>
<a href="make-utility.html" class="nav-link">🔧 Make</a>
<a href="mod-utility.html" class="nav-link">⚙️ Mod</a>
<a href="custom-error-messages.html" class="nav-link">❌ Custom Error Messages</a>
<a href="examples.html" class="nav-link">📚 Examples</a>
<a href="api-reference.html" class="nav-link">📖 API</a>
</div>
</div>
</nav>
<!-- Main Content -->
<main class="container mx-auto px-6 py-12">
<!-- Hero Section -->
<section class="text-center mb-16">
<h2 class="text-5xl font-bold text-gray-800 mb-4">
TypeScript Schema Validation
</h2>
<p class="text-xl text-gray-600 mb-8 max-w-3xl mx-auto">
A modern TypeScript validation library with interface-like syntax and powerful conditional validation
</p>
<div class="flex justify-center gap-4">
<a href="#quick-start" class="btn-primary">Get Started</a>
<a href="examples.html" class="btn-secondary">View Examples</a>
</div>
</section>
<!-- Quick Start -->
<section id="quick-start" class="mb-16">
<div class="section-card">
<h3 class="text-3xl font-bold text-gray-800 mb-6">Quick Start</h3>
<div class="mb-6">
<h4 class="text-xl font-semibold text-gray-700 mb-3">Installation</h4>
<pre class="code-block"><code class="language-bash">npm install fortify-schema
# or
bun add fortify-schema</code></pre>
</div>
<div class="mb-6">
<h4 class="text-xl font-semibold text-gray-700 mb-3">Basic Usage</h4>
<pre class="code-block"><code class="language-typescript">import { Interface } from "fortify-schema";
const UserSchema = Interface({
id: "uuid",
name: "string(2,50)",
email: "email",
age: "number(18,120)?",
role: "admin|user|guest",
tags: "string[]?",
profile: {
bio: "string?",
avatar: "url?"
}
});
// Validate data
const result = UserSchema.safeParse(userData);
if (result.success) {
console.log("Valid:", result.data);
} else {
console.log("Errors:", result.errors);
}</code></pre>
</div>
</div>
</section>
<!-- Key Features -->
<section class="mb-16">
<h3 class="text-3xl font-bold text-gray-800 mb-8 text-center">Key Features</h3>
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
<div class="feature-card">
<div class="text-4xl mb-4">🎯</div>
<h4 class="text-xl font-semibold mb-2">Type-Safe</h4>
<p class="text-gray-600">Full TypeScript type inference with zero runtime overhead</p>
</div>
<div class="feature-card">
<div class="text-4xl mb-4">⚡</div>
<h4 class="text-xl font-semibold mb-2">High Performance</h4>
<p class="text-gray-600">Optimized validation with precompilation and caching</p>
</div>
<div class="feature-card">
<div class="text-4xl mb-4">🔧</div>
<h4 class="text-xl font-semibold mb-2">Powerful Utilities</h4>
<p class="text-gray-600">Make and Mod utilities for schema transformation</p>
</div>
<div class="feature-card">
<div class="text-4xl mb-4">🎨</div>
<h4 class="text-xl font-semibold mb-2">Clean Syntax</h4>
<p class="text-gray-600">Interface-like syntax that feels natural</p>
</div>
<div class="feature-card">
<div class="text-4xl mb-4">🔀</div>
<h4 class="text-xl font-semibold mb-2">Conditional Validation</h4>
<p class="text-gray-600">Runtime conditional logic based on field values</p>
</div>
<div class="feature-card">
<div class="text-4xl mb-4">📦</div>
<h4 class="text-xl font-semibold mb-2">Array Support</h4>
<p class="text-gray-600">Full support for arrays and nested objects</p>
</div>
</div>
</section>
<!-- Recent Updates -->
<section class="mb-16">
<div class="section-card bg-gradient-to-r from-green-50 to-emerald-50 border-l-4 border-green-500">
<h3 class="text-2xl font-bold text-gray-800 mb-4">✨ Recent Bug Fixes</h3>
<p class="text-gray-700 mb-4">
We've fixed critical bugs in array-of-objects validation and type inference.
Your schemas now work correctly with complex nested structures!
</p>
<a href="bug-fixes.html" class="inline-flex items-center text-green-600 font-semibold hover:text-green-700">
Learn more about the fixes
<svg class="w-5 h-5 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
</svg>
</a>
</div>
</section>
<!-- Documentation Links -->
<section>
<h3 class="text-3xl font-bold text-gray-800 mb-8 text-center">Explore Documentation</h3>
<div class="grid md:grid-cols-2 gap-6">
<a href="make-utility.html" class="doc-link-card">
<div class="flex items-start">
<div class="text-3xl mr-4">🔧</div>
<div>
<h4 class="text-xl font-semibold mb-2">Make Utility</h4>
<p class="text-gray-600">Create constants, unions, and type-safe values</p>
</div>
</div>
</a>
<a href="mod-utility.html" class="doc-link-card">
<div class="flex items-start">
<div class="text-3xl mr-4">⚙️</div>
<div>
<h4 class="text-xl font-semibold mb-2">Mod Utility</h4>
<p class="text-gray-600">Transform, merge, and manipulate schemas</p>
</div>
</div>
</a>
<a href="examples.html" class="doc-link-card">
<div class="flex items-start">
<div class="text-3xl mr-4">📚</div>
<div>
<h4 class="text-xl font-semibold mb-2">Examples</h4>
<p class="text-gray-600">Real-world usage patterns and best practices</p>
</div>
</div>
</a>
<a href="api-reference.html" class="doc-link-card">
<div class="flex items-start">
<div class="text-3xl mr-4">📖</div>
<div>
<h4 class="text-xl font-semibold mb-2">API Reference</h4>
<p class="text-gray-600">Complete API documentation and type definitions</p>
</div>
</div>
</a>
</div>
</section>
</main>
<!-- Footer -->
<footer class="bg-gray-800 text-white mt-16 py-8">
<div class="container mx-auto px-6 text-center">
<p class="mb-2">© 2025 Nehonix Team. All rights reserved.</p>
<p class="text-gray-400 text-sm">
<a href="https://github.com/Nehonix-Team/fortify-schema" class="hover:text-white">GitHub</a> ·
<a href="https://www.npmjs.com/package/fortify-schema" class="hover:text-white">NPM</a>
</p>
</div>
</footer>
<script>
hljs.highlightAll();
</script>
</body>
</html>