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 hoạt động. 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.
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 dự án Firebase (nếu chưa có) và nâng cấp lên gói Blaze.
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 hiện có Google Cloud, hãy nhập tên dự án hoặc chọn dự án đó trong trình đơn thả xuống.
-
Để tạo một dự án mới, hãy nhập tên dự á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ủa bạn. Việc này giúp mang lại trải nghiệm tối ưu khi sử dụng các sản phẩm sau đây của Firebase: Firebase A/B Testing, Cloud Messaging, Crashlytics, In-App Messaging và Remote Config (bao gồm cả Cá nhân hoá).
Chọn một tài khoản Google Analytics hiện có hoặc tạo một tài khoản mới. Nếu bạn tạo tài khoản mới, hãy chọn Analyticsvị trí báo cáo, sau đó chấp nhận chế độ chia sẻ dữ liệu và Google Analyticsđiều khoản cho dự án của bạn.
-
Nhấp vào Tạo dự án (hoặc Thêm Firebase nếu bạn đang thêm Firebase vào một dự án Google Cloud hiện có).
Firebase tự động cung cấp tài nguyên cho dự án Firebase của bạn. Khi quá trình này hoàn tất, bạn sẽ được chuyển đến trang tổng quan về dự án Firebase của mình 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ó ứng dụng web nằm trong một kho lưu trữ GitHub hoặc nếu bạn muốn thử quy trình này với một ứng dụng mẫu, hãy bắt đầu bằng cách khởi tạo một trong các mẫu của chúng tôi, cho Next.js hoặc Angular:
npm init @apphosting
Bạn có thể chạy ứng dụng mẫu cục bộ bằng cách sử dụng next dev
hoặc ng start
. Để tiếp tục, hãy tạo một kho lưu trữ GitHub mới và đẩy mã mẫu vừa khởi tạo vào đó.
Bước 1: Tạo một 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ý mà App Hosting tạo ra để xây dựng và chạy ứng dụng web của bạn.
Bảng điều khiển của Firebase: Trong trình đơn Tạo, hãy chọn Lưu trữ ứng dụng rồi chọn Bắt đầu.
CLI: (Phiên bản 13.15.4 trở lên) Để tạo một 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 projectID làm đối số:
firebase apphosting:backends:create --project PROJECT_ID
Đối với cả bảng điều khiển hoặc CLI, hãy làm theo lời nhắc để chọn một khu vực, thiết lập 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 lưu trữ tệp
package.json
của bạn.
Đặt nhánh trực tiếp
Đây là nhánh của kho lưu trữ GitHub được triển khai vào URL trực tiếp của bạn. Đây thường là nhánh mà các nhánh tính năng hoặc nhánh phát triển được hợp nhất.
Chấp nhận hoặc từ chối 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. Sau 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 của mình ngay lập tức lên App Hosting.
Đặt tên cho phần phụ trợ của bạn.
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 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
.
Để 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 lệnh CLI sau:
firebase apphosting:backends:get --project PROJECT_ID {BACKEND_ID}
Bước 3: 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 phát hành một 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:
- Trong GitHub, hãy đẩy một thay đổi vào nhánh đang hoạt động của ứng dụng web.
- Mở thẻ App Hosting trong bảng điều khiển Firebase rồi chọn Xem trang tổng quan cho phần phụ trợ của bạn. Danh sách bảng cho thấy cam kết cụ thể được liên kết với quy trình phát hành được kích hoạt bởi thay đổi của bạn.
Các bước tiếp theo
- Tìm hiểu sâu hơn: xem hướng dẫn trong một lớp học lập trình Firebase tích hợp ứng dụng được lưu trữ với Firebase Authentication và các tính năng AI của Google: Next.js | Angular
- Kết nối một miền tuỳ chỉnh.
- Định cấu hình phần phụ trợ – đặt các biến môi trường, lưu trữ các tham số bí mật, v.v.
- Theo dõi quá trình triển khai, mức sử dụng trang web và nhật ký.