Skip to main content

Vibe code with Codex

Prerequisites

Install Codex

Desktop app

  • Download the Codex app from OpenAI Codex (opens in a new tab)
  • Open the app and sign in with your ChatGPT account or OpenAI API key
  • Follow the on-screen setup if this is your first launch

CLI

  • Install Codex CLI using one of the methods from Codex CLI docs (opens in a new tab)
  • Run codex in your terminal and sign in
  • Confirm the CLI works before starting your DataDoe build

Build with Codex

Desktop app

  • Open the Codex desktop app
  • Start a new task or thread in your project workspace
  • Copy the prompt text from the CLI section below and paste it directly into the Codex chat input
  • Set DATADOE_API_KEY in your .env file before the agent runs API calls
  • Review the generated code and run the app locally

CLI

  • Open a bash-compatible terminal in the folder where you want the project (on Windows, use WSL or Git Bash)
  • Copy the command below and run it in your terminal.
shell
1codex "$(
2    cat << 'EOF'
3Task:
4Build a clean, interactive Amazon sales dashboard using the DataDoe API.
5The dashboard should analyze the latest 30 days and compare them against the previous 30 days.
6
7Requirements:
8- Allow selection of a single seller from a seller list
9- Display sales, traffic, ads, and profitability data for the selected seller
10- Show current period, previous period, absolute delta, and % delta
11- Include KPI cards and simple comparison/trend charts
12- Use real API data only
13- Inspect the API docs first to identify the correct endpoints and fields
14- Strictly follow all agent instructions provided in the API documentation
15- Store `DATADOE_API_KEY` in a `.env` file; do not expose it in code or chat logs and don't ask user to provide it via chat message
16- If exact metrics are unavailable, use the closest available fields and clearly note assumptions
17- Handle missing data and API errors gracefully
18- Keep the UI simple, clean, and easy to read
19- Separate data fetching, transformation, and presentation logic
20Testing & Validation:
21- Use `curl` to verify API connectivity and inspect response structures before implementing the UI
22- Ensure the application builds successfully and the dev server starts without errors
23- Fix any linter or TypeScript errors introduced during development
24
25Include at minimum:
26- Sales: total sales, units sold, orders, average order value
27- Traffic: sessions, page views, conversion rate
28- Ads: ad spend, ad sales, ROAS, ACOS/TACOS if available
29- Profitability: gross profit, net profit if available, margin %
30
31Deliver:
32- A working dashboard
33- Clean, maintainable code
34- Brief setup instructions
35- A short explanation of the API endpoints used and any assumptions made
36
37Tech Stack:
38- React, TypeScript, Tanstack Router, Tanstack Start, Tanstack Query, ShadcnUI, Tailwind CSS, Yarn
39
40Data source:
41https://api.datadoe.com/api/v1/docs/json
42Read the prompt now and ask user if you should continue building the app.
43EOF
44)"
  • Run the command in your terminal
  • Set DATADOE_API_KEY in your .env file before the agent runs API calls
  • Review the generated code and run the app locally

Generated app

This example was generated using GPT 5.4 medium model:

Helpful resources