정적 웹사이트에 데이터를 더하세요.

{
  "title": "첫 번째 글"
}

<ul id="posts"></ul>
<script type="module">
  import { createNaru } from "https://sdk.naru.pub/sdk/1.0.0/naru.js";
  const naru = createNaru({ site: "example" });
  const { documents } = await naru.collection("posts").list();
  for (const post of documents) {
    const item = document.createElement("li");
    item.textContent = post.data.title;
    document.querySelector("#posts").append(item);
  }
</script>

<button id="hello">인사 남기기</button>
<p id="result"></p>
<script type="module">
  import { createNaru } from "https://sdk.naru.pub/sdk/1.0.0/naru.js";
  const naru = createNaru({ site: "example" });
  const button = document.querySelector("#hello");
  const result = document.querySelector("#result");
  button.onclick = async () => {
    button.disabled = true;
    try {
      const saved = await naru.collection("guestbook").add({
        name: "방문자",
        message: "안녕하세요!",
      });
      result.textContent = saved.data.message + " 저장됨";
    } catch (error) {
      result.textContent = "결과를 확인하지 못했습니다. 방명록을 확인하세요.";
      console.error(error);
    }
  };
</script>

{
  "collections": {
    "guestbook": { "read": "world", "write": "create" },
    "settings": { "read": "admin", "write": "admin" }
  }
}

<button id="login">관리자 로그인</button>
<p id="auth-status"></p>
<script type="module">
  import { createNaru } from "https://sdk.naru.pub/sdk/1.0.0/naru.js";
  const naru = createNaru({ site: "example" });
  const admin = await naru.auth.session();
  const login = document.querySelector("#login");
  login.hidden = !!admin;
  document.querySelector("#auth-status").textContent = admin
    ? "로그인되었습니다."
    : "글을 고치려면 로그인하세요.";
  login.onclick = () => naru.auth.signIn({ collections: ["posts", "drafts"] });
  // 다음 예제의 owner는 이 스크립트 안에서 사용하세요.
</script>

const post = await admin.collection("posts").get("hello");
try {
  await admin
    .collection("posts")
    .set(
      "hello",
      { ...post.data, title: "새 제목" },
      { condition: { revision: post.revision } },
    );
} catch (error) {
  if (error.code !== "CONFLICT") throw error;
  alert("다른 곳에서 먼저 저장했습니다. 새로고침 후 다시 시도하세요.");
}

const [saved] = await admin.batch([
  { collection: "posts", set: { id, data: post, condition: { absent: true } } },
  {
    collection: "drafts",
    delete: { id, condition: { revision: draft.revision } },
  },
]);
// saved.revision → 다음 저장의 condition

const posts = naru.collection("posts");
const post = await posts.get("hello");
// → { id, data, revision, createdAt, updatedAt }

const query = {
  filter: { category: "일상", date: { gte: "2026-09-01" } },
  sort: [["date", "desc"]],
};
const page = await posts.list({ ...query, size: 20 });
// → { documents, nextCursor }

if (page.nextCursor) {
  const next = await posts.list({ ...query, size: 20, after: page.nextCursor });
  console.log(next.documents);
}

// 조건에 맞는 문서 수
const total = await posts.count({ filter: query.filter });

// 끝까지 한 쪽씩 (nextCursor를 대신 따라갑니다)
for await (const { documents } of posts.pages({ ...query, size: 100 })) {
  console.log(documents);
}

naru.collection("posts").list({
  sort: [["date", "desc"]],
});

naru.collection("guestbook").add({ name, message });

naru.collection("inquiries").add({ email, message });

admin.batch([
  { collection: "posts", set: { id, data, condition: { absent: true } } },
  {
    collection: "drafts",
    delete: { id, condition: { revision: draft.revision } },
  },
]);

const image = await admin.media.upload(file);
const posts = admin.collection("posts");
const post = await posts.get(id);
await posts.set(
  id,
  { ...post.data, cover: image.url },
  { condition: { revision: post.revision } },
);

naru.collection("comments").list({
  filter: { postId: "hello" },
});

try {
  await naru.collection("guestbook").add({ message });
} catch (error) {
  status.textContent =
    error.code === "RATE_LIMITED" ? "잠시 후 다시 시도하세요." : error.message;
}