Thapa Technical — Dev Blog
Next.js
Shared Hosting
TypeScript
Hostinger
Deploy Next.js to
Shared Hosting — the right way.
Shared hosting doesn't run Node.js. But your Next.js app can still live there — if you know how to go fully static. Here's the exact workflow to diagnose, refactor, and deploy.
The Core Problem
Next.js is a full-stack framework. By default, it expects a live Node.js server at runtime for dynamic routes, API endpoints, and server-side rendering. Shared hosting like Hostinger's hPanel doesn't provide that — it only serves static files.
The fix? Audit your app, eliminate dynamic patterns, and configure Next.js to generate a pure static export — nothing but HTML, CSS, and JS that any web server can host.
| Symbol | Type | Needs Node.js? | Works on Shared Hosting |
|---|---|---|---|
○ |
Static (SSG) | No | ✓ Yes |
ƒ |
Dynamic (SSR) | Required | ✗ Breaks |
Step-by-Step
01
Run the build diagnostic
Execute
npm run build and read the output. Any route marked ƒ is dynamic and will fail on shared hosting.
02
Eliminate API routes
Delete your
app/api folder if it's just serving hardcoded data. Move that data into a lib/ file and import it directly into your components.
03
Replace
any with strict TypeScript interfaces
Using any kills autocomplete and type safety. Write proper interfaces for your data structures — it makes the refactor easier too.
04
Configure the static export
Add
output: 'export' to your next.config.js. This tells Next.js to generate an out/ folder instead of a server bundle.
05
Build & upload to Hostinger
Run
npm run build one last time — all routes should now show ○. Upload the contents of out/ into public_html via Hostinger's File Manager.
Config Snippet
/** @type {import('next').NextConfig} */
const nextConfig = {
output: 'export',
}
module.exports = nextConfig
After running
npm run build, Next.js generates an out/ directory — no hidden .next server folder. That out/ folder is everything you need to upload.
Source Code
Get the Resume Template
The full Next.js + TypeScript + shadcn/ui resume used in this tutorial — ready to clone and deploy.
Clone on GitHub
After downloading:
git clone https://github.com/thapatechnical/next-react-shadcn-ts-resume-2026.git
