Với ứng dụng Next.js hoặc Angular hiện có (Next.js phiên bản 13 trở lên hoặc Angular 17.2 trở lên) trong một kho lưu trữ GitHub, bạn có thể bắt đầu sử dụng App Hosting như đơn giản như tạo một phần phụ trợ App Hosting rồi bắt đầu một phát hành bằng cách đẩy lên nhánh đang hoạt động. Nếu bạn không có ứng dụng, hãy sử dụng một trong ứ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.
Trước khi bắt đầu
Trước khi có thể thiết lập Firebase App Hosting, bạn cần tạo một Firebase dự án (nếu bạn chưa có) và nâng cấp lên Gói linh hoạt.
Cách tạo dự án:
-
Trong bảng điều khiển Firebase, hãy nhấp vào Thêm dự án.
-
Để thêm tài nguyên Firebase vào một dự án Google Cloud hiện có, hãy nhập tên dự án hoặc chọn tên dự án từ trình đơn thả xuống.
-
Để tạo một dự án mới, hãy nhập tên dự án mà bạn muốn. Bạn cũng có thể tuỳ ý chỉnh sửa mã dự án xuất hiện bên dưới tên dự án.
-
-
Nếu được nhắc, hãy xem xét và chấp nhận các điều khoản của Firebase.
-
Nhấp vào Tiếp tục.
-
(Không bắt buộc) Thiết lập Google Analytics cho dự án để có thể để có trải nghiệm tối ưu khi sử dụng bất kỳ sản phẩm Firebase nào sau đây:
Chọn một Tài khoản Google Analytics hoặc tạo tài khoản mới.
Nếu bạn tạo tài khoản mới, hãy chọn Analytics vị trí báo cáo, sau đó chấp nhận chế độ cài đặt cách chia sẻ dữ liệu và điều khoản Google Analytics cho dự án.
-
Nhấp vào Tạo dự án (hoặc Thêm Firebase, nếu bạn đang sử dụng dự án Google Cloud hiện có).
Firebase tự động cấp tài nguyên cho dự án Firebase của bạn. Thời gian quá trình hoàn tất, bạn sẽ được đưa đến trang tổng quan cho Firebase dự án trong bảng điều khiển Firebase.
Bước 0 (không bắt buộc): Tạo kho lưu trữ GitHub và ứng dụng web
Nếu bạn chưa có một ứng dụng Web nằm trong kho lưu trữ GitHub hoặc nếu bạn đã thay vào đó, hãy thử luồng với một ứng dụng mẫu, bắt đầu bằng cách khởi chạy một trong các mẫu của chúng ta, cho Next.js hoặc Angular:
npm init @apphosting
Bạn có thể chạy ứng dụng mẫu trên thiết bị bằng next dev
hoặc ng start
. Để tiếp tục,
tạo một kho lưu trữ GitHub mới
rồi đẩy mã mẫu mới khởi tạo vào đó.
Bước 1: Tạo phần phụ trợ App Hosting
Phần phụ trợ App Hosting là tập hợp các tài nguyên được quản lý App Hosting tạo để tạo và chạy ứng dụng web. Bạn có thể tạo và liệt kê Các phần phụ trợ App Hosting thông qua bảng điều khiển Firebase hoặc Firebase CLI.
Bảng điều khiển của Firebase: Từ trình đơn Tạo, hãy chọn Lưu trữ ứng dụng, sau đó chọn Bắt đầu
CLI: (Phiên bản 3.9 trở lên) Để tạo phần phụ trợ, hãy chạy lệnh sau
từ gốc của thư mục dự án cục bộ, cung cấp
mã dự án làm đối số (để xem trước,
chỉ hỗ trợ khu vực us-central1
):
firebase apphosting:backends:create --project PROJECT_ID --location us-central1
Đối với cả bảng điều khiển hoặc CLI, hãy làm theo lời nhắc để gán tên cho phần phụ trợ của bạn, để thiết lập một Kết nối GitHub, và định cấu hình các chế độ cài đặt triển khai cơ bản sau:
Đặt thư mục gốc của ứng dụng (mặc định là
/
)Đây thường là nơi chứa tệp
package.json
của bạn.
Thiết lập nhánh trực tiếp
Đây là nhánh của kho lưu trữ GitHub được triển khai cho URL đang hoạt động. Thông thường, đó là nhánh có các nhánh hoặc hoạt động phát triển các nhánh được hợp nhất.
Chấp nhận hoặc từ chối chế độ phát hành tự động
Tính năng phát hành tự động được bật theo mặc định. Khi hoàn tất quá trình tạo phần phụ trợ, bạn có thể chọn triển khai ứng dụng cho App Hosting ngay lập tức.
Bước 2: 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 không tốn phí ở cuối
người dùng có thể truy cập vào ứng dụng web của bạn. Định dạng
là backend-id--project-id.us-central1.hosted.app
.
Để xem URL của ứng dụng web, hãy kiểm tra bảng điều khiển của Firebase hoặc chạy CLI sau đây :
firebase apphosting:backends:get --project PROJECT_ID {BACKEND_ID} --location us-central1
Bước 3: Triển khai một đợt phát hành bằng cách áp dụng một thay đổi
Sau khi tạo xong phần phụ trợ và có URL đang hoạt động, bạn có thể kích hoạt phát hành phiên bản ứng dụng web mới bất cứ khi nào bạn đẩy các thay đổi vào nhánh trực tiếp của kho lưu trữ GitHub. Để thực hiện một kiểm thử cách thiết lập App Hosting của bạn:
- Trong GitHub, hãy đẩy một thay đổi vào nhánh trực tiếp của ứng dụng Web.
- Mở Thẻ App Hosting trong bảng điều khiển của Firebase rồi chọn Xem trang tổng quan cho phần phụ trợ. Danh sách bảng hiển thị cam kết cụ thể liên quan đến bản phát hành do thay đổi của bạn kích hoạt.
Các bước tiếp theo
- Tìm hiểu sâu hơn: tìm hiểu qua lớp học lập trình Firebase có tích hợp một ứng dụng được lưu trữ với các tính năng Xác thực Firebase và AI của Google: Next.js | Góc
- Kết nối một miền tuỳ chỉnh.
- Định cấu hình phần phụ trợ.
- Theo dõi hoạt động phát hành, mức sử dụng trang web và nhật ký.