GitHub deploy na HostCreators | Areaweb
github

Nasadenie Next.js a React z GitHubu na HostCreators (GIT Build & Deploy)

Krok za krokom: prepojenie GitHub repozitára s doménou na HostCreators, npm build po pushi a nasadenie bez manuálneho FTP. Vhodné pre React, Vite aj Next.js.

GIT Build & Deploy v skratke

Namiesto ručného nahrávania súborov prepojíte doménu s GIT repozitárom. Každý push do zvolenej vetvy spustí webhook: klon aktualizácie, build príkazy (Composer, npm install, vlastné skripty) a deploy do produkčného adresára. Oficiálna nápoveda: GIT Build & Deploy.

Čo pripraviť v repozitári

  • Funkčný package.json so skriptom build.
  • Pre Next.js: rozhodnutie medzi statickým exportom (output: export) alebo Node serverom – pri serveri budete po build-e spúšťať proces cez SSH (Node je na hostingu k dispozícii).
  • Premenné prostredia (.env) – na HostCreators ich viete nastaviť v konfigurácii GIT deployu.
  • Vetva main alebo production, na ktorú naviažete webhook.

Postup vo WebAdmine

  • Doména alebo subdoména → sekcia GIT / Build & Deploy.
  • Autorizácia voči GitHubu (alebo GitLab/Bitbucket).
  • Výber repozitára a vetvy.
  • Definícia build príkazov, napr. npm ci a npm run build.
  • Cieľový adresár podľa document_root (pre statický front-end často out alebo dist).
  • Testovací push – overenie logu buildu a funkčnosti webu.

Výhody oproti manuálnemu FTP

  • Žiadne zabudnuté súbory – vždy nasadíte celý commit.
  • Rovnaký postup pre celý tím – vývojári pushujú, server buildí.
  • Na jednom hostingu môžete mať WordPress na hlavnej doméne a React/Next na subdoméne.
  • Súčasť bežného balíčka – nemusíte dokupovať „Node hosting“ ako u niektorých zahraničných panelov.

Ak spravujete aj WordPress na tom istom účte, kombinujte GIT deploy pre front-end a WP-CLI cez SSH pre backend. Komplexnejší prehľad nástrojov sme spísali v článku HostCreators: Node.js, Next.js a WP-CLI.

Hosting so zľavou

Pre nový hosting použite tento partnerský odkaz HostCreators – zľava 10 % na webhosting. Po registrácii si vytvorte SSH účet a GIT prepojenie podľa krokov vyššie.

HostCreators webhosting – 10 % zľava

Príprava repozitára pre HostCreators GIT Build

Repozitár musí obsahovať package.json so skriptom build (napr. npm run build) a výstup do priečinka, ktorý hosting očakáva (often out/ pre Next.js static export alebo .next pre Node server). Pridaj .nvmrc alebo v package.json engines s verziou Node, ktorú HostCreators podporuje – over v dokumentácii panelu.

Next.js static export vs Node server

Static export (output: 'export') je jednoduchší – po build nahraješ HTML/JS/CSS do public_html. Full Next.js s API routes vyžaduje bežiaci Node proces – HostCreators to podporuje na vybraných balíkoch. Pre blog/portfolio často stačí static export + Cloudflare.

Environment variables a secrets

Nikdy necommituj .env s API kľúčmi. V HostCreators paneli nastav env premenné pre produkciu. Pre Next.js používaj NEXT_PUBLIC_ prefix len pre hodnoty, ktoré môžu byť verejné v bundle.

CI/CD workflow odporúčaný postup

  1. Push na main → automatický build na HostCreators.
  2. Staging branch → subdoména pre test pred produkciou.
  3. Po deploye skontroluj 404 na assets (často zlá basePath).

Riešenie typických chýb deployu

  • Build failed npm – lokálne spusti npm ci && npm run build, oprav chyby TypeScript.
  • 404 na /_next/static – skontroluj basePath a assetPrefix v next.config.
  • Stará verzia po deployi – vymaž cache CDN a hard refresh.

Súvisiaci prehľad hostingu: HostCreators Node.js a WP-CLI.

Viac WordPress návodov

Všetky naše návody nájdeš na stránke WordPress návody – kompletný sprievodca.