静的ファイルで小説サイトを作ったら「日本語名textが読めない」→ novel.js を切って解決した話（目から鱗）

静的ファイルだけで小説の更新ができるWebサイトを作っていました。
更新作業は「Antigravity に“この文章を反映してね”」と指示する運用。

で、最初にやろうとしたのがこれ👇

小説本文を text ファイルで用意

しかもタイトル管理しやすいように 日本語ファイル名（例：第3話_君の手.txt）

……ところが、Antigravity 側で 「textファイルが読めない」 と言われて詰みました。

「え、じゃあ更新どうするの？」ってなった時に出てきたのが、本文を“データ”として持つという発想。
これが本当に目から鱗だった。

---

解決策：本文をJSの配列データにする（novel.js）

novel.js を作って、小説データを const novelData = [...] で持つ方式に変更。

ファイル名に依存しない

文字コードや改行の扱いが安定しやすい

HTML側は「データを表示するだけ」になる

最低限の形はこんな感じ。

// novel.js
const novelData = [
  {
    date: "2026.02.06",
    title: "日本語タイトル",
    content: "本文"
  }
];

ポイントは content を文字列として持つこと。
本文が長い場合はテンプレートリテラルが楽です。

const novelData = [
  {
    date: "2026.02.06",
    title: "日本語タイトル",
    content: `本文が長いときは
複数行でもOK。

改行もこのまま書ける。`
  }
];

---

何が嬉しかったか

1. “更新”がシンプルになる

novel.js に1要素足すだけで新話追加できる

Antigravityへの指示も「この配列を反映して」で済みやすい

1. 日本語ファイル名問題から解放される

「ファイルが読めない」系の事故、だいたいここが地雷だったので、
データ構造に逃がすのはかなり強い。

1. 後から拡張が簡単

例えば…

• id
• tags
• series
• summary
• published: true/false

みたいな運用も、配列の項目を増やすだけで対応できる。

まだ.jsの運用は分からないことだらけなので、Antigravityがもたらす知見は学びがあるなと思ったのでした。