Cara Upload NextJS Di Hosting cPanel

Terakhir diupdate: 18 Maret 2025

Pengantar

Halo sob, kali ini kita akan memberikan tutorial bagaimana caranya upload project next js kamu ke cpanel hosting nih. Sebelumnya, next js itu apa sih? Next.js adalah sebuah kerangka kerja (framework) javascript yang digunakan untuk mengembangkan aplikasi web berbasis JavaScript. Kerangka kerja ini berfokus pada pengembangan aplikasi web berkinerja tinggi dan mudah dijalankan. Next.js memungkinkan kamu untuk membuat aplikasi web dengan fitur-fitur seperti rendering sisi server (server-side rendering) dan prerendering, routing yang mudah, dan dukungan untuk pengelolaan data yang efisien.

Sebelum melangkah lebih jauh, pastikan kamu sudah memenuhi persyaratan berikut:

  • Aplikasi Next js sudah siap deploy
  • Sudah melakukan testing di localhost
  • Menggunakan paket hosting yang terdapat akses terminal

Upload NextJS Di Hosting cPanel

 

Langkah 1, Pastikan Nextjs sudah berjalan di localhost

Langkah 2, Buat file server.js

Selanjutnya buat file server.js di project next js kamu. Berikut kodenya:

				
					const { createServer } = require('http') const { parse } = require('url') const next = require('next') const dev = process.env.NODE_ENV !== 'production' const hostname = 'localhost' const port = process.env.port || 8080 // when using middleware `hostname` and `port` must be provided below const app = next({ dev, hostname, port }) const handle = app.getRequestHandler() app.prepare().then(() => { createServer(async (req, res) => { try { // Be sure to pass `true` as the second argument to `url.parse`. // This tells it to parse the query portion of the URL. const parsedUrl = parse(req.url, true) const { pathname, query } = parsedUrl if (pathname === '/a') { await app.render(req, res, '/a', query) } else if (pathname === '/b') { await app.render(req, res, '/b', query) } else { await handle(req, res, parsedUrl) } } catch (err) { console.error('Error occurred handling', req.url, err) res.statusCode = 500 res.end('internal server error') } }).listen(port, (err) => { if (err) throw err console.log(`> Ready on http://${hostname}:${port}`) }) })
				
			

“const port = process.env.port || 8080”. Pastikan port menggunakan 8080.

Langkah 3, Edit file package.json

Edit file package.json dari project NextJS kamu di localhost. Edit bagian “start” dengan script “start”: “NODE_ENV=production node server.js”

Langkah 4, Jalankan command npm run build

Langkah 5, Compress ke format ZIP semua file project NextJS

Selanjutnya kamu perlu compress semua file ke format zip kecuali folder “node_modules”

Langkah 6, Login ke cPanel hosting lalu setup “Setup NodeJS App”

Untuk proses setup kamu bisa mengikuti tutorial yang telah dibuat berikut

Langkah 7, Upload dan extract file ZIP NextJS ke File Manager

Langkah 8, Masuk ke menu “Setup Nodejs App”

Masuk ke menu “Setup Nodejs App” cPanel, copy link path virtual env project NodeJS kamu,

lalu paste-kan di terminal cPanel lalu tekan enter.

Langkah 9, Jalankan npm install

jalankan command “npm install“. Tunggu hingga proses npm install selesai.

Langkah 10, masuk kembali ke menu “Setup Nodejs App”

masuk kembali ke menu “Setup Nodejs App” cPanel lalu klik restart NodeJS.

Langkah 11, Selesai

Terakhir kunjungi url website kamu, jika sudah muncul seperti di localhost kamu, artinya kamu sudah berhasil.

 

Penutup

Demikianlah Cara Upload Nextjs di Hosting cPanel Jagoanhosting, semoga membantu ya sob.

Related Posts
Tips Mengatasi Error Undefined Index / Variable

Pengantar Halo sobat Jagoan! di tutorial kali ini kita bakalan membahas permasalahan Error Undefined Index/Variable. Pasti sekarang kamu lagi main-main Read more

Tutorial Mendeteksi Script Jahat pada Website Sebelum Publish

Hai, Sob kamu pasti tentu tidak ingin jika website kamu dibobol oleh hacker, terutama jika kamu seorang programmer dan webmaster. Read more

Tutorial Install Virus Scanner Clam AV pada cPanel

Kamu ngerasa insecure karena belum install antivirus? Install antivirus emang penting, Sob untuk menjaga performa server kamu. Nah, kamu bisa Read more

Tutorial mereset Password MySQL melalui akses Root

Lupa password root MySQL kamu? Gawat!, tapi kamu gak perlu panik, kita akan bahas bareng tutorialnya berikut ini. Eh, tapi Read more

⚡ Website Lebih Cepat dengan Hosting Unlimited | GRATIS OPTIMASI dan Support WA 24/7
Scroll To Top