Bắt đầu với Lưu trữ ứng dụng

Với ứng dụng Next.js hoặc Angular hiện có (Next.js phiên bản 13.5.x trở lên hoặc Angular 18.2.x trở lên) trong kho lưu trữ GitHub, bạn có thể bắt đầu sử dụng App Hosting một cách dễ dàng bằng cách tạo một phần phụ trợ App Hosting rồi bắt đầu triển khai bằng cách đẩy đến nhánh trực tiếp. Nếu bạn không có ứng dụng, hãy dùng một trong các ứng dụng mẫu của chúng tôi để thực hiện các bước được mô tả trong hướng dẫn này.

Hướng dẫn này mô tả cách thiết lập App Hosting trong bảng điều khiển Firebase để tự động triển khai mỗi khi có một cam kết mới được thực hiện cho một kho lưu trữ trên GitHub. Khi kết thúc quy trình này, bạn sẽ có một ứng dụng mẫu Next.js hoặc Angular đang hoạt động, được triển khai lại mỗi khi bạn xác nhận một thay đổi mới cho nhánh main của kho lưu trữ GitHub.

Mặc dù hướng dẫn này tập trung vào quy trình bảng điều khiển Firebase được đề xuất, nhưng có những cách khác để triển khai, bao gồm cả việc sử dụng CLI Firebase để triển khai mã cục bộ mà không cần kết nối GitHub.

Bước 1: Phát triển nhánh kho lưu trữ bản minh họa

Truy cập vào https://github.com/firebase/apphosting-adapters rồi chọn Fork (Phân nhánh).

Bước 2: Tạo một phần phụ trợ App Hosting

  1. Trong bảng điều khiển Firebase, hãy chuyển đến Lưu trữ và không máy chủ > App Hosting.

  2. Nhấp vào Bắt đầu.

  3. Nếu được nhắc, hãy nâng cấp lên gói giá Blaze (trả tiền theo mức dùng) để sử dụng App Hosting.

Ảnh chụp màn hình chế độ thiết lập phụ trợ của App Hosting.

Làm theo lời nhắc để hoàn tất các bước sau:

  • Chọn một khu vực chính (thường là khu vực gần người dùng nhất).
  • Kết nối với GitHub. Chọn kho lưu trữ mà bạn vừa tạo bằng cách phân nhánh kho lưu trữ firebase-framework-tools.
  • Đặt thư mục gốc của ứng dụng thành một trong những thư mục sau:
  • Đặt nhánh phát hành công khai làm chính.
  • Bật tính năng phát hành tự động (tính năng phát hành tự động được bật theo mặc định).
  • Đặt tên cho phần phụ trợ của bạn.
  • Chọn môi trường thời gian chạy. Theo mặc định, phiên bản Node.js được đề xuất mới nhất sẽ được chọn trước cho bạn.
    • Định cấu hình Tính năng tự động cập nhật hình ảnh cơ sở (ABIU). ABIU được bật theo mặc định và tự động áp dụng các bản vá bảo mật cho môi trường cơ bản của bạn. Bạn có thể chọn không sử dụng ABIU bằng cách chọn "Không chỉ định" cho thời gian chạy.
  • Tạo một ứng dụng web Firebase mới.

Chọn Hoàn tất và triển khai.

Bước 3: Xem ứng dụng đã triển khai

Khi bạn tạo một phần phụ trợ, Firebase sẽ cung cấp cho bạn một miền con miễn phí để người dùng cuối có thể truy cập vào ứng dụng web của bạn. Miền con này có định dạng backend-id--project-id.us-central1.hosted.app.

Trong hàng Thông tin phụ trợ trong trang tổng quan cho phụ trợ của bạn, hãy chọn đường liên kết đến phụ trợ đang hoạt động để xem trang web mới:

Ảnh chụp màn hình hàng thông tin phụ trợ, trong đó đường liên kết đến ứng dụng đang hoạt động được nhấn mạnh.

Bước 4: Kích hoạt quy trình phát hành bằng cách đẩy một thay đổi

Sau khi tạo phần phụ trợ và có một URL đang hoạt động, bạn có thể kích hoạt việc triển khai phiên bản mới của ứng dụng web bất cứ khi nào bạn đẩy các thay đổi vào nhánh đang hoạt động của kho lưu trữ GitHub. Cách thực hiện kiểm thử chế độ thiết lập App Hosting:

  1. Trong nhánh của bạn trong kho lưu trữ GitHub của bản minh hoạ, hãy chuyển đến nguồn của trang chủ ứng dụng minh hoạ, thực hiện mọi nội dung chỉnh sửa dễ nhận biết mà bạn muốn, rồi đẩy thay đổi của bạn vào nhánh chính. Cách tìm trang chủ:

    • Next.js: /starters/nextjs/basic/src/app/page.tsx
    • Angular: /starters/angular/basic/src/app/pages/home/home.component.html

  2. Trong bảng điều khiển Firebase, hãy theo dõi App Hosting khi thay đổi mới được triển khai cho bản phát hành công khai. Khi quá trình triển khai hoàn tất, bạn có thể xem thay đổi của mình trên trang chủ của ứng dụng.

Các bước tiếp theo