Skip to content

jobjab-dev/fhevm-react-template

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

102 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🔐 Universal FHEVM SDK

Production-ready, framework-agnostic SDK for building confidential dApps with Fully Homomorphic Encryption

License TypeScript Tests npm FHEVM

✨ Fully compatible with Zama FHEVM v0.9 specification

🌐 Live Demo: https://jobjab-fhevm-react-template-nextjs.vercel.app/
📦 npm Package: https://www.npmjs.com/package/jobjab-fhevm-sdk
🎬 Video Walkthrough: https://www.youtube.com/watch?v=ASWVwOE1iPk
📚 Full Documentation: https://github.com/jobjab-dev/fhevm-react-template/tree/main/docs

Works with: React • Vue • Node.js • Vanilla JS • Any JavaScript framework


⚡ Quick Start

Prerequisites: Node.js ≥ 20.0.0 + pnpm

git clone https://github.com/jobjab-dev/fhevm-react-template
cd fhevm-react-template

Terminal 1 - Start blockchain:

pnpm chain

Terminal 2 - Run demo:

pnpm all:demo
# Installs → Builds SDK → Deploys contracts → Starts app

Try it:

  1. Open http://localhost:3000
  2. Connect MetaMask to Hardhat Local
  3. Import test account: 0xac0974bec39a17e36ba4a6b4d238ff944bacb478cbed5efcae784d7bf4f2ff80
  4. Increment counter → Decrypt → See your private value! ✅

💡 How to Use This SDK

For React Developers

import { FhevmProvider, useEncrypt, useDecrypt } from 'jobjab-fhevm-sdk/adapters/react';
import { EncryptedInput, DecryptButton } from 'jobjab-fhevm-sdk/components/react';

// 1. Wrap app
<FhevmProvider config={{ network: 'sepolia' }}>
  <YourApp />
</FhevmProvider>

// 2. Use hooks
function MyComponent() {
  const { encrypt } = useEncrypt({ contractAddress: '0x...', userAddress: '0x...' });
  
  return (
    <EncryptedInput 
      type="euint32"
      onEncrypted={(r) => console.log('Encrypted!', r)}
    />
  );
}

📖 Full Guide: packages/fhevm-sdk/README.md


For Backend/Node.js Developers

import { createFhevmClient } from 'jobjab-fhevm-sdk/core';

const client = await createFhevmClient({ network: 'sepolia' });

const result = await client.encrypt(
  '0xContract',
  '0xUser',
  { type: 'euint32', value: 42 }
);

await contract.myFunction(result.handles[0], result.inputProof);

📖 Example: examples/nodejs/


For Quick Testing (CLI)

cd packages/cli && pnpm install && pnpm build

./dist/cli.js init           # Setup
./dist/cli.js encrypt 42     # Encrypt value
./dist/cli.js decrypt 0x...  # Decrypt  
./dist/cli.js check          # Health check

📖 CLI Guide: packages/cli/README.md


📚 Documentation

When You Need Read This
5-minute start QUICKSTART.md
Runnable examples examples/ - 10 .ts files
API docs (detailed) docs/ - Per-function docs
Code recipes COOKBOOK.md - 29 patterns
Complete API API_REFERENCE.md
Problems? TROUBLESHOOTING.md
Security SECURITY.md
Contracts CONTRACTS.md

🎯 Main Features

Core SDK:

  • Framework-agnostic (React, Vue, Node.js, Vanilla JS)
  • Wagmi-like API (Provider + hooks)
  • Complete encrypt/decrypt flows
  • Error handling with helpful messages

Components:

  • <EncryptedInput> - Auto-encrypting form input
  • <DecryptButton> - One-click decrypt with EIP-712
  • <CipherPreview> - Display ciphertext info

Developer Tools:

  • CLI: fhevm init, encrypt, decrypt, check
  • Scripts: pnpm all:demo (one-shot setup)
  • Performance: Batch operations (3-5x faster)

Quality:

  • 142+ tests passing
  • Full TypeScript support
  • Comprehensive test coverage

Live Showcase:

  • 🔢 Private Counter - Fully functional encrypted counter with increment/decrement
  • 📖 More Showcase Ideas - Secret Bidding, Private Poll concepts

🎯 FHEVM v0.9 Compatibility

This SDK is designed for Zama FHEVM v0.9 specification:

Modern Decryption Flow

  • Uses relayer/KMS gateway architecture (v0.9)
  • No deprecated FHE.requestDecryption or FHE.setDecryptionOracle
  • Simplified EIP-712 (no contractsChainId field)

Type System

  • Primary types: ebool, euint8-256, eaddress (v0.9 spec)
  • Legacy ebytes* marked deprecated (v0.7+ removal)
  • Uses externalE* + inputProof pattern (ZKPoK)

Network Support

  • Sepolia testnet (official contract addresses)
  • Localhost/Hardhat (auto-detection)
  • Custom networks (gateway chain support)

ACL & Permissions

  • Works with FHE.allow, FHE.allowThis
  • Supports FHE.makePubliclyDecryptable for reveal patterns

Verified with: @zama-fhe/relayer-sdk@0.2.0 | View Compatibility Details →


💡 How It Works

3-Step Process:

  1. Encrypt → Client-side encryption with SDK
  2. Compute → Encrypted operations on-chain
  3. Decrypt → User reveals with EIP-712 signature
// Encrypt
const enc = await client.encrypt(addr, user, { type: 'euint32', value: 42 });

// Use in contract
await contract.increment(enc.handles[0], enc.inputProof);

// Decrypt to view
const result = await client.decrypt([{ handle, contractAddress }], signature);

📖 Learn More: QUICKSTART.md | COOKBOOK.md | Examples


🛠️ Commands

# One-shot
pnpm all:demo       # Everything at once

# Development
pnpm chain          # Start blockchain
pnpm contracts:all  # Deploy contracts
pnpm start          # Start app

# SDK
pnpm sdk:build      # Build
pnpm sdk:test       # Test (142+ tests)

# CLI
fhevm init          # Setup
fhevm encrypt 42    # Encrypt
fhevm check         # Health check

📦 Repository Structure

packages/
├── fhevm-sdk/    ⭐ Universal SDK (publishable to npm)
├── cli/          ⚡ Command-line tool
├── nextjs/       🎨 Next.js demo (Private Counter)
└── hardhat/      🔧 Smart contracts

examples/
├── 01-10.ts      📝 10 TypeScript examples
├── nodejs/       🟢 Node.js server
├── vanilla-js/   🌐 Browser app
├── vue/          💚 Vue 3 Composition API
└── showcase/     💡 dApp ideas

Includes: SDK • CLI • Contracts • Next.js Demo • 4 Framework Examples • 10 Code Examples

🎨 Live Demo: Private Counter on Vercel → | 💡 More Ideas: Secret Bidding, Private Poll →


🔗 Links


✨ Features

SDK Capabilities:

  • ✅ Framework-agnostic core (works anywhere)
  • ✅ React hooks & components (wagmi-like API)
  • ✅ Batch encryption (3-5x faster)
  • ✅ User & public decryption (via relayer/gateway)
  • ✅ FHEVM v0.9 compliant decryption flow
  • ✅ CLI tool (4 commands)
  • ✅ 57 error codes with helpful messages
  • ✅ Full TypeScript support
  • ✅ 142+ tests passing

📋 See Complete Feature List →

Use Cases:

  • 🎲 Confidential Prediction Markets - Private bets, fair outcomes
  • 🗳️ Secret Voting/Polls - Anonymous voting without trust
  • 🎯 Private Auctions - Sealed-bid without oracle dependency
  • 💰 Encrypted DeFi - Private balances and transactions

📚 See Prediction Market MVP Guide →


📄 License

BSD-3-Clause-Clear - See LICENSE


🙏 Acknowledgments

Built with Zama's FHEVM - the leading Fully Homomorphic Encryption solution for Ethereum.

Special thanks to the Zama team for pioneering confidential smart contracts and the FHE ecosystem.


🤝 Contributing

Contributions are welcome! Please read our contributing guidelines and submit pull requests.

For major changes, please open an issue first to discuss proposed changes.


Built with ❤️ for the Zama community

About

Resources

License

Security policy

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages

  • TypeScript 96.9%
  • Other 3.1%