How to Build the everyone-can-use-english Project from Source

You can build the everyone-can-use-english project by installing Node.js ≥18 and Yarn 4, running yarn install at the repository root, then building the Vite front-end in the enjoy directory and the Cloudflare Worker in the entry directory.

The everyone-can-use-english repository is a TypeScript monorepo that powers an English learning application. In this guide, you'll learn how to build both components—the enjoy front-end web app and the entry Cloudflare Worker backend—from source code.

Prerequisites

Before building the project, ensure your environment meets these requirements:

• Node.js LTS (version 18 or higher)
• Yarn 4 (the repository uses Yarn's workspace features and a Yarn 4 lockfile)

Enable and activate Yarn 4 via Corepack:

corepack enable
corepack prepare yarn@4.6.0 --activate

Step 1: Clone the Repository

Start by cloning the source code and navigating to the project root:

git clone https://github.com/ZuodaoTech/everyone-can-use-english.git
cd everyone-can-use-english

Step 2: Install Dependencies

The root package.json declares a Yarn workspace that includes both the enjoy and entry packages. A single install command resolves all dependencies:

yarn install

This hoists shared packages and installs workspace-specific dependencies for both the front-end and the worker.

Step 3: Build the Front-End (enjoy)

The enjoy package contains the React/TypeScript web application built with Vite. Its configuration lives in enjoy/vite.main.config.ts, which defines the production pipeline including TypeScript compilation, asset hashing, and CSS processing.

Navigate to the enjoy directory and run the production build:

cd enjoy
yarn build

This outputs static assets to enjoy/dist/, ready for deployment to any static host.

To run a local development server with hot-module replacement:

yarn dev

The dev server starts at http://localhost:5173 by default.

Step 4: Build the Cloudflare Worker (entry)

The entry package implements the backend API as a Cloudflare Worker. Its entry point is entry/index.js, with configuration in entry/wrangler.toml.

Navigate to the entry directory and build the worker:

cd ../entry
yarn build

This invokes Wrangler to transpile and bundle the handler into a deployable artifact.

To test the worker locally before deploying:

wrangler dev

This launches a local Cloudflare Workers sandbox for development.

Complete Build Sequence

Here's the full command sequence for macOS, Linux, or Windows (PowerShell):

# Clone and enter repository

git clone https://github.com/ZuodaoTech/everyone-can-use-english.git
cd everyone-can-use-english

# Install Yarn 4 (if needed)

corepack enable
corepack prepare yarn@4.6.0 --activate

# Install all dependencies

yarn install

# Build front-end

cd enjoy
yarn build

# Build worker

cd ../entry
yarn build

Key Files in the Build Pipeline

File	Purpose
package.json (root)	Declares Yarn workspace structure
enjoy/package.json	Front-end dependencies and scripts
enjoy/vite.main.config.ts	Vite build configuration
enjoy/src/utils.ts	Utility module bootstrapping the UI
entry/package.json	Worker dependencies and Wrangler scripts
entry/wrangler.toml	Cloudflare Worker deployment settings
entry/index.js	Worker runtime entry point

Deploying the Built Artifacts

Front-End Deployment

The enjoy/dist/ directory contains static files ready for any CDN or static hosting service (Cloudflare Pages, Vercel, Netlify, etc.).

Worker Deployment

To deploy the Cloudflare Worker to production (requires a Cloudflare account and API token):

cd entry
wrangler publish

This uploads the bundled worker from entry/index.js as configured in wrangler.toml.

Summary

• Yarn 4 workspaces unify dependency management across the enjoy and entry packages.
• Vite (enjoy/vite.main.config.ts) handles the React/TypeScript front-end build, outputting to enjoy/dist/.
• Wrangler (entry/wrangler.toml) bundles the Cloudflare Worker from entry/index.js.
• Run yarn dev in enjoy/ for front-end development and wrangler dev in entry/ for backend testing.

Frequently Asked Questions

What Node.js version is required to build everyone-can-use-english?

Node.js LTS version 18 or higher is required. The build pipeline uses modern JavaScript features and the Yarn 4 package manager, which both depend on a recent Node runtime.

Can I use npm instead of Yarn to build this project?

No—the repository relies on Yarn 4's workspace features and the yarn.lock file format. Using npm will not correctly resolve the workspace dependencies between the enjoy and entry packages.

What is the difference between the enjoy and entry packages?

The enjoy package is a Vite-built React web application that serves the user interface. The entry package is a Cloudflare Worker that provides backend API functionality. They are separate deployable units within the same repository.

How do I run the full application locally for development?

Start both components in separate terminals: run yarn dev in the enjoy/ directory for the front-end dev server, and wrangler dev in the entry/ directory for the local Workers sandbox. The front-end will proxy API requests to the local worker as configured in Vite's development server settings.

{
  "mcpServers": {
    "instagit": {
      "command": "npx",
      "args": ["-y", "instagit@latest"]
    }
  }
}