heroku nextjs

Next.js di Heroku

Menyebarkan aplikasi web universal berbasis reaksi di Heroku.

Penerapan demo dari repo ini:
https://nextjs.herokuapp.com

Server Node/Express khusus didukung. Gunakan untuk:

• Gabungkan API Node dengan UI Berikutnya/Bereaksi
• Terapkan rute URL khusus

▶ ️ Berikutnya dengan Server Custom Express

Memerlukan

• Heroku
  • Alat baris perintah (CLI)
  • akun gratis
• git
• Node.js
• Next.js

Penyebaran produksi

Setelah aplikasi berikutnya berfungsi secara lokal, Anda dapat menggunakannya untuk akses publik.

1. Revisi skrip npm start untuk mengatur pendengar web $PORT :

   Gabungkan entri ini ke dalam package.json :

   {
     "scripts" : {
       "dev" : " next " ,
       "build" : " next build " ,
       "start" : " next start -p $PORT "
     }
   }

   ️ Pada bulan Maret 2019, Heroku mulai menjalankan npm run build secara otomatis, sehingga entri skrip heroku-postbuild yang lama tidak lagi diperlukan.

2. Pastikan aplikasi adalah repo git, mengabaikan direktori lokal saja:

   git init
   (echo node_modules/ && echo .next/) >> .gitignore

3. Buat Aplikasi Heroku:

   heroku create $APP_NAME

4. Menyebarkan:

   git add .
   git commit -m ' Next.js app on Heroku '
   git push heroku main 

   ️ Pada Juli 2020, Heroku mendukung git push heroku main dan mendorong penggunaannya. Dukungan untuk nama cabang 'master' akan tetap tersedia untuk kompatibilitas ke belakang.

5. ♻️ Menyebarkan perubahan: Tambah, komit, & dorong lagi.

Konfigurasi khusus

Berikutnya sendiri mendukung konfigurasi build & runtime melalui file next.config.js.

Gunakan Variabel Lingkungan (Heroku Config Vars) dalam komponen React Anda, tidak diperlukan pembangunan kembali! Cukup atur nilai next.config.js dari lingkungan server menggunakan objek process.env .