Arsitektur

github-roast adalah aplikasi SvelteKit yang di-build oleh @sveltejs/adapter-cloudflare dan disajikan sebagai Cloudflare Pages svelte.config.js:1-13¹. Aplikasi hanya punya dua permukaan: satu halaman yang dirender di browser dan satu endpoint server. Seluruh logika server, termasuk panggilan ke GitHub dan OpenAI, berada di dalam satu berkas, src/routes/llama/+server.js:29-31².

Lapisan dan batas kepercayaan

graph TD
  subgraph browser["Browser, input belum dipercaya"]
    page["+page.svelte / handleRoast"]
    markdown["SvelteMarkdown"]
  end
  subgraph edge["Cloudflare Pages, runtime server"]
    layout["+layout.svelte / slot"]
    server["POST /llama"]
    cache["SELECT roasts ... gh_username, language"]
  end
  d1[("D1 binding DB")]
  gh["api.github.com/users"]
  raw["raw.githubusercontent.com README.md"]
  oai["OpenAI gpt-4o-mini"]
  reject["400 invalid language specified"]
  layout --> page
  page -->|"fetch POST /llama"| server
  server -->|"cek validLanguages"| reject
  server -->|"cache hit"| cache
  cache --- d1
  server -->|"INSERT roasts"| d1
  server -->|"profil dan repos"| gh
  server -->|"README"| raw
  server -->|"chat.completions"| oai
  oai -->|"roast"| server
  server -->|"json roast"| page
  page --> markdown
  style d1 fill:#336791,color:#fff
  style cache fill:#8b5cf6,color:#fff
  style server fill:#f59e0b,color:#000
  style reject fill:#dc2626,color:#fff
  style oai fill:#2d7d46,color:#fff
%% fig: Lapisan github-roast dan batas kepercayaan
%% desc: Halaman Svelte di browser memanggil satu endpoint /llama di Cloudflare Pages, yang membaca D1, GitHub, dan OpenAI.

Lapisan browser hanya berisi satu halaman: +page.svelte memegang state username, selectedLanguage, roast, dan loading, lalu mengirim POST ke /llama dengan body { username, language } src/routes/+page.svelte:34-45³. Hasil data.roast ditampilkan lewat SvelteMarkdown, sehingga teks dari model diperlakukan sebagai Markdown, bukan HTML mentah src/routes/+page.svelte:104-111⁴. +layout.svelte tidak menambah apa pun selain import '../app.css' dan <slot /> src/routes/+layout.svelte:1-5⁵, jadi tidak ada lapisan pembungkus yang menyembunyikan alur data.

Halaman itu sendiri dijadikan aset statis: +page.js mengekspor prerender = true dengan alasan tidak ada data dinamis di halaman src/routes/+page.js:1-3⁶. Batas kepercayaan karena itu jatuh tepat di /llama: POST menerima request dan platform sebagai satu-satunya pintu masuk data dari luar src/routes/llama/+server.js:29-31².

Di sisi server, input divalidasi terhadap daftar validLanguages src/routes/llama/+server.js:15-27⁷. Daftar ini lebih pendek daripada daftar languages di halaman, yang juga memuat italian, german, finnish, dan portuguese src/routes/+page.svelte:12-28⁸. Akibatnya keempat nilai itu ditolak oleh json(..., { status: 400 }) walau bisa dipilih di UI src/routes/llama/+server.js:33-38⁹.

Rahasia tidak pernah menyeberang ke browser. OPENAI_API_KEY dan GITHUB_API_KEY diimpor dari $env/static/private, lalu OPENAI_API_KEY langsung dipakai membentuk instance OpenAI src/routes/llama/+server.js:1-7¹⁰. GITHUB_API_KEY hanya disisipkan sebagai header Authorization di sisi server src/routes/llama/+server.js:49-51¹¹.

Peran tiap berkas

Ketergantungan keluar dari sisi server

Endpoint /llama memanggil empat tujuan luar. Tabel ini hanya memetakan ketergantungannya; urutan pemanggilan dibahas di Alur Permintaan Roast dan bentuk datanya di Pengumpulan Data Profil GitHub.

Binding dan konfigurasi runtime

wrangler.toml menamai proyek githubroast, menetapkan compatibility_date = "2024-07-29", dan mengarahkan output build ke .svelte-kit/cloudflare wrangler.toml:1-4¹⁶. Satu-satunya binding aktif adalah D1: binding = "DB" untuk database_name = "githubroast" wrangler.toml:28-31¹⁷. Endpoint mengaksesnya lewat platform.env.DB.prepare(...) untuk pembacaan cache wrangler.toml:28-31¹⁷ dan platform.env.DB.prepare(...).bind(...).run() untuk penulisan src/routes/llama/+server.js:194-207¹⁸.

⚠️ platform.env.DB hanya terisi di runtime Cloudflare dengan binding DB aktif wrangler.toml:28-31¹⁷. Script preview menjalankan npm run build && wrangler pages dev package.json:8¹⁹, dan jalur itulah yang menyediakan binding tersebut saat pengujian lokal.

⚠️ Penulisan hasil roast dibungkus try {} catch {} kosong src/routes/llama/+server.js:194-207¹⁸. Kegagalan INSERT tidak pernah menggagalkan response, sehingga pengguna tetap menerima roast yang tidak tersimpan di D1. Konsekuensi skema dan kolomnya dibahas di Model Data Tabel roasts.

Jalur cache punya efek arsitektur yang perlu diketahui: SELECT * FROM roasts WHERE gh_username = ? AND language = ? dijalankan sebelum panggilan eksternal apa pun, dan bila ada baris yang cocok, response dikembalikan tanpa memanggil GitHub maupun OpenAI src/routes/llama/+server.js:40-47²⁰. Artinya biaya dan latensi dua penyedia luar itu hanya muncul pada kombinasi username dan language yang belum pernah di-roast.

Untuk detail kontrak request dan response endpoint ini, lihat Endpoint POST /llama; untuk nilai environment dan binding yang harus diisi, lihat Konfigurasi Environment dan Binding.