This guide walks you through the full Momen + Codex integration — from a blank project to a visual Postgres backend built through conversation and a React + Vite frontend wired to the live GraphQL API, without writing any backend code. Every command is copy-paste ready.
Prerequisites
- Codex CLI installed and configured with an OpenAI API key
- Node.js 18+ (required for npx momen-mcp)
- A Momen account (free tier is sufficient to start)
Why Backend First
Building frontend before backend feels faster in the moment — Codex can scaffold UI components immediately, without waiting for any infrastructure. The problem surfaces later: the API those components call doesn't exist yet, and when it does, its field names probably don't match what Codex invented.
The fix is straightforward. Momen generates a typed GraphQL API the moment you sync your backend. Once synced, that schema is available for introspection — Codex reads every table, field type, and Actionflow from it before writing a single component. No invented field names. No corrections after the fact.
Backend first costs one step up front. Frontend first costs a round of corrections for every field name that was guessed wrong.
Step 1: Install the Momen Plugin
The Momen Plugin bundles the momen-platform Skill (which teaches Codex how to operate Momen), the momen-mcp CLI (the execution layer), and session-start schema loading that reads your backend before the first prompt.
Option A: CLI — two commands (Recommended)
codex plugin marketplace add momen-tech-org/momen-nocode-plugin
This registers the Momen GitHub repository as a plugin marketplace. Then:
codex plugin add momen-nocode@momen
Confirm it's installed:
codex plugin list | grep momen
You should see momen-nocode in the output.
Option B: GUI — chat panel
- In a Codex chat session, type /plugins
- The plugin manager opens — paste momen-tech-org/momen-nocode-plugin as the marketplace URL or browse for Momen
- Install from the interface
Note: the Codex desktop app does not currently have a dedicated plugin settings panel. The chat-based /plugins flow is the GUI path for individual users.
Step 2: Authenticate
This connects the momen-mcp CLI to your Momen account. Run it once — credentials are stored locally and reused across sessions.
npx -y momen-mcp@latest login
Follow the browser prompt to authorize. When it completes, the terminal confirms the connection.
Step 3: Create a Momen Project
Go to momen.app and create a new project. Once the project opens in the editor, copy the URL from your browser:
https://editor.momen.app/tool/YOUR_PROJECT_ID/WEB
This URL identifies your project. Include it in every backend-building prompt so the Plugin knows where to operate.
Step 4: Build Your Backend
Open a new Codex session. The Skill loads automatically and reads any existing backend state before your first prompt.
Describe what you want to build:
Use the momen-nocode plugin to build the backend for [describe your app — what users do, what needs to be stored, what business logic matters].
My Momen project: https://editor.momen.app/tool/YOUR_PROJECT_ID/WEB
Codex uses the Skill to call Momen's APIs — creating tables, configuring relations, setting up auth, adding Actionflows for server-side logic, and triggering a backend sync. The result isn't code files. It's a live visual backend in Momen: tables and fields in the data model editor, Actionflows in the flow builder, a typed GraphQL API ready to query. Open Momen at any point to see what the agent built or make adjustments.
Step 5: Build the React + Vite Frontend
Continue in the same session:
Build a React + Vite frontend based on the Momen backend you just created.
Codex reads the full schema and scaffolds a React + Vite app wired to the live Momen GraphQL API. Auth, CRUD operations, and any Actionflow calls are wired to real endpoints from the start.
For a complete session walkthrough with this setup, see Build a Spirit Pizza Topping Quiz with Codex and Momen BaaS.
Top comments (0)