Tehniskais pārskats

Šajā lapā īsi un tehniski: no kā sastāv vietne, kā tiek ielādēti/kēšoti dati, un kādi ir pieejamības/SEO un drošības principi.

Pakotņu versijas

Versijas tiek nolasītas serverī no package.json (nekas neizplūst klientam).

  • next14.2.5
  • react18.3.1
  • react-dom18.3.1
  • typescript5.4.5
  • tailwindcss3.4.10
  • postcss8.4.38
  • autoprefixer10.4.19
  • swiper11.1.4

Frameworks un renderēšana

  • Next.js App Router: servera komponentes pēc noklusējuma; klienta komponentes — tikai tur, kur vajag (piem., slider).
  • SSR + SSG/ISR: lapas ģenerācija uz servera, daļa sekciju — statiski ar revalidāciju.
  • Dinamisks imports (no-SSR) sliderim, lai izvairītos no hidrācijas konfliktiem.

I18n un maršruti

  • URL struktūra: /lv/... un /ru/... , piemēram /lv/home, /ru/home.
  • Valoda atvasināta no URL parametra [lang]; neizmantojam klienta stāvokli, lai novērstu SSR/CSR atšķirības.
  • Komponenti saņem valodu ar propu (vienmēr deterministiski SSR).

Ziņas (Facebook Graph API)

  • Servera komponente <News/>: `async` fetch no Graph API, filtrēšana pēc taga (#site-news-lv / #site-news-ru).
  • Kešošana: izmantojam Next revalidate vai `cache: "no-store"` atkarībā no vajadzībām (rate-limits/latence).
  • Slepenie atslēgas FB_PAGE_ID / FB_PAGE_TOKEN atrodas tikai serverī (process.env).

Kešs un veiktspēja

  • ISR revalidate (piem., 300–600s) jaunumiem; kritiskām sadaļām — SSR bez keša.
  • Attēli — Next Image ar optimizāciju un `sizes` atbilstoši izkārtojumam.
  • Dinamiski no-SSR importi (piem., slider), lai samazinātu sākotnējo JS slodzi.

UI slānis

  • Tailwind CSS + dizaina utilītas (gradienti, ēnas, radiusi).
  • Fontu ielāde caur next/font (Inter, Playfair_Display) — bez FOUT/FOIT.
  • Komponentu sadalījums: Header/Footer/News/Services u.c.

Drošība

  • Env slepenās vērtības tikai serverī; nav klienta bundlē.
  • CSRF/XSS: Next/React aizsardzības + nelietojam `dangerouslySetInnerHTML` ar neuzticamu saturu.
  • HTTP atbildes galvenes (piem., CSP, Referrer-Policy) — ieteicams pievienot proxī/aplikācijas līmenī.

SEO un metadata

  • Next Metadata API: title/description per lapu/valodu.
  • Semantiskais HTML, h1/h2 struktūra, alt atribūti attēliem.
  • Tīri URL ar valodas prefiksu.

URL struktūra

/lv/home, /ru/home
/lv/privacy, /ru/privacy
/lv/tech, /ru/tech

Datu plūsmas diagramma (vienkāršota)

No klienta uz serveri (Next), tālāk uz Graph API; kešs — uz Next pusē.

Browser ───────→ Next.js (SSR/Server Components)
                 ├─ fetch News → Facebook Graph API
                 └─ ISR cache / revalidate
HTML/JSON ←─────┘

Vides mainīgie (.env)

  • FB_PAGE_IDFacebook Lapas ID
  • FB_PAGE_TOKENFacebook Page Access Token (ilgtermiņa)
  • NEXT_PUBLIC_SITE_URLVietnes publikais URL

Deploy checklist

  • Pievienot/atjaunot .env (FB_PAGE_ID/FB_PAGE_TOKEN).
  • Pārbaudīt Graph API piekļuvi un rate-limits.
  • Ieslēgt ISR revalidate, iestatīt drošības galvenes.
  • Build + start ar NODE_ENV=production.

Roadmap

  • Redis kešs Facebook atbildēm (ņemot vērā rate-limits).
  • Sentry/Logs observability.
  • CI/CD un Lighthouse budžeti.

Operatīvais runbook

  • Ja pazūd ziņas: pārbaudīt FB tokena derīgumu; atsvaidzināt, ja termiņš beidzies.
  • Ja hidrācijas kļūdas: pārbaudīt, vai klienta komponentes nav iekļautas SSR (lietot dynamic(..., { ssr:false })).
  • Ja redzes veiktspējas kritums: pārbaudīt ISR keša iestatījumus un attēlu izmērus/sizes.