TopDev

hướng dẫn cài đặt website next js lên Ubuntu 22.04.4

minhu 📖 3 phút đọc

Dưới đây là hướng dẫn cài đặt và triển khai website Next.js trên Ubuntu 22.04.4:

Bước 1: Cài đặt Node.js và NPM#

Next.js yêu cầu Node.js phiên bản tối thiểu là 16.x. Bạn có thể cài đặt Node.js và NPM bằng cách làm theo các bước sau:

  • Cập nhật hệ thống: sudo apt update sudo apt upgrade

  • Cài đặt Node.js: Để cài đặt Node.js phiên bản 16.x hoặc 18.x (LTS), bạn có thể sử dụng NodeSource:

curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash - sudo apt install -y nodejs

  • Kiểm tra Node.js và NPM: Sau khi cài đặt, kiểm tra phiên bản: node -v npm -v

Bước 2: Tạo dự án Next.js#

  • Cài đặt Next.js: Di chuyển đến thư mục nơi bạn muốn tạo dự án và sử dụng lệnh create-next-app:

npx create-next-app@latest

  • Đi vào thư mục dự án: cd your-project-name

  • Chạy ứng dụng ở chế độ phát triển: npm run dev Ứng dụng sẽ chạy trên http://localhost:3000.

Bước 3: Cài đặt PM2 để quản lý tiến trình#

PM2 là một công cụ giúp quản lý các ứng dụng Node.js dễ dàng hơn, đặc biệt khi triển khai ứng dụng vào production.

  • Cài đặt PM2: sudo npm install -g pm2

  • Chạy ứng dụng Next.js bằng PM2: Trong thư mục dự án Next.js, chạy lệnh: pm2 start npm --name "nextjs-app" -- run start

  • Thiết lập PM2 để khởi động cùng hệ thống: Để đảm bảo rằng ứng dụng sẽ tự động khởi động lại sau khi khởi động lại hệ thống: pm2 startup pm2 save

Bước 4: Cấu hình Nginx làm reverse proxy#

Nginx sẽ chuyển tiếp các yêu cầu từ cổng 80 (HTTP) đến ứng dụng Next.js chạy trên cổng 3000.

  • Cài đặt Nginx: sudo apt install nginx

  • Cấu hình Nginx: Mở tệp cấu hình Nginx: sudo nano /etc/nginx/sites-available/default

    Thay thế nội dung hiện có bằng cấu hình sau:

` server { listen 80; server_name your_domain_or_IP;

   location / {
       proxy_pass http://localhost:3000;
       proxy_http_version 1.1;
       proxy_set_header Upgrade $http_upgrade;
       proxy_set_header Connection 'upgrade';
       proxy_set_header Host $host;
       proxy_cache_bypass $http_upgrade;
   }

} `

  • Kiểm tra cấu hình Nginx: Kiểm tra để đảm bảo không có lỗi trong cấu hình: sudo nginx -t

  • Khởi động lại Nginx: Nếu không có lỗi, khởi động lại Nginx để áp dụng cấu hình: sudo systemctl restart nginx

Bước 5: Thiết lập HTTPS với Let's Encrypt (SSL)#

Để bảo vệ trang web của bạn, hãy sử dụng Let's Encrypt để cài đặt chứng chỉ SSL miễn phí.

  • Cài đặt Certbot và plugin Nginx: sudo apt install certbot python3-certbot-nginx

  • Lấy chứng chỉ SSL: Chạy lệnh sau và làm theo hướng dẫn: sudo certbot --nginx -d your_domain_or_IP

  • Tự động gia hạn SSL: Certbot tự động thêm lệnh gia hạn vào cron. Để kiểm tra: sudo certbot renew --dry-run

Bước 6: Hoàn tất#

Giờ đây, trang web Next.js của bạn đã được triển khai trên Ubuntu 22.04.4 với Nginx làm reverse proxy và HTTPS được cấu hình.

Bạn có thể truy cập trang web của mình thông qua tên miền hoặc địa chỉ IP đã cấu hình.

Bài liên quan trong #NextJs

✓ Đã sao chép link