Oracle APEX 26.1)APEXlang + Claude CodeでAPEXアプリケーション作ってみた。(2026/07/29)

OracleAPEX

Posted at 2026-07-28

はじめに

Oracle APEX 26.1 では、AI 支援開発を可能にする「APEXlang」が導入されました。APEXlang は Oracle APEX 専用に設計されたオープンなアプリケーション仕様言語で、APEX アプリケーションを構造化された人間可読なファイルとして表現します。これにより、開発者だけでなく Codex や Claude Code といった AI コーディングエージェントも、ソースコード管理された定義ファイルをもとにアプリケーションの生成・レビュー・検証・改修を行えるようになります。

APEXlang を AI コーディングエージェントと組み合わせることで、自然言語のプロンプトからアプリケーションの機能・ページ・拡張を生成することができます。Visual Studio Code(VS Code) からOracle Database への接続、AI コーディングエージェントの設定、APEXlang スキルのインストール、そして自然言語プロンプトによる APEX アプリケーションの生成をしてみました。

Oracle APEX と VS Code で利用できる AI コーディングエージェントには、主に以下の2つの選択肢があります。

項目	Codex	Claude Code
提供元	OpenAI	Anthropic
VS Code Extension	Codex – OpenAI's coding agent	Claude Code
サインイン方法	ChatGPT アカウント（推奨）または OpenAI API キー	Claude AI アカウントでのブラウザ認証
モデル設定	利用可能な最も高性能な GPT モデル＋推論レベル（Medium/High）	利用可能な最も高性能な Claude モデル＋Effort（推論負荷）レベル
必要な契約	OpenAI アカウントまたは API キー	Claude AI サブスクリプション
参考ドキュメント	Codex for VS Code	Claude Code for VS Code

今回は、AI コーディングエージェントとして Claude Code を使ってみました。Oracle APEXで作成するアプリケーションは、EMP/DEPT サンプルデータセットを使った「Employee Portal」アプリケーションを生成し、Claude Code に「Faceted Search 付きの Employee Directory ページ」を自然言語プロンプトで追加させるところまでを確認しました。作業は、WSLで作成したLinuxに接続して行いました。

事前準備

Oracle APEX 26.1 がインストールされた Oracle Database 環境（今回は Autonomous Database 19cを利用）
APEX にログイン可能なワークスペースおよびスキーマの認証情報
Claude AI サブスクリプション（Claude Code を利用するため）
インターネット経由で VS Code Marketplace および認証用ブラウザにアクセスできるネットワーク環境
Visual Studio Code（最新版）
- Oracle SQL Developer Extension for VS Code のインストール
- ローカル端末で SQLcl（Oracle SQL Developer Extension に同梱）を実行できる環境
- Claude Codeのインストールし、Sign In

注意

AI コーディングエージェントおよびその背後で動作する LLM の利用契約・費用は、Oracle APEX のライセンスには含まれません。別途契約が必要です。

スキーマを意識した変更、アプリケーション分析、AI 支援によるアプリケーション拡張など、複雑な APEX 開発タスクには、より高い推論レベル（Effort）を使用することが推奨されています。

Oracle Database への詳細なネットワーク接続設定（ウォレット配置やファイアウォール設定など）
- 参考: Oracle SQL Developer for VS Code 接続設定ドキュメント
EMP/DEPT サンプルデータセットの詳細なインストール手順
- 参考: Installing Sample Dataset

手順

Step 1: VS Code プロジェクト用のワークスペースを作成

まず開発環境とする、プロジェクト用のワークスペースを作成します。

プロジェクトフォルダ（例：APEX_APPS）を作成し、VS Code の ファイル → フォルダを開く で開きます。このワークスペースに、APEXlang のソースファイル、アプリケーションのエクスポート、プロジェクトアセットが保存されます。

Step 2: Oracle Database への接続

続いて、データベース接続を作成します。

SQL Developer パネルを開き、Oracle APEX 26.1 がインストールされた Oracle Database への新規接続を作成します。
接続情報（Name、Username、Password、Host、Port、Service Name/SID）を入力します。
「テスト」と「接続」をクリックして接続を検証し、保存します。

詳細な設定手順は Oracle SQL Developer for VS Code 接続ドキュメントを参照してください。

Step 3: APEXlang スキルのセットアップ

APEXlang Skills リポジトリには、再利用可能なプロンプト、ワークフロー、AI 支援開発パターンが含まれており、AI エージェントがアプリケーション構造やビジネスロジック、開発のベストプラクティスをより正確に理解できるようになります。

AI コーディングエージェントのローカルスキルフォルダ（環境によって .codex または .claude 配下）に APEXlang スキルをインストールします。

SQL Developer を開きます。
データベース接続を右クリックし、「SQLclを開く」を選択します。
以下のコマンドを実行し、Oracle APEX と Database のスキルをインストールします。

skills sync -skill-name apex,db

実行例）

SQLcl: 火 7月 28 18:00:09 2026のリリース26.2 Production

Copyright (c) 1982, 2026, Oracle.  All rights reserved.

パスワード (**********?) ******************
接続先:
Oracle Database 19c Enterprise Edition Release 19.0.0.0.0 - Production
Version 19.32.0.1.0

SQL> skills sync -skill-name apex,db
SUCCESS: Synchronized DBTools skills repository to /home/opc/.dbtools/skills/repositories/oracle-skills version latest (refs/heads/main -> 1c14d44ec523d9e98b6f182b2b5ce759a00cb35a).
SUCCESS: Installed 10 entries into agent skill locations.
SUCCESS: DBTools skills sync log: /home/opc/.dbtools/skills/logs/skills-sync-20260728T130731.669Z.log

スキルが正しくインストールされたことを確認するため、以下のコマンドを実行します。

skills list

実行例）

SQL> skills list
+========+===========+=================================================+
+ Skill  + Status    + Agents                                          +
+========+===========+=================================================+
| apex   | INSTALLED | claude-code, cline, dexto, github-copilot, warp |
+--------+-----------+-------------------------------------------------+
| db     | INSTALLED | claude-code, cline, dexto, github-copilot, warp |
+--------+-----------+-------------------------------------------------+
| fusion | AVAILABLE | none                                            |
+--------+-----------+-------------------------------------------------+
| graal  | AVAILABLE | none                                            |
+--------+-----------+-------------------------------------------------+
| oci    | AVAILABLE | none                                            |
+--------+-----------+-------------------------------------------------+

インストールされた APEXlang スキルが一覧表示され、AI コーディングエージェントから利用可能になります。

Skills リポジトリは随時更新されます。最新のスキルを取得するには、いつでも skills sync コマンドを再実行してください。

Step 4: SQLcl を AI コーディングエージェント向けに設定

AI コーディングエージェントにローカルの SQLcl インストール先を認識させる設定

コーディングエージェント	macOS/Linux	Windows	ドキュメント
Codex	`~/.codex/AGENTS.md`	`C:\Users\<user-id>\.codex\AGENTS.md`	OpenAI AGENTS.md Guide
Claude Code	`~/.claude/CLAUDE.md`	`C:\Users\<user-id>\.claude\CLAUDE.md`	CLAUDE.md Guide

CLAUDE.mdに、APEXlang 開発プロジェクト全体に自動的に適用されるエージェント固有の指示として、以下のようなガイダンスを追加します。

## Database Tooling
Use Local SQLcl CLI for Oracle Database-related tasks.
SQLcl executable: <path-to-sqlcl>
Before performing database-related tasks:
- Verify that SQLcl is available.
- Use SQLcl for schema inspection, SQL execution, metadata generation, and APEX development workflows.
- Do not store passwords or connection credentials in project files.

SQLcl は Oracle SQL Developer Extension for VS Code に同梱されています。標準的なインストール場所は以下のとおりです。

macOS/Linux: ~/.vscode/extensions/oracle.sql-developer-<version>/dbtools/sqlcl/bin/sql
Windows: C:\Users\<user-id>\.vscode\extensions\oracle.sql-developer-<version>\dbtools\sqlcl\bin\sql.exe

追記する内容の(<path-to-sqlcl>)は、実際の環境に合わせて更新してください。

SQLcl を MCP サーバーとして構成

Codex や Claude Code がスキーマメタデータを検査し、エージェントのインターフェース上で SQL/PL-SQL 開発を支援できるようになります。Claude Code の場合は、VS Code のターミナルで以下のコマンドを実行して SQLcl を MCP サーバーとして追加します。

claude mcp add --transport stdio --scope user sqlcl -- <path-to-sqlcl>/bin/sql -mcp

実行例)

$ claude mcp add --transport stdio --scope user sqlcl -- /home/opc/.vscode-server/extensions/oracle.sql-developer-26.2.0-linux-x64/dbtools/sqlcl/bin/sql -mcp
Added stdio MCP server sqlcl with command: /home/opc/.vscode-server/extensions/oracle.sql-developer-26.2.0-linux-x64/dbtools/sqlcl/bin/sql -mcp to user config
File modified: /home/opc/.claude.json

Windows では sql.exe を使用します。Oracle SQL Developer VS Code 拡張機能経由でインストールした場合、通常は拡張機能の dbtools/sqlcl/bin ディレクトリに配置されています。必要に応じて VS Code またはエージェントを再起動してください。詳細は SQLcl MCP introduction を参照してください。

Step 5: AI を使って APEX アプリケーションを生成・拡張

SQL Developer Extension for VS Code を使って新しくAPEXアプリケーションを生成し、APEXlang を使って拡張します。ここでは、「Employee Portal」アプリケーションを作成し、ローカルのプロジェクトディレクトリに保存します。

前提条件再掲: APEX ワークスペースの SQLワークショップ → ユーティリティ → サンプルデータセット から EMP/DEPT サンプルデータセットをインストールしておく必要があります。生成される Employee Portal アプリケーションは、このデータセットの EMP テーブルと DEPT テーブルを使用します。詳細は Installing Sample Dataset を参照してください。

APEXlang プロジェクトを作成

SQL Developer Extension for VS Code で APEX ワークスペーススキーマに接続します。
APEX フォルダに移動します。
右クリックして「生成」を選択します。
アプリケーションの詳細を入力します。
- アプリケーションの別名: EMPLOYEE_PORTAL
- アプリケーション名: Employee Portal
- フォルダ: ローカルのプロジェクトディレクトリ
「適用」をクリックしてプロジェクトを生成します。

生成された Employee Portal プロジェクトはローカルディレクトリに保存され、AI コーディングエージェントが APEXlang を使ってアプリケーションを構築・拡張するための土台となります。

APEXアプリケーションのインポートして確認

生成された Employee Portal アプリケーションを SQL Developer Extension でインポートし、動作を確認します。

VS Code で APEX_APPS フォルダを開きます。
任意のファイルを開きます。
エディタタブ右上の「アプリケーションのインポート」ボタンをクリックします。
インポートの完了
Oracle APEXのアプリケーションビルダーから「Employee Portal」アプリケーションが作成されていることを確認
「アプリケーションの実行」をクリックし、起動を確認

AI でアプリケーションを拡張

VS Code 内の Claude Code拡張機能を開き、以下のプロンプトを入力して Employee Directory ページを作成します。

Create an Employee Directory page with Faceted Search and Content Row results showing department as overline, employee name as title, and only location plus hire date in the description with those labels emphasised. Use an extra-small avatar icon and place a medium, rounded, subtle Job badge on the right.

実行例)

AI コーディングエージェントが APEXlang スキルを使ってAPEXアプリケーションを拡張します。生成された変更内容をレビューし、問題なければ変更を承認します。

<省略>
Summary
Created Page 2 – Employee Directory in employee_portal (pages/p00002-employee-directory.apx), wired into shared-components/lists.apx and breadcrumbs.apx:

Faceted Search (EMP_SEARCH, left column) with Search, Department, Job, Location, and Hire Date (range) facets, filtering the results region.
Content Row results (EMP_RESULTS, body) with:
Department as overline, employee name as title
Description limited to Location and Hire Date, each with a bolded label
Extra-small icon avatar (fa-user, size: extraSmall)
Medium, rounded, subtle Job badge positioned at the row's end (right)
The database this app normally points to (Chicago) was paused/unreachable, so per your choice I connected to Tokyo_LAK_kenwatan instead and built the query against its EMP_DEPT_V view (EMPNO, ENAME, JOB, HIREDATE, DNAME, LOC) — all column names are live-validated, not guessed. I've disconnected that session and didn't persist the password anywhere.

I also checked every plugin-avatar/plugin-badge attribute against Oracle's live-derived plugin metadata cache (icon type, extraSmall, subtle/rounded/medium, position: end) — all confirmed valid — and ran the local APEXlang lint, which passes clean for this page.

Note: nothing has been imported into a live APEX workspace — that would need the actual EMPLOYEE_PORTAL workspace (on the Chicago DB), which is still unreachable. Let me know once it's resumed and I can run a full live validate/import if you want.

アプリケーションのインポート

AI が生成した変更内容をレビューして承認したら、前述の「APEXアプリケーションのインポートして確認」と同じ手順で、更新されたアプリケーションを再度インポートします。

インポートが正常に完了したら、Oracle APEXのアプリケーションビルダーから、新しい Employee Directory ページが追加されていることを確認します。

ファセット検索ページが追加されていることを確認

インポート時にエラーが発生した場合は、VS Code の Problems パネルを開き、手動で修正するか、エラーメッセージを AI コーディングエージェントに渡して修正を依頼します。

(参考) インポートエラーのトラブルシューティング

インポート中にエラーが発生した場合は、VS Code の Problems パネルを開きます。

Windows: Ctrl + Shift + M
macOS/Linux: Command + Shift + M

エラー内容を確認し、以下のいずれかを行います。

手動で問題を修正する
エラーメッセージを AI コーディングエージェントに渡し、解決を依頼する

エラーメッセージを渡す際のプロンプト例は以下のとおりです。

The following error occurred during import: <PASTE ERROR HERE>
Analyze the issue and fix only the failing APEXlang source or related file. Do not modify unrelated components.

この反復的なアプローチにより、AI が生成した APEX アプリケーションの問題を素早く特定・解決できます。

アプリケーションを実行

Employee Portal アプリケーションを実行し、以下の表示を確認します。

アプリケーションのナビゲーションメニューに追加された新しい Employee Directory ページ
従業員・部門属性に基づく Faceted Search フィルター
Content Row レイアウトで表示される従業員レコード
各従業員のアバター
Job など主要な従業員属性を示すバッジ

作成されたアプリケーション

Step 6: クリーンアップ

検証後、不要になったリソースは以下の手順で削除します。

APEX Builder（App Builder）で、生成した「Employee Portal」アプリケーションを削除
インストールした EMP/DEPT サンプルデータセットが不要であれば、SQL Workshop からアンインストール
Claude Code を MCP サーバーとして SQLcl に登録した場合は、以下のコマンドで削除

claude mcp remove sqlcl

ローカルのプロジェクトフォルダ（APEX_APPS など）や、.claude/skills・.codex/skills にインストールした APEXlang スキルが不要であれば削除
必要に応じて、SQL Developer Extension で作成したデータベース接続を削除

おわりに

今回確認できたポイントは以下のとおりです。

VS Code の Oracle SQL Developer Extension と Claude Code 拡張機能が、Oracle APEX 開発環境になること
SQLcl から skills sync -skill-name apex,db を実行することで、APEXlang スキルを AI コーディングエージェントに認識させることができた
VS Code から Oracle APEXアプリケーションの生成ができた
Claude Code に自然言語プロンプトを与えることで、Faceted Search 付きの Employee Directory ページを APEXlang スキル経由で生成できた

留意事項

項目	内容
ライセンス・費用	AI コーディングエージェントおよび LLM は Oracle APEX のライセンスに含まれず、別途契約・費用が必要です
生成結果の再現性	使用するコーディングエージェント、モデルバージョン、アプリケーションの状態によって、AI が生成する変更内容が利用者ごとに異なる場合があります
エラー時の挙動	インポートエラーが発生した場合、自動修正ではなく Problems パネルでの確認と、手動修正または AI への再依頼が必要です

参考情報

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up