ForgeWP

Beginner Glossary

Plain-language explanations of essential terms used across ForgeWP, React, and WordPress development.

When learning ForgeWP, you will encounter vocabulary from both modern frontend engineering and WordPress theme development. This glossary provides simple, clear definitions grouped by category.


1. ForgeWP Primitives & Architecture

wp.config.ts

The central configuration file located in the root of every ForgeWP theme project. It defines your theme's name, version, author, text domain, screenshot, supported features (like post thumbnails or menus), and custom post types. The compiler reads this file to generate style.css and functions.php. (See The wp.config.ts File).

cms/ Simulation Directory

A local folder that can contain typed files such as mock-data.ts, menus.ts, site-options.ts, and theme-mods.ts, as well as supported legacy JSON files. It supplies mock data for local preview without a WordPress database; it is a development approximation, not a complete WordPress emulator. (See The cms/ Simulation Layer).

Selective Hydration (<Hydrate>)

The technique of loading browser JavaScript for specific interactive components instead of hydrating the whole page. ForgeWP can discover eligible interactive components, and <Hydrate> lets you set loading behavior explicitly. The compiler has supported-pattern limits, so verify interactive output after export. (See Selective Hydration).

What is an "Island" if I'm coming from a classic PHP WordPress background?

In classic WordPress, a script may be loaded for a page even when only one widget needs it. An island is an interactive React component that ForgeWP can load separately. The rest of the page is rendered to HTML and PHP; other theme scripts or blocks may still add JavaScript.

<WpQueryLoop>

A declarative React component provided by @forgewp/react. During development, it loops through your mock posts in cms/mock-data.json. When compiled for production, it transforms into an efficient, native WordPress PHP WP_Query loop on the server. (See Loops, Custom Post Types & Queries).

<WpEditable>

A component used to define inline-editable content areas. It allows theme authors to build visual React sections that map directly to Gutenberg block attributes or custom fields, enabling content creators to edit text and images directly in the WordPress block editor. (See Create A Gutenberg Block).

forgewp doctor and forgewp repair

forgewp doctor checks project files, configuration, mock-data presence, Tailwind setup, hydration diagnostics, and static-lint findings. forgewp repair restores selected blueprint files; it can overwrite customized JSON blueprint files, so back those up first. (See Framework Internals & Diagnostics).


2. Core Compiler Concepts

Compiler

A tool that translates code from one language into another. In ForgeWP, the compiler (@forgewp/compiler) parses your React and TypeScript components, evaluates styles, generates standard WordPress PHP templates, and bundles production assets. (See Export Pipeline).

Transpilation

The process of converting code or compiler markers into another representation. ForgeWP renders React to HTML, then converts recognized constructs such as <WpImage field="featuredImage" /> into WordPress PHP output. It does not translate every React expression into PHP. (See Export Pipeline).

Theme Export (pnpm forgewp export)

The command that runs the full compilation pipeline. It builds the production assets, generates clean PHP files, copies required metadata, and packages the complete result into an installable .zip archive ready to be uploaded to any WordPress website. (See Export A WordPress Theme).


3. WordPress Concepts

Theme

A collection of template files, stylesheets, and scripts that determine the layout, appearance, and presentation of a WordPress website. ForgeWP compiles your project into a standard WordPress theme.

Template Hierarchy

The system WordPress uses to determine which template file to render for a given page. For example, a single blog post looks for single.php, a page looks for page.php, and if neither exists, WordPress falls back to index.php. (See The Template Hierarchy Demystified).

theme.json

The official WordPress configuration standard for modern themes. It declares design presets such as color palettes, font families, font sizes, spacing scales, and layout widths used by both the frontend and the Gutenberg editor. (See Design Tokens & theme.json v3).

functions.php

The primary operational file in a WordPress theme. It is executed automatically on page load to register theme features, enqueue CSS and JS files, register navigation menus, and define custom post types. ForgeWP automatically generates this file during export.

Gutenberg & Block Themes

Gutenberg is the visual block editor built into WordPress. Block themes allow users to construct and customize page layouts using visual blocks. ForgeWP can compile React components into native custom Gutenberg editor blocks. (See Block Themes vs. Classic Themes and Create A Gutenberg Block).


4. Frontend & Tooling Concepts

React

A popular JavaScript library for building user interfaces out of reusable components. In ForgeWP, React is your authoring language. (See Components, Props & JSX for Themes).

Component

A self-contained, reusable building block of a user interface. For example, a <Header />, <Hero />, <PricingCard />, or <Footer /> can each be defined as a component and reused across multiple templates.

Tailwind CSS 4

A utility-first CSS framework that allows you to style elements by applying pre-defined utility classes directly in your markup (e.g., flex items-center justify-between p-4 bg-card). (See Styling with Tailwind CSS 4 and Tailwind CSS 4 Theming & Tokens).

Vite

A next-generation frontend development server and bundler. It provides near-instant server start and instantaneous Hot Module Replacement (HMR) when you save a file. (See Run The Dev Server).

TypeScript

A superset of JavaScript that adds static type definitions. It helps you catch typos, syntax errors, and missing properties in your code before you even run it.

Tip

Now that you understand the fundamental vocabulary, proceed to Installation & First Theme to set up your environment and scaffold your first theme!