> For the complete documentation index, see [llms.txt](https://docs-embed.anyflow.jp/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs-embed.anyflow.jp/release-notes/code-solution.md).

# コードソリューション(β版)

### 1. コードソリューションとは

{% hint style="info" %}

##  **ご利用について**

コード化ソリューションは一部のお客様のみ利用できる限定機能です。ご利用を希望される場合は、弊社CSまでお問い合わせください。
{% endhint %}

Anyflow Embed の「ソリューション」は、通常 GUI（ノーコードエディタ）でトリガーステップやアクションステップを組み立てて作成します。コードソリューションでは、そのうちアクションの実行ロジック部分を TypeScript（Deno）を使ったコードで記述します。

Embed CLI でサーバーとローカルを同期し、コーディングエージェント（Claude Code / Codex など）で実装します。複雑な分岐処理やデータ加工など、GUI のステップ形式では表現しづらいロジックを直接コードで書きたい場合にご利用ください。

コードソリューションは、管理画面でソリューションを新規作成する際に「コード」を選択することで作成します。詳細は「4. ソリューション作成の流れ」を参照ください。

<figure><img src="/files/cjz29qEukhsNI4tvK2mC" alt="コード化ソリューションのエディタ画面" width="563"><figcaption><p>コード化ソリューションのエディタ画面</p></figcaption></figure>

{% hint style="info" %}
エディタ画面ではコードの編集はできず、閲覧のみ可能です。編集はローカル環境で行ってください。
{% endhint %}

#### ■ イメージ：ソリューション構築の流れ

{% embed url="<https://files.gitbook.com/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2SAP0zfldVFDluPfMXkq%2Fuploads%2F7tobIkpYJ1djOSMRIPSs%2Fkinton_Slack%E3%83%87%E3%83%A2_compressed.mp4?alt=media&token=d783ff88-7be5-4eda-8114-620bde562423>" %}

### 2. 全体像

コードソリューションは次の二層で構成されます。

<table><thead><tr><th width="120.80078125">レイヤー</th><th>何を決めるか</th><th>どこで編集するか</th></tr></thead><tbody><tr><td><strong>処理部分</strong></td><td>データ取得・加工・登録などのロジック</td><td><strong>コード</strong>（<code>main.ts</code>）</td></tr><tr><td><strong>定義部分</strong></td><td>トリガー、エンドユーザー変数、ウィザード設定など</td><td><strong>管理画面（GUI）</strong><code>solution.lock</code> にスナップショットされる</td></tr></tbody></table>

定義部分には次の 3つが含まれます。現時点ではいずれも GUI 側で設定し、コードでは変更できません。

* **トリガー**: ソリューション実行の起点となるアプリとトリガーの種類、その出力スキーマ
* **エンドユーザー変数**: 導入先のエンドユーザーに入力させるフィールド
* **ウィザード設定**: エンドユーザー向けセットアップ UI（画面構成・ウィジェット・ラベル）

### 3. セットアップ

セットアップは大きく 3 つです: Deno → Embed CLI → ログイン

#### 3-1. Deno のインストール

コード化ソリューションは Deno で記述します。公式ガイドに従ってインストールしてください。

公式: <https://docs.deno.com/runtime/#quick-install>

```bash
curl -fsSL https://deno.land/install.sh | sh
```

PATH が通っているか確認します。

```bash
deno --version
# deno 2.x.x (stable, release, ...)
```

{% hint style="info" %}
補足: エディタで直接コードを見る場合は、[VS Code の Deno 拡張](https://marketplace.visualstudio.com/items?itemName=denoland.vscode-deno)を入れると型補完・診断が効きます。 `F1` → `Deno: Initialize Workspace Configuration` で有効化してください。
{% endhint %}

#### 3-2. Embed CLI のインストール

```bash
curl -fsSL https://cli.embed.anyflow.jp/install.sh | sh
```

* `embed` というファイル名のバイナリが `~/bin` に入ります。`~/bin` を PATH に通してください。
* `curl` と `unzip` が必要です。
* 動作確認:

```bash
embed version
```

{% hint style="info" %}
**Windows 環境について**: Windows 用のバイナリ配布はありません。WSL を利用してください。
{% endhint %}

#### 3-3. ログイン

```bash
embed login -o <組織名>
```

組織名は、管理画面にログインする際に使うものと同じです。

ログインは Auth0 を介した OAuth 2.0 (Authorization Code Flow) で行われます。ログインコマンドを実行するとブラウザが自動的に開きます。ブラウザを開くコマンドが見つからなかった場合、Auth0 の認可URLがコンソールに表示されます。ご自身でアクセスしていただくと認証完了します。

<figure><img src="/files/cVEhR27rwCFMNjcQzY1b" alt="認証完了時にブラウザへ表示される画面"><figcaption><p>認証完了時にブラウザへ表示される画面</p></figcaption></figure>

* ログイン状態の確認:

```bash
embed me
```

### 4. ソリューション作成の流れ

<pre data-title="全体の流れ"><code>管理画面でコードソリューションを作成
        │
        ▼
空ディレクトリを作ってサーバーからローカルへ取得 (embed pull &#x3C;solution id>)
        │
        ▼
<strong>任意で skills の追加 (npx skills add)
</strong>        │
        ▼
コードの実装 (main.ts を編集)
        │
        ▼
サーバに反映 (embed push)
</code></pre>

#### **4-1. 管理画面でコードソリューションを作成**

ソリューションは管理画面で作成します。「コード化が有効な組織」であれば、ソリューションの初期画面でコードを選べます。トリガー・エンドユーザー変数・ウィザードなどの定義部分はここで設定します。

<figure><img src="/files/Q8G8pkwekOZljs6bR9aD" alt="コード化ソリューション作成画面" width="244"><figcaption><p>コード化ソリューション作成</p></figcaption></figure>

#### **4-2. 空ディレクトリを作って pull**

```bash
mkdir my-solution && cd my-solution
git init
embed pull <solution-id>
```

pull コマンドはサーバの状態をローカルにするです。管理画面のURLに含まれる `solution-id` をコピーして pull コマンドに渡してください。ソリューション作成直後に遷移する管理画面のURLの構造を次に示します: `https://embed.anyflow.jp/solutions/<solution-id>/workflow`

{% hint style="info" %}
初回 pull はディレクトリが空であることを要求します（`.git` / `.gitignore` は例外として許可されます）。

また git 管理は必須ではありませんが、あとから変更履歴を追ったりロールバックしたりする場合は、pull の前に `git init` しておくのがおすすめです。
{% endhint %}

#### **4-3. skills を追加**（任意）

skills はコーディングエージェント向けの参照情報です。`npx skills add` コマンドで skills を追加すると、エージェントは Embed CLI の基本的な使い方に加えて、使用するアプリクライアント（`@anyflowinc/<name>`）の API リファレンスを参照できるようになります。Embed CLIおよびコードソリューションについての概観、制約、トラブルシューティングの3種類のskillを用意しています。これらの skills を入れなくても動作しますが、コーディングエージェントが実装で迷いにくくなるため追加を推奨します。

インストール範囲は用途に応じて選んでください。

```bash
npx skills add https://cli.embed.anyflow.jp          # プロジェクト単位（実行したディレクトリのみ）
npx skills add https://cli.embed.anyflow.jp -g       # マシン全体（以降作成する全ソリューションで有効）
```

* **プロジェクト単位**: `./<agent>/skills/` に追加されます。`solution.lock` などと同様に git 管理できますが、ソリューションごとに再実行が必要です。
* **マシン全体（`-g`）**: `~/<agent>/skills/` に追加されます。一度実行すれば、以降作成するソリューションで再実行は不要です。

追加時にどのエージェント向けに設定するかを選択します。追加後は、利用しているエージェントのスキル一覧から反映されているか確認できます。

#### **4-4. コードの実装**

コーディングエージェント（Claude Code / Codex など）に要件を伝えて `main.ts` を実装してもらいます。

連携可能なSaaSクライアントは `embed libs` で確認できます。

```bash
embed libs                     # 利用可能な @anyflowinc/* クライアント一覧
deno add @anyflowinc/<name>    # 必要なものを追加
```

#### **4-5. サーバーへ反映**

push コマンドはローカルの状態をサーバに同期するコマンドです。push コマンドで編集したコードをサーバに反映させます。

```bash
embed push
```

### 5. ファイル構成と所有境界

pull するとおおよそ次の構成になります。

<table><thead><tr><th width="264.9375">パス</th><th>所有者</th><th>編集してよいか</th></tr></thead><tbody><tr><td><code>main.ts</code></td><td>あなた（user）</td><td>✅</td></tr><tr><td><code>main.ts</code> が import するファイル</td><td>user</td><td>✅</td></tr><tr><td><code>deno.json</code></td><td>共有</td><td>✅ （※後述の 1 エントリだけ注意）</td></tr><tr><td><code>generated/types.ts</code></td><td>サーバー</td><td>❌  自動生成のためのため</td></tr><tr><td><code>solution.lock</code></td><td>サーバー生成 / ユーザー選択</td><td>❌ GUI 設定のスナップショットであるため</td></tr><tr><td><code>.embed/</code></td><td>CLI</td><td>❌ CLI の同期状態であるため</td></tr></tbody></table>

{% hint style="info" %}
`deno.json` は `imports` / `tasks` / `compilerOptions` など全体を編集して構いませんが、例外として `compilerOptions.types` の `"./generated/types.ts"` エントリは消さないでください。消すとソリューション固有の型が読み込まれません。
{% endhint %}

### 6. コードの書き方

#### エントリポイントは `main.ts`&#x20;

`workflow` 関数を `export` します。

```typescript
import type { TriggerOutput, WorkflowContext } from "@anyflowinc/embed-types";

export async function workflow(
  triggerOutput: TriggerOutput,
  context: WorkflowContext,
): Promise<void> {
  // ここに処理を書く
}
```

#### 入力の型を確認する（`TriggerOutput` / `EndUserInputs`）

`TriggerOutput` と `EndUserInputs` は `generated/types.ts` に定義されます。GUI で設定したトリガーステップ / エンドユーザー変数の定義によって決定します。このファイルは自動生成されるため、編集しないでください。

```typescript
// generated/types.ts （自動生成・編集しない）
declare module "@anyflowinc/embed-types" {
  interface TriggerOutput {
    /**
     * Click User Name
     * 例: "サンプルユーザ名"
     */
    click_user_name?: string;
  }
  
  interface EndUserInputs {
    slack_channel: string;
  }
}
```

#### アプリクライアント（`@anyflowinc/<name>`）

外部 SaaS への読み書きは `@anyflowinc/<name>` クライアント経由で行います。利用可能なクライアントは `embed libs` で確認し、`deno add @anyflowinc/<name>` で追加します。

### 7. 制約

#### 実行環境の制約

実行環境はサンドボックス化されています。SaaS 連携はアプリクライアント経由で行います。一般的な JS/TS ライブラリ含め、`deno add` コマンドでライブラリを自由に追加できます。

* **メモリ上限**: 1GiB
* **最長実行時間**: 60min
* **ファイルシステムへの書き込み**: 非対応

#### β版での制約

* **実行ログの確認**: コード中の console.log などは画面上のログとして表示されません。確認したい値は Slack / Google Sheets / Google Drive 等のアプリクライアント経由で出力してください。
* **動作確認:** ローカルでの実行コマンドは提供していません。変更を確認するには embed push した上で、テスト実行をしてください。ジョブの結果のみ確認できます。
* **デプロイ**: エンドユーザーへのソリューションの提供はまだできません。ソリューションの実行はテスト実行のみとなっています。
* **アプリクライアント:** GUI版のソリューションで使用できるアプリすべてには対応していません。順次追加していく予定です。
* **管理画面でのファイル閲覧:** 管理画面ではすべてのファイル内容の閲覧はできません。現在は main.ts のみ閲覧ができます。

### 8. トラブルシューティング

<table data-search="false"><thead><tr><th>症状</th><th>対処</th></tr></thead><tbody><tr><td><code>embed</code> が見つからない</td><td><code>~/bin</code> が PATH に通っているか確認 → <code>embed version</code></td></tr><tr><td>VS Code でコード補完・診断が出ない</td><td>プロジェクトで Deno 拡張を有効化（<code>F1</code> → <code>Deno: Initialize Workspace Configuration</code>）。クライアントは <code>deno add</code> で追加</td></tr><tr><td><code>triggerOutput</code> の中身が分からない</td><td><code>generated/types.ts</code> を読む</td></tr><tr><td>クライアントの正しい使い方が分からない</td><td>該当パッケージの <code>reference.md</code>（<code>node_modules/@anyflowinc/&#x3C;name>/reference.md</code>）を参照</td></tr><tr><td>実行結果・ログが見えない</td><td>「7. 現在の制約」を参照</td></tr><tr><td><code>embed push</code> がコンフリクトで止まる</td><td>マーカー解決 → 再 <code>embed pull</code>（ゼロ件で完走するとクリア）</td></tr><tr><td>Windows で動かない</td><td>WSL を使う</td></tr><tr><td>認証切れ（exit 3）</td><td>再度 <code>embed login -o &#x3C;組織名></code></td></tr></tbody></table>


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs-embed.anyflow.jp/release-notes/code-solution.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.