Table of contents
Nuxt.js pertama kai dirilis pada tahun 2016. Teknologi milik Vue.js ini terinspirasi Next.js dari React.js. Ia diciptakan untuk membantu mengatasi masalah pada SEO yang sering terjadi pada website single page application (SPA) seperti Vue.js. Karena penggunanya yang banyak, pada panduan kali ini, kami akan berbagi dengan kamu tentang cara upload file Nuxt.js di hosting.
Cara Upload File Nuxt.js di Hosting
Supaya tidak bertele-tele lagi, berikut cara upload file Nuxt.js di hosting:
1. Login cPanel Hosting
Pertama, silakan login ke akun cPanel hosting milikmu. Masukkan username dan password pada kolom yang tersedia. Jika sudah, klik Login
2. Menentukan Lokasi Upload
Selanjutnya, kamu diminta untuk menentukan lokasi upload. Seperti gambar di bawah ini.
3. Membuat Node.js App
Selanjutnya, buat Node.js App
4. Mengupload File Nuxt.js
Setelah Node.js App selesai, selanjutnya adalah mengupload file Nuxt.js dari file manager cPanel.
Melakukan Setting Port di Nuxt.js
"dev": "nuxt --hostname '0' --port 8000"
Mengakses SSH via Terminal atau PuTTy
ssh username@controlpanelURL -p 64000
Melakukan Instalasi Nuxt.js
source /home/bangunkertoidor/nodevenv/nuxapp/10/bin/activate
cd /home/bangunkertoidor/nuxapp
memulai install Nuxt.js dengan command di bawah ini
npm install
npm run dev
Jika muncul seperti gambar di bawah ini, itu artinya instalasi Nuxt.js berhasil
Tambahkan perintah di file .htaccess pada folder subdomain
Options +FollowSymLinks -Indexes
IndexIgnore *
DirectoryIndex
<IfModule mod_rewrite.c>
RewriteEngine on
# gunakan port yg sesuai seperti diatas
RewriteRule ^(.*)$ http://localhost:8000/$1 [P] #port sesuai yang ditentukan
</IfModule>
Contoh penambahan kode diatas seperti gambar di bawah ini :
Melakukan Instalasi pm2
npm run build
npm run start
Sekarang saatnya melakukan instalasi pm2. Silahkan tekan ctrl+c pada keyboard.
Kemudian, kamu bisa tulis command di bawah ini untuk melakukan instalasi pm2.
npm install pm2
npx pm2 start npm --name "nuxt" --interpreter bash -- start #nuxt adalah nama prosesnya
Silakan tunggu hingga proses instalasi pm2 selesai. Untuk mengecek apakah pm2 sudah aktif, kamu bisa jalankan command di bawah ini.
npx pm2 status
Jika mucul status : online seperti seperti di bawah ini , itu artinya instalasi pm2 berhasil dan sudah aktif.
Upload File Nuxt.js di Hosting Berhasil!