Bahan Pengajaran — Vibe Coding

Panduan Install Codex

Panduan langkah demi langkah untuk memasang, mengkonfigurasi, dan mula menggunakan Codex — alat CLI coding daripada OpenAI. Untuk pelajar dan pengajar.

5
Langkah Pemasangan
2
Platform Disokong
5
Isu Troubleshooting
🤖

Apa Itu Codex?

Pengenalan ringkas kepada Codex oleh OpenAI

Codex adalah alat CLI (Command Line Interface) daripada OpenAI yang membolehkan anda menulis, memahami, dan mengubah suai kod secara interaktif melalui terminal. Codex menggunakan model AI yang sama di sebalik ChatGPT untuk membantu anda dalam tugasan pembangunan perisian.

Ia adalah alternatif kepada Claude Code (Anthropic) dan alat coding AI lain. Dalam kursus ini, anda akan belajar memasang dan menggunakan kedua-duanya untuk pengalaman vibe coding yang lengkap.

📋

Prasyarat Sistem

Perisian yang perlu dipasang sebelum install Codex

Perisian Diperlukan:

  • 1 Node.js versi 18+ — Codex memerlukan Node.js untuk berfungsi. (Sama seperti Claude Code)
    Muat turun: nodejs.org
  • 2 Git — Untuk kawalan versi dan integrasi dengan GitHub.
    Muat turun: git-scm.com
  • 3 VS Code (Visual Studio Code) — Editor kod yang disyorkan untuk pengalaman pembangunan terbaik.
    Muat turun: code.visualstudio.com
  • 4 Akaun OpenAI — Anda perlu akaun OpenAI untuk mengesahkan Codex dan mendapatkan akses API.
    Daftar: platform.openai.com
Nota: Prasyarat ini SAMA seperti yang diperlukan oleh Claude Code. Jika anda sudah memasang Node.js, Git, dan VS Code untuk Claude Code, anda boleh terus ke langkah pemasangan Codex.
🪟

Pemasangan — Windows

Langkah demi langkah untuk Windows 10 / 11

Kaedah 1: Pasang melalui npm (Disyorkan)

  1. 1 Buka PowerShell atau Command Prompt sebagai Administrator.
    Klik kanan Start > "Windows Terminal (Admin)" atau "PowerShell (Admin)"
  2. 2 Sahkan Node.js sudah dipasang:
    node --version
    Output sepatutnya: v18.x.x atau lebih tinggi
  3. 3 Pasang Codex secara global melalui npm:
    npm install -g @openai/codex
  4. 4 Sahkan pemasangan berjaya:
    codex --version

Kaedah 2: Pasang melalui Homebrew (Windows)

Jika anda menggunakan Homebrew di Windows (melalui WSL atau Git Bash):

brew install codex
Nota: Kaedah ini memerlukan Homebrew dipasang terlebih dahulu. Disyorkan untuk pengguna yang sudah biasa dengan ekosistem Homebrew.
🍎

Pemasangan — macOS

Langkah demi langkah untuk macOS

Kaedah 1: Pasang melalui Homebrew (Disyorkan)

  1. 1 Buka Terminal (Finder > Applications > Utilities > Terminal).
  2. 2 Jika belum ada Homebrew, pasang dulu:
    /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
  3. 3 Pasang Node.js 18+ (jika belum):
    brew install node
  4. 4 Pasang Codex:
    brew install codex
  5. 5 Sahkan pemasangan:
    codex --version

Kaedah 2: Pasang melalui npm

Alternatif jika Homebrew tidak tersedia:

npm install -g @openai/codex
Nota: Mungkin perlu tambah sudo sebelum command: sudo npm install -g @openai/codex
🚀

First Run — Kali Pertama Guna Codex

Proses pengesahan, persediaan, dan konfigurasi awal

Langkah 1: Jalankan Codex

Buka terminal dan taip:

codex

Jika ini kali pertama, Codex akan memandu anda melalui proses persediaan.

Langkah 2: Pengesahan (Authentication)

Codex perlu mengesahkan identiti anda:

  1. 1 Codex akan membuka tetingkap browser untuk log masuk ke OpenAI.
  2. 2 Log masuk dengan akaun OpenAI anda (atau daftar jika belum ada).
  3. 3 Benarkan akses yang diminta — Codex perlukan akses ke API OpenAI.
  4. 4 Selepas pengesahan berjaya, tutup browser dan kembali ke terminal.
Tip: Pastikan akaun OpenAI anda mempunyai baki kredit atau langganan API yang aktif. Codex menggunakan API OpenAI yang dikenakan bayaran berdasarkan penggunaan (pay-as-you-go).
Alternatif (API Key): Jika tiada akses browser (contoh: remote server), anda boleh set OPENAI_API_KEY secara manual:
export OPENAI_API_KEY="sk-your-api-key-here"
Dapatkan API key dari: platform.openai.com/api-keys

Langkah 3: Setup Preferences

Selepas pengesahan, Codex akan tanya beberapa soalan konfigurasi:

  • ⚙ Pilih model AI — Biasanya gpt-4 atau gpt-4o untuk coding. Pilih yang termampu.
  • ⚙ Direktori projek — Codex akan minta folder projek untuk mula bekerja.
  • ⚙ Theme / warna terminal — Pilih sama ada tema terang atau gelap (dark theme disyorkan untuk keselesaan mata).
  • ⚙ Keybindings — Konfigurasi pintasan papan kekunci asas (boleh ubah kemudian).
✅

Verify Installation — Semak Pemasangan

Checklist untuk memastikan Codex berfungsi sepenuhnya

Checklist Pengesahan

1. Semak Versi Codex

codex --version

Sepatutnya output nombor versi seperti 0.x.x

2. Semak Bantuan

codex --help

Memaparkan senarai command dan options yang tersedia

3. Ujian Ringkas

echo 'console.log("Hello Codex!")' > test.js && codex "Explain this code"

Codex patut memberi penjelasan tentang kod JavaScript ringkas itu

4. Semak Status Pengesahan

codex whoami

Memaparkan akaun OpenAI yang disambungkan

5. Ujian Penuh (Interactive Mode)

codex

Jalankan tanpa argumen untuk masuk ke interactive mode. Taip "Buat hello world Python" dan lihat jika ia bertindak balas.

  • Tandakan bila selesai:
  • codex --version berfungsi — ___
  • codex --help berfungsi — ___
  • Codex boleh explain kod JavaScript — ___
  • codex whoami menunjukkan akaun — ___
  • Interactive mode berfungsi — ___
🔧

Troubleshooting — Masalah Biasa

5 isu yang sering dihadapi dan cara mengatasinya

⚠️ "command not found: codex" — Command tidak dikenali ▼

Punca: Direktori npm global tidak ada dalam PATH sistem.

Penyelesaian (Windows):

# Tambah npm global ke PATH $env:Path += ";$env:APPDATA\npm" # Atau restart PowerShell

Penyelesaian (Mac/Linux):

echo 'export PATH="$PATH:$(npm bin -g)"' >> ~/.zshrc source ~/.zshrc
⚠️ Authentication Error — Gagal log masuk ▼

Punca: Sesi OAuth tamat atau browser tidak dapat dibuka.

Penyelesaian:

  1. Log keluar dari OpenAI di browser, kemudian cuba semula.
  2. Guna API key secara manual: set OPENAI_API_KEY.
  3. Clear cache Codex: rm -rf ~/.codex/cache
⚠️ Node.js version too old — Versi Node tidak mencukupi ▼

Punca: Codex memerlukan Node.js 18+. Versi lama (14.x, 16.x) tidak akan berfungsi.

Penyelesaian:

# Semak versi semasa node --version # Install nvm (Node Version Manager) - Windows # Muat turun dari: https://github.com/coreybutler/nvm-windows # Install nvm - Mac/Linux curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash # Pasang Node.js 18+ nvm install 18 nvm use 18
⚠️ Rate Limit / Quota Exceeded — Had penggunaan API ▼

Punca: Akaun OpenAI telah mencapai had penggunaan atau baki tidak mencukupi.

Penyelesaian:

  • Semak baki API di platform.openai.com/usage
  • Tambah kredit pembayaran jika perlu.
  • Tukar ke model yang lebih murah (contoh: gpt-4o-mini).
  • Tunggu sehingga had penggunaan di-reset (biasanya setiap bulan).
⚠️ npm install fails — Gagal dipasang melalui npm ▼

Punca: Isu jaringan, kebenaran (permissions), atau versi npm terlalu lama.

Penyelesaian:

# Update npm dulu npm install -g npm@latest # Cuba lagi dengan --force (jika ada konflik) npm install -g @openai/codex --force # Jika isu permission di Mac/Linux sudo npm install -g @openai/codex # Guna Homebrew sebagai alternatif brew install codex
⚖️

Perbandingan: Claude Code vs Codex

Kekuatan masing-masing untuk membantu anda memilih alat yang sesuai

Aspek 🤖 Claude Code (Anthropic) 🤖 Codex (OpenAI)
Model AI Claude Opus 4 / Sonnet 4 GPT-4o / GPT-4o-mini
Pemasangan npm install -g @anthropic-ai/claude-code npm install -g @openai/codex
Kelebihan Utama Ekosistem tool kaya (MCP, Superpowers, Skills) — sesuai untuk pengajaran dan workflow berstruktur Integrasi rapat dengan ekosistem OpenAI — kuat untuk coding umum dan penyelesaian masalah
Plugin / Tools MCP Server (15+ plugin), Superpowers Skills Terhad — fokus pada coding asas
Context Window 200K tokens 128K tokens
Harga Pay-as-you-go (API Anthropic) Pay-as-you-go (API OpenAI)
Kesesuaian Pengajaran Sangat sesuai — ekosistem lengkap untuk pembelajaran berstruktur Sederhana — sesuai untuk coding asas dan integrasi dengan alat OpenAI
Bahasa Melayu Sokongan baik dalam prompt dan output Sederhana — bergantung pada model GPT
Cadangan: Guna kedua-duanya — Claude Code untuk workflow berstruktur dan pembelajaran mendalam (MCP, Skills, plugin), Codex untuk coding pantas dan integrasi dengan produk OpenAI. Dalam kursus ini, kita akan guna kedua-duanya mengikut kesesuaian tugasan.
📌

Langkah Seterusnya

Apa yang perlu dilakukan selepas berjaya memasang Codex

📘
Install Claude Code
Panduan memasang Claude Code — alat coding AI daripada Anthropic
🏠
Portal Utama
Kembali ke portal bahan pengajaran Vibe Coding
🚀
Fasa 1: Asas
Mulakan pembelajaran Vibe Coding — konsep asas dan latihan pertama
📚
Modul Setup
Anda di sini — modul persediaan persekitaran coding AI