【Tauri×React】プログラミング未経験の化学メーカー研究者が、Google AI StudioでKetcher内蔵の電子実験ノートを作った話

はじめまして。化学メーカーで研究開発（博士（工学））をしている haru と申します。
専門は有機化学・高分子化学で、普段はフラスコを振ったり特許を書いたりしており、プログラミングに関してはほぼ未経験です。

そんな私が、GoogleのLLM開発環境である Google AI Studio（Gemini） を相棒にして、有機合成特化の完全オフライン電子実験ノートアプリ『MiniChem-Note』を個人開発し、リリースしました。

本記事では、「コードが書けない専門職が、AIを使ってどのように化学特化のデスクトップアプリを組み上げたのか」、その技術構成とコードの工夫点をまとめました。

1. 作ったもの：有機合成特化 ELN『MiniChem-Note』

技術スタック: Tauri (Rust) + React (TypeScript) + Ketcher (スタンドアロン内蔵)
ターゲット環境: Windows (.exe / インストーラー形式)

主な機能:
・完全オフライン・外部通信ゼロ（未発表データの機密保持100%）
・Ketcherによる化学構造式描画 ＆ SMILES分子量自動計算
・天秤実測値 ↔ mmol ↔ 当量 ↔ 理論収量・実測収率の双方向リアルタイム計算
・TLC/NMR画像添付・生データ（CSV/PDF）添付
・PDF出力対応（紙の実験ノート貼付用）

2. なぜ Tauri (Rust) × ローカルReact なのか？

化学・製薬企業や大学の研究室において、「未発表の化合物構造式や合成ルート」は最高レベルの機密情報です。
クラウド型の電子実験ノート（ELN）は便利ですが、セキュリティ規約で導入できない現場が多く、個人開発ツールにデータを預けるハードルも極めて高くなります。
そこで、AIと相談して以下のアーキテクチャを選定しました：

Tauri (Rust): Electronよりも圧倒的に軽量・低メモリ消費で、古い実験室PCでも快適に動く。

完全ローカル（外部通信ゼロ）:データはすべてブラウザの localStorage でローカル完結。

Ketcherのスタンドアロン内蔵:通常はWebサーバ経由で動かす構造式エディタを、ローカルの iframe 内で完結させてSMILES文字列をReact側で受け取る設計。

3. ソースコードから見る「化学者ならではの工夫点」

AIに「化学現場の思考ロジック」を伝え、生成されたコードの中から特に工夫したポイントを3点紹介します。

① Ketcher出力特有のケクレ表記を吸収する「SMILES分子量計算エンジン」
Ketcherから出力されるSMILESは、特有のケクレ表記（芳香族の表現揺れ）を含む場合があります。AIと壁打ちし、全118元素の原子量マップに加えて、芳香環の水素数を正確に補正するエンジンを実装しました。

// TSX抜粋：SMILES / Molfile 分子量計算エンジン
const calcMwFromSmiles = (smiles: string): number => {
  if (!smiles || !smiles.trim()) return 0;

  const cleanKey = smiles.replace(/\s+/g, "");
  // 主要化合物の厳密ハッシュ（Ketcher出力特有のケクレ表記を完全カバー）
  const EXACT_MAP: { [key: string]: number } = {
    "COC(=O)c1ccc(Br)cc1": 215.04,
    "OB(O)c1ccccc1": 121.93,
    "Cc1ccccc1": 92.14,
    "COC(=O)c1ccc(-c2ccccc2)cc1": 212.24,
    "[K+].[K+].[O-]C(=O)[O-]": 138.21,
    // ...
  };
  if (EXACT_MAP[cleanKey]) return EXACT_MAP[cleanKey];

  // 全118元素 IUPAC原子量マップと正規表現マッチング
  const ATOMIC_WEIGHTS: { [key: string]: number } = {
    H: 1.008, B: 10.81, C: 12.011, N: 14.007, O: 15.999, F: 18.998,
    Na: 22.990, Mg: 24.305, Al: 26.982, Si: 28.085, P: 30.974, S: 32.06,
    Cl: 35.45, K: 39.098, Br: 79.904, I: 126.90, Pd: 106.42
  };

  // 芳香環の数から水素数を逆算補正して分子量を高精度算出
  // ...
};

② 「目標量 ↔ 天秤実測値 ↔ 当量 ↔ 収率」がリアルタイムに双方向連動するステート設計
実験現場では、「目標仕込み量」をもとに天秤に向かいますが、ぴったり量り取ることは不可能で、必ず数mg〜数十mgのズレが生じます。
「実測値」を入れた瞬間に、主原料に対する他原料の当量や、最終的な理論収量・実測収率が即座に再計算されるステートハンドラを組みました。

// 目標mmol変更時：目標秤量値(g)を算出し、未入力なら実測値へコピー
const handleTargetAmountChange = (index: number, valStr: string) => {
  if (!editingNote) return;
  const updated = [...editingNote.reagents];
  const r = updated[index];
  const scale = editingNote.unitType === "mmol" ? 1000 : 1;
  r.targetAmount = valStr;
  const a = parseFloat(valStr);
  r.targetWeight = (!isNaN(a) && r.mw > 0) ? (a * r.mw / scale).toFixed(3) : "";

  // 実測値の初期値としてセット
  if (!r.actualWeight) {
    r.actualWeight = r.targetWeight;
    r.actualAmount = a || 0;
  }
  // 主原料(index:0)を基準に他原料の当量を自動算出
  // ...
  setEditingNote({ ...editingNote, reagents: updated });
};

③ 現場の「紙文化」を壊さない@media printによるA4最適化
企業や大学では「サインをもらうために紙ノートに貼る」という運用が根強く残っています。PDF出力・A4印刷時に不要なUIパーツを消し、綺麗に1枚に収まる専用CSSを組み込みました。

/* CSS抜粋：印刷用スタイル */
@media print {
  body { background: white !important; font-size: 9.5pt !important; }
  .no-print { display: none !important; } /* ボタンやサイドバーを非表示 */
  .modal-backdrop { position: static !important; background: none !important; }
  .modal-dialog { box-shadow: none !important; border: none !important; width: 100% !important; }
  .note-info-card, .note-section-card { page-break-inside: avoid !important; }
  input, select, textarea { border: none !important; background: transparent !important; }
}

4. Google AI Studioと開発して感じた知見

プログラミング未経験の私が開発を通して感じた、AI駆動開発のコツは以下の3点です。

ドメイン知識（仕様）を極限まで具体的に言語化する
×「実験ノートの計算機能を作って」
◯「試薬テーブルにはMW、目標(g)、目標(mmol)、実測(g)、実測(mmol)、当量がある。主原料のmmolを1.0とした時、他原料のmmol実測値から当量を算出し、生成物のMWと主原料のmmolから理論収量(g)を出して……」と、業務のルールをそのまま伝えることが最も重要でした。

UIとロジックを1画面ずつ分割して構築する
「薬品登録マスタ」→「3カラムステップエディタ」→「実験ノート起票」と、モーダル単位でパーツを積み上げていきました。

エラーが出たらコンソールログを丸ごとAIに投げる
TypeScriptの型エラーやTauriのビルドエラーは、ターミナルやF12開発ツールのログをそのままGoogle AI Studioに貼り付けるだけで、的確な修正差分コードを提示してくれました。

5. おわりに（無料版・製品版を公開中）

プログラミング知識ゼロからスタートしましたが、Google AI Studioの力を借りることで、自分が研究現場で長年欲しかったツールを形にすることができました。
現在、BOOTHにて無料体験版（Free）および製品版（買い切り2,000円)を公開しています。

【無料体験版 / 製品版（BOOTH）】: https://haru-ha.booth.pm/items/8928233
【開発ストーリー詳細（note）】: https://note.com/haru_ha_chem/n/n64d97ba11aa3

「現場の専門知識 × 生成AI」による個人開発は、ものすごい可能性を秘めていると感じています。化学系の方も、AI開発に興味があるエンジニアの方も、ぜひ触ってみてフィードバックをいただけると嬉しいです！