fhEVM
WebsiteLibrariesProduct & ServicesDevelopersSupport
0.5
0.5
  • Welcome to fhEVM
  • Getting Started
    • What is fhEVM
    • Deploy on fhEVM native
      • Using Zama Faucet
      • Local dev node
    • Deploy on Ethereum
    • Whitepaper
  • Fundamentals
    • Write contract
      • Using Hardhat
      • Using Remix
      • Other development environment
    • Encrypted types
      • Operations on encrypted types
      • Branching in FHE
      • Generate random number
    • Encrypted inputs
    • Access Control List
    • Decrypt and reencrypt
    • Contracts standard library
  • Guides
    • Decryption
    • Reencryption
    • Build a web application
    • Build with Node
    • Common pitfalls and best practises
    • How can I break a loop ?
    • Gas estimation on devnet
    • Use the CLI
    • Common webpack errors
  • Tutorials
    • See all tutorials
    • Write confidential smart contract with fhEVM
  • References
    • API function specifications
    • fhevmjs function specifications
    • Repositories
  • Developer
    • Contributing
    • Development roadmap
    • Release note
    • Feature request
    • Bug report
Powered by GitBook

Libraries

  • TFHE-rs
  • Concrete
  • Concrete ML
  • fhEVM

Developers

  • Blog
  • Documentation
  • Github
  • FHE resources

Company

  • About
  • Introduction to FHE
  • Media
  • Careers
On this page
  • Using a template
  • React + TypeScript
  • VueJS + TypeScript
  • NextJS + Typescript
  • Using directly the library

Was this helpful?

Export as PDF
  1. Guides

Build a web application

PreviousReencryptionNextBuild with Node

Last updated 10 months ago

Was this helpful?

Using a template

fhevmjs is working out of the box and we recommend you to use it. We also provide three GitHub templates to start your project with everything set.

React + TypeScript

You can use to start an application with fhevmjs, using Vite + React + TypeScript.

VueJS + TypeScript

You can also use to start an application with fhevmjs, using Vite + Vue + TypeScript.

NextJS + Typescript

You can also use to start an application with fhevmjs, using Next + TypeScript.

Using directly the library

First, you need to install the library.

# Using npm
npm install fhevmjs

# Using Yarn
yarn add fhevmjs

# Using pnpm
pnpm add fhevmjs
import { initFhevm } from "fhevmjs";

const init = async () => {
  await initFhevm(); // Load needed WASM
};

Once the WASM is loaded, you can now create an instance. An instance receives an object containing:

  • chainId (optional): the chainId of the network

  • network (optional): the Eip1193 object provided by window.ethereum (used to fetch the public key and/or chain id)

  • networkUrl (optional): the URL of the network (used to fetch the public key and/or chain id)

  • publicKey (optional): if the public key has been fetched separately (cache), you can provide it

  • gatewayUrl (optional): the URL of the gateway to retrieve a reencryption

  • coprocessorUrl (optional): the URL of the coprocessor

import { initFhevm, createInstance } from "fhevmjs";

const init = async () => {
  await initFhevm(); // Load TFHE
  return createInstance({
    network: window.ethereum,
    gatewayUrl: "https://gateway.zama.ai/",
  });
};

init().then((instance) => {
  console.log(instance);
});

fhevmjs uses ESM format. You need to set the . If your node project use "type": "commonjs" or no type, you can force the loading of the web version by using import { createInstance } from 'fhevmjs/web';

To use the library in your project, you need to load the WASM of first with initFhevm.

You can now use your instance to or do a .

this template
this template
this template
type to "module" in your package.json
TFHE
encrypt parameters
reencryption