Stavanie moderných web aplikácií — stack, ktorý skutočne ship-uje

Existuje 2024 verzia tohto článku. Napísal som ju. Je zlá. Hovorila vám, aby ste si vybrali Next.js a integrovali AI, s code snippetom používajúcim text-davinci-003 (OpenAI model, ktorý je deprecated cez rok). Čítať ju späť je pokorujúce.

Toto je rewrite. Nie preto, že sa framework zmenil — Next.js je stále správny default pre väčšinu React projektov v roku 2026 — ale preto, že architektonické rozhodnutia pod výberom frameworku záležia viac ako samotný výber frameworku. Toto je stack, na ktorom skutočne ship-ujem každý projekt, a sedem rozhodnutí za ním.

Web stack roku 2026 je neglamúrny a to je tá pointa

Definujúca charakteristika web stacku 2026 je, že zaujímavé rozhodnutia nie sú vo frameworku. Framework je väčšinou usadený — Next.js, Astro, Remix, SvelteKit alebo pár iných v závislosti od vášho use case. Rozhodnutia, ktoré určujú, či bude vaša aplikácia stále zdravá v roku 2028, sú o:

• Od čoho závisíte (Postgres? Supabase? Firebase?)
• Kto vlastní vaše dáta (vaša DB alebo niekoho iného SaaS)
• Čo je server-rendered vs. client-rendered
• Kde AI integrácia žije (a kde nie)
• Ako handlujete auth, payments a transakčný state

Toto sú nudné otázky. Takmer nikto okolo nich nerobí marketing. Sú to 90% inžinierskej práce.

Web stack už nie je výber frameworku. Je to séria architektonických výberov, ktoré framework iba voľne obmedzuje.

Stack, na ktorom ship-ujem každý projekt (apríl 2026)

Pre ~85% projektov, ktoré dnes scopujem, je toto stack. Substitúcie existujú pre konkrétne potreby (Astro pre content-only stránky, FastAPI pre Python-shop backendy), ale defaulty sú nezmenené posledných 18 mesiacov:

Layer	Choice	Why
Framework	Next.js 16 (App Router)	Najlepší React server-side story, zrelý deployment story
Jazyk	TypeScript (strict)	Type safety je non-negotiable nad jedného vývojára
Styling	Tailwind CSS v4	Utility-first funguje, ale udržiavaný pre layout — branding je v @layer components
UI primitivy	Radix headless + custom CSS	Vyhýbam sa pre-stylovaným UI kitom; brand potreby sú príliš špecifické
Databáza	PostgreSQL (Neon pre serverless)	Nudné, rýchle, podporované všade
ORM	Drizzle	Type-safe queries, žiadna mágia, transparentný SQL
Auth	iron-session pre jednoduché stránky; Auth.js pre multi-provider	Preskočte auth-as-a-service vrstvu, pokiaľ nepotrebujete social login pri launchi
Payments	Stripe	Bodka. Fintech komplexnosť je moat.
Email	Nodemailer + SMTP (Websupport/Postmark)	Vyhnite sa Resend/SendGrid lock-inu na transakčnom
Hosting	Vercel (preferovaný) alebo Fly.io	Vyberte podľa toho, či potrebujete WebSocket alebo workers
Object storage	Cloudflare R2 (S3 API)	10× lacnejšie ako S3 bez egress poplatkov
AI layer	Anthropic Claude API pre produkciu, fallback na Gemini	Pozri § AI integrácia nižšie

To je celý stack. Ak projekt do toho nezapadne, je to zvyčajne z konkrétneho dôvodu, ktorý dokážem pomenovať (regulatórny, real-time, niche jazykové požiadavky). Defaultujte na nudné. Optimalizujte iba tam, kde to projekt skutočne potrebuje.

Sedem rozhodnutí, na ktorých skutočne záleží

1 · Server-first rendering by default

V roku 2026 označovanie každého komponentu 'use client' je znak, že nerozumiete platforme. Server Components sú default z dôvodu. Oni:

• Redukujú JavaScript bundle size (jediná vec, na ktorej konzistentne záleží pre page-load performance)
• Centralizujú data access do jedného tieru (servera), kde auth, caching a rate-limiting reálne fungujú
• Nechajú vás použiť databázové queries vnútri komponentov bez separátnej API route vrstvy

Client komponenty sú stále potrebné pre interaktivitu (formuláre, state, animácie, browser API). Disciplína je urobiť ich malými a leaf-level — nie wrap-núť celú stránku v 'use client', lebo jedno tlačidlo potrebuje onClick.

2 · Jedna databáza, jedno ORM, žiadne abstrakcie navrchu

Prekvapivo bežný 2024 vzor bol: vyberte databázu, potom dajte GraphQL vrstvu navrch, potom dajte SaaS BaaS vrstvu navrch, potom pridajte feature-flag službu navrch, potom si uvedomte, že polovica vášho stacku je prenajatá. Jednoduchší 2026 vzor je: Postgres + Drizzle, s aplikačným kódom hovoriacim k databáze priamo cez type-safe queries.

Toto nie je náboženská pozícia. GraphQL existuje, lebo to niekto postavil pre reálny problém (mobilné apky konzumujúce neflexibilné REST API). Pre web app, kde frontend a backend žijú v rovnakom codebase, GraphQL pridáva infraštruktúru bez riešenia problému, ktorý máte.

3 · Tailwind pre layout, CSS pre branding

Tailwind utility triedy sú excellentné pre layout, spacing a basic typography. Sú zlé pre komponenty so brand-specific stylingom. Kompromis je split, ktorý používam v každom projekte:

• Tailwind utility v JSX pre layout: flex, grid, gap-*, px-*, breakpointy
• Plain CSS (Modules alebo @layer components) pre brand styling: čokoľvek s hover statemi, prechodmi, brand farbami alebo komponent-internou logikou

Bez tohto splitu skončíte s 12 Tailwind triedami per element, vaše JSX sa stane nečitateľné a váš design system efektívne žije v markupe. Split udržiava kód čistý a design system zámerný.

4 · Auth je build-it problém, nie buy-it problém

Pre single-user admin alebo 10-členný tím je iron-session 30 riadkov kódu a dosť dobré navždy. Pre multi-provider OAuth je Auth.js (predtým NextAuth) zrelý a dobre supportovaný. Pre enterprise SSO je Clerk alebo Auth0 vhodný.

Čo je zriedka vhodné, je kúpiť auth-as-a-service pre malý produkt, ktorý len potrebuje email/password. Zaplatíte $50–$500/mesiac za feature, ktorá zabrala popoludnie postaviť. Vendor zmení svoje ceny v roku dva.

5 · Drizzle pre ORM, nie Prisma

Toto je najkontroverznejšia položka v zozname, takže budem priamy. Ship-oval som Prismu tri roky a prestal som pred 18 mesiacmi z dvoch dôvodov:

• Build performance. Prisma code generation je pomalá a stáva sa pomalšou, ako vaša schéma rastie. Na projekte s 60+ tabuľkami sa dev loop stal bolestivým.
• Query opacity. Prisma generuje SQL, ktoré nemôžete plne vidieť alebo kontrolovať. Pre 80% queries je toto v poriadku. Pre 20%, kde záleží na performance, debug-ujete black box.

Drizzle rieši oboje. Je to v podstate typed SQL builder. Queries, ktoré píšete, vyzerajú ako SQL, lebo sú SQL s tenkou TypeScript vrstvou. Migrácie sú explicitné. Performance je transparentná. Switch sa stal za 18 mesiacov naprieč mojou klientskou prácou a nepozrel som sa späť.

6 · AI integrácia tam, kde pohne merateľnú metriku

Toto je miesto, kde väčšina tímov v roku 2026 plytvá peniazmi. Marketingový tlak tlačí firmy pridať "AI features" do všetkého. Výsledok je dekoratívna AI, ktorá nezlepšuje žiadnu user-facing metriku.

Správny vzor je identifikovať jednu alebo dve funkcie, kde AI skutočne pohne merateľnú metriku:

• Search ranking (relevance skóre sa zlepšuje so semantic embeddingom)
• Klasifikácia obsahu (auto-tagovanie support ticketov, smerovanie)
• Generovanie draftov (email odpovede, popisy produktov, sumarizácie)
• Anomaly detection (podozrivé objednávky, fraud signály)

Potom tieto implementujte starostlivo, s fallback path, keď je AI nesprávne, a inštrumentáciou, ktorá ukazuje pohyb metriky. Preskočte "pridať AI ku všetkému" — je to 2026 ekvivalent "pridať blockchain" z roku 2018.

Potrebujete pomoc so scopingom, kde AI skutočne patrí vo vašom produkte? To je konverzácia v discovery sprinte.

7 · Nudná infraštruktúra pre všetko, čo ship-uje peniaze

Toto je hard-earned lesson. Pre čokoľvek, čo sa dotýka peňazí, identity alebo compliance, použite nudnú infraštruktúru s dlhými track recordmi.

• Payments: Stripe. Bodka. Ich fintech komplexnosť je to, čo si kupujete.
• Auth tokens: iron-session alebo Auth.js. Oboje sú battle-tested.
• Email: SMTP cez deliverability-focused provider (Postmark, SES). Vyhnite sa trendy "modern email" SaaSu pre transakčný, pokiaľ nemáte konkrétny dôvod.
• Databáza: Postgres. Nie preto, že je najlepšia, ale preto, že má 25 rokov bug fixov a každý senior inžinier na svete ju používal.

Trendy alternatíva je vždy 30% rýchlejšia a 80% menej preverená. Pre side projekt v poriadku. Pre váš biznis nie.

Case study — malý e-commerce na tomto stacku

Konkrétny príklad. Malá e-commerce platforma, ktorú som ship-ol minulý kvartál, ilustrujúca výbery v produkcii.

Brief: Slovenský rodinný retailer športových potrieb, ~120 SKU, expandujúci z kamenného obchodu do online. Rozpočet €20,000 na build, 12 týždňov. Vyžadované: slovensko-anglická bilingválnosť, custom product konfigurátor pre lyže (dĺžka + binding + topánky kombinácie), Stripe platby, slovenská invoicing integrácia (Pohoda/Money S3).

Vybraný stack:

• Next.js 16 App Router pre storefront
• Drizzle + Postgres (Neon) pre produktový katalóg a objednávky
• Tailwind pre layout + custom CSS pre lyžiarsky konfigurátor UI (interaktívny, potreboval riadny state a animáciu)
• Stripe Connect pre platby, integrovaný so slovenským invoicing API
• Cloudflare R2 pre produktové obrázky
• Nodemailer + Postmark pre order confirmations
• Lightweight semantic search používajúci OpenAI embeddings pre product search (jeden kus AI v buildoch)

Výsledky po 90 dňoch:

• 99.97% uptime merané externým monitorom
• p95 page load 0.9 sekundy (Core Web Vitals všetky zelené)
• Search-to-purchase konverzia 5.2% (priemer industries pre športové potreby sedí na 2–3%)
• €0 v neplánovaných infraštruktúrnych nákladoch — celkový hosting bill bežal €34/mesiac na Vercel + Neon free tieri cez launch objem

Nesexy odpoveď na "čo umožnilo výsledok" je: žiadne špeciálne triky. Nudný stack starostlivo vybraný, dobre vykonaný, dostatočne inštrumentovaný, aby sme vedeli, čo funguje.

Takeaways — váš 2026 web stack checklist

• Defaultujte na Next.js 16 + Server Components. Označujte 'use client' iba keď musíte.
• Postgres + Drizzle. Preskočte ORM, ktoré ship-uje vlastný runtime.
• Tailwind pre layout, plain CSS pre branding. Prestaňte dávať design tokeny do className stringov.
• Kupujte auth iba ak potrebujete OAuth alebo enterprise SSO. Inak iron-session stačí.
• Stripe pre platby. Postmark alebo SMTP pre email. R2 pre storage. Nudné je tá pointa.
• AI tam, kde pohne metriku, ktorú dokážete merať. Nie ako dekorácia.
• Jednu major verziu za bleeding edge. Stabilita nad novinkou.

Web stack 2026 nie je framework. Je to sekvencia architektonických rozhodnutí, ktoré rešpektujú inžiniersku aj biznis realitu. Vyberte nudnú infraštruktúru, ship-nite skutočnú prácu, inštrumentujte, aby ste vedeli, čo funguje.

---

Súvisiace: Koľko skutočne stojí custom web aplikácia v roku 2026 · Vlastniť svoj stack v roku 2026 · Ako vediem discovery sprinty