From ddfdd8b4dc2004f7bf184e410764da901eeceb4f Mon Sep 17 00:00:00 2001
From: Jen <60794961+jennyg0@users.noreply.github.com>
Date: Thu, 22 Aug 2024 13:34:48 -0400
Subject: [PATCH] feat: add web3js to cli

---
 README.md                              |  2 +-
 src/commands/create/groups/frontend.ts | 18 +++++++++++++++++-
 2 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index 076fa6d..8cb389c 100644
--- a/README.md
+++ b/README.md
@@ -53,7 +53,7 @@ Run `npx zksync-cli dev` to see the full list of commands.
 
 ### Create Project commands
 - `npx zksync-cli create`: Create a project using updated templates.
-  - **Frontend**: Rapid UI development with templates for Vue, React, Next.js, Nuxt, Vite, etc. Options include viem, ethers, web3modal, rainbowkit. [More Info](https://github.com/matter-labs/zksync-frontend-templates#readme)
+  - **Frontend**: Rapid UI development with templates for Vue, React, Next.js, Nuxt, Vite, etc. Options include viem, ethers, web3.js, web3modal, rainbowkit. [More Info](https://github.com/matter-labs/zksync-frontend-templates#readme)
   - **Contracts**: Quick contract deployment and testing with tools like Hardhat on Solidity or Vyper. [Contract templates](https://github.com/matter-labs/zksync-contract-templates#readme)
   - **Scripting**: Automated interactions and advanced ZKsync operations using Node.js, with examples of wallet or contract interactions using viem, ethers or web3.js. [Scripting Templates](https://github.com/matter-labs/zksync-scripting-templates#readme)
 
diff --git a/src/commands/create/groups/frontend.ts b/src/commands/create/groups/frontend.ts
index 2b0d5ce..10ec107 100644
--- a/src/commands/create/groups/frontend.ts
+++ b/src/commands/create/groups/frontend.ts
@@ -15,7 +15,7 @@ type Template = GenericTemplate & {
     | "React - Vite"
     | "Svelte - SvelteKit"
     | "Svelte - Vite";
-  ethereumFramework: "Ethers v6" | "viem";
+  ethereumFramework: "Ethers v6" | "viem" | "Web3.js";
   requiresWalletConnectProjectId?: boolean;
 };
 
@@ -109,6 +109,14 @@ export const templates: Template[] = [
     path: "templates/react/next-ethers",
     git: "https://github.com/matter-labs/zksync-frontend-templates",
   },
+  {
+    name: "Web3.js",
+    value: "react_next_web3js",
+    framework: "React - Next.js",
+    ethereumFramework: "Web3.js",
+    path: "templates/react/next-web3js",
+    git: "https://github.com/matter-labs/zksync-frontend-templates",
+  },
 
   /* React Vite */
   {
@@ -136,6 +144,14 @@ export const templates: Template[] = [
     path: "templates/react/vite-ethers",
     git: "https://github.com/matter-labs/zksync-frontend-templates",
   },
+  {
+    name: "Web3.js",
+    value: "react_vite_web3js",
+    framework: "React - Vite",
+    ethereumFramework: "Web3.js",
+    path: "templates/react/vite-web3js",
+    git: "https://github.com/matter-labs/zksync-frontend-templates",
+  },
 
   /* Svelte SvelteKit */
   {