AI再生成に壊されない設計 — Rork の生成コードと手書きロジックを分ける境界の引き方

境界を実装する — service層とstoreを画面の外へ

具体的なファイル構成に落とし込みます。React Native（Expo）で生成されたプロジェクトを前提にします。Rork Maxが生成するSwiftでも、層を分ける原則はそのまま通用します。

守りたいロジックを、次の三種類のファイルに分けて画面の外へ置きます。

まず契約となる型を置きます。これが層と層をつなぐ約束です。

// src/domain/types.ts — 自分が所有。AIには触らせない。
export interface PurchaseState {
  isPremium: boolean;
  purchasedAt: string | null;
}
 
export interface PurchaseService {
  restore(): Promise<PurchaseState>;
  buy(productId: string): Promise<PurchaseState>;
}

次にservice。課金の実体はここに閉じ込めます。通信のリトライや、失敗時に権限を与えない判断（deny by default）も、この一枚の中で完結させます。

// src/domain/purchaseService.ts — 自分が所有。
import type { PurchaseState, PurchaseService } from './types';
 
const FALLBACK: PurchaseState = { isPremium: false, purchasedAt: null };
 
export const purchaseService: PurchaseService = {
  async restore() {
    try {
      const res = await fetch('https://api.example.com/purchase/restore');
      if (!res.ok) return FALLBACK; // 不明なら非課金として扱う
      return (await res.json()) as PurchaseState;
    } catch {
      return FALLBACK; // 通信失敗時も権限を広げない
    }
  },
  async buy(productId) {
    const res = await fetch('https://api.example.com/purchase/buy', {
      method: 'POST',
      body: JSON.stringify({ productId }),
    });
    if (!res.ok) throw new Error('purchase_failed');
    return (await res.json()) as PurchaseState;
  },
};

そして状態を持つstore。ここではZustand v5を使います。画面はこのフックを呼ぶだけになります。

// src/domain/usePurchaseStore.ts — 自分が所有。
import { create } from 'zustand';
import type { PurchaseState } from './types';
import { purchaseService } from './purchaseService';
 
interface PurchaseStore extends PurchaseState {
  restore: () => Promise<void>;
  buy: (productId: string) => Promise<void>;
}
 
export const usePurchaseStore = create<PurchaseStore>((set) => ({
  isPremium: false,
  purchasedAt: null,
  restore: async () => set(await purchaseService.restore()),
  buy: async (productId) => set(await purchaseService.buy(productId)),
}));

ここまでが自分の所有物です。src/domain/ の三ファイルには、アプリの判断がすべて詰まっています。そしてこの三つは、画面をどれだけ作り直しても影響を受けません。

画面は「呼ぶだけ」にしておく

AIに所有させる画面側は、驚くほど薄くなります。

// app/home.tsx — AIが再生成してよい領域。
import { View, Text, Button } from 'react-native';
import { usePurchaseStore } from '../src/domain/usePurchaseStore';
 
export default function HomeScreen() {
  const { isPremium, buy } = usePurchaseStore();
  return (
    <View>
      <Text>{isPremium ? 'プレミアム会員' : '無料プラン'}</Text>
      {!isPremium && (
        <Button title="購入する" onPress={() => buy('premium_lifetime')} />
      )}
    </View>
  );
}

この画面が丸ごと作り直されても、失われるのはレイアウトだけです。usePurchaseStore を呼ぶ一行と、isPremium による分岐の意図さえ残れば、課金判定の中身は src/domain/ で無事です。仮にAIが分岐を書き落としても、影響は「表示が一つ変わる」に留まり、判定ロジックそのものは壊れません。

Before と After を並べると、守りの差がはっきりします。

「この画面だけ作り直して」を安全に言う

境界があると、Rorkへの指示も具体的で安全になります。あいまいな「直して」ではなく、作り直してよい範囲を名指しできます。

app/home.tsx のレイアウトだけを二カラムに作り直してください。
src/domain 配下のファイルは読み取り専用として、一切変更しないでください。
usePurchaseStore の呼び出しと isPremium による分岐は必ず残してください。

ポイントは、守ってほしい対象がディレクトリという明確な単位になっていることです。「あの色は変えないで」のような、AIが解釈に迷う指示ではありません。src/domain という境界を指すだけで、意図が一意に伝わります。

さらに型契約が安全網として働きます。もしAIが PurchaseState の形を無視した画面を書けば、TypeScriptが即座に型エラーを出します。境界を越えた変更は、コンパイルの段階で自分に知らされる。プロンプトの丁寧さではなく、型システムが検知してくれる状態を作れます。

長く運用して分かった、境界の引きすぎという落とし穴

この設計を六つのアプリに入れて運用してきて、効き目と同じくらい、やりすぎの危うさも見えてきました。

一つは、境界を細かく刻みすぎることです。画面ごとにservice層とstoreを作ると、ファイルばかり増えて全体が見通せなくなります。守るべきは「作り直されたら困るもの」だけです。単なる表示用の一時状態まで src/domain に上げる必要はありません。迷ったら、間違えたときにお金・信頼・データの整合が損なわれるかを基準にします。

もう一つは、境界を越える誘惑です。急いでいるとき、つい画面の中に直接fetchを書きたくなります。一度それをやると、次のAI再生成でそのロジックは消えます。境界は、自分が守り続けて初めて意味を持ちます。私は app/ 配下でのfetch呼び出しを禁じる簡単なlintルールを一本入れて、自分の弱さを機械に見張ってもらうことにしました。

そして、境界は最初から完璧である必要はありません。個人開発では手を広げすぎると回らなくなるので、次の順に少しずつ移すのが現実的だと考えています。

1. 一番痛いロジック、多くの場合は課金判定を画面の外へ出します。それだけで、再生成のたびに失われていた最悪の一つが消えます。
2. 効果を確かめたら、データ取得と外部通信を service へ移します。ここが二番目に壊れて痛い場所です。
3. 最後にローカル保存の整合を store へ集約します。ここまで来れば、画面は安心して作り直させられます。

おわりに — 今日、外へ出す一つを決める

プロンプトで守る開発から、構造で守る開発へ。境界を引くという発想の転換は、Rorkのように何度も再生成を重ねる道具と長く付き合ううえで、静かに効いてきます。

今日できることを一つだけ挙げるなら、いま一番「作り直されたら困る」ロジックを見つけて、src/domain/ という一つのフォルダへ移すことです。画面からは呼ぶだけにする。次にRorkへ画面の変更を頼んだとき、そのロジックが無事に残っているのを確かめられたら、この設計はあなたのアプリに根づき始めています。

生成された画面の一つ深いところに、作り直されない芯を持たせておく。私自身まだ試行錯誤の途中ですが、この芯があるだけで、AIに任せる部分を安心して広げられるようになりました。お読みいただきありがとうございました。