Cùng học Cờ Lao – Azure Phần 4.2: Deploy ứng dụng lên Azure App Service trong 5 phút

Ở phần trước, chúng ta đã tìm hiểu về Azure App Service và những thứ linh tinh liên quan đến nó rồi.

Không để bà con phải chờ lâu nữa, trong kì này chúng ta cùng deploy ngay và luôn nha. Đảm bảo sau 5 phút, các bạn sẽ có 1 trang web của riêng mình chạy trên Azure luôn.

Chuẩn bị ứng dụng để deploy

Các bạn có thể tải source code mà ứng dụng chúng ta sẽ deploy ở đây. Đây là một app viết bằng .NET Core siêu nhỏ gọn.

https://github.com/conanak99/codedao-dotnet-azure

Nếu các bạn đã có Visual Studio, các bạn chỉ cần mở file codedao-app.csproj trong project lên và chạy thôi.

App .NET Core siêu nhỏ gọn của chúng ta

Nếu các bạn không muốn cài Visual Studio, hoặc thích xài Mac/Linux như mình, các bạn có thể làm theo 3 bước:

  1. Tải và cài đặt .NET Core SDK tại đây: https://dotnet.microsoft.com/download
  2.  Mở command line lên, cd vào thư mục source code và gõ dotnet run để chạy
  3. Mở trình duyệt, truy cập web tại địa chỉ http://localhost:5000
Thấy dòng chữ như phía dưới là được nha!

Tạo web app để deploy nào!

Nếu dùng Visual Studio, các bạn có thể deploy thẳng từ IDE. Tuy nhiên, làm vậy bạn sẽ không hiểu được cơ chế hoạt động của nó, cũng không biết mặt mũi cái Azure Portal sẽ như thế nào.

Do vậy, chúng ta sẽ cùng thử deploy bằng cách dùng Azure portal, sau đó mình sẽ chỉ các bạn cách setup dự án kiểu CI, tự deploy mỗi khi bạn commit code nha.

Đầu tiên, chúng ta phải tạo web app đã chứ:

1. Vào Azure Portal. Bấm Create a Resource => Web => Web App

2. Đặt tên cho app (tên gì cũng được), chuyển OS qua Window cho dễ deploy nha

3. Bấm vào App Service Plan => Create New => Chọn khu vực là South East Asia. Các bạn có thể xem lại bài trước để biết App Service Plan là gì. Nói nôm na nó là con máy ảo sẽ chạy app của chúng ta đấy!

4. Trong mục App Service Plan, bấm Pricing Tier => Dev/Test => Chọn F1 để dùng gói free => Bấm Apply

5.  Quay lại đoạn tạo app, bấm Create để tạo Web App.

Chờ khoảng 2 phút để Azure tạo Web app
Bấm Go To Resouce để xem Web app vừa tạo nha

6. Vào xem web app vừa tạo. Bấm vào URL bên tay phải để truy cập vào Web App nha. Thấy hình xanh xanh như phía dưới là ok rồi đấy!

Web App của chúng ta đã tạo xong rồi, bấm vào URL để xem thử nhé
Thấy xanh xanh thế này là ok nha 😀

Deploy bằng tay (thủ công)

Sau khi đã có Web App, công việc của chúng ta chỉ đơn giản là đưa source code lên thôi.

1. Để chuẩn bị source code, các bạn vào lại thư mục source code ban đầu, chạy dotnet publish để build dự án, lấy code đã build nhé

1.b Các bạn nào dùng Visual Studio có thể click chuột phải vào Project, chọn Publish và chọn Publish ra file nha

Code của chúng ta sẽ nằm trong thư mục bin/debug/…/publish

2. Các bạn zip toàn bộ file trong thư mục publish thành 1 file zip, để tên là app.zip hoặc tên gì cũng được. (Zip toàn bộ file chứ đừng zip thư mục nha)

Zip toàn bộ file như trong hình nha

3. Truy cập vào giao diện deploy của Azure bằng cách thêm scm vào trước azurewebsite.

Giả sử web của bạn là codedao-dotnet.azurewebsites.net, bạn hãy truy cập vào codedao-dotnet.scm.azurewebsites.net.

Bấm vào Tool => Zip Push Deploy

4. Kéo file app.zip vào đoạn wwwroot (Azure hơi chuối, ko cho chọn file…). Nếu thấy Deployment Successful là ok nha.

5. Sau khi code của bạn đã deploy thành công, truy cập lại URL cũ để xem Website của chúng ta nhé.

Webstie đã được deploy, có domain có HTTPS, không cần phải cài đặt setup vòng vòng gì cả. Các bạn thấy tiện chưa.

Chạy được rồi vui quá ahihi!

Deploy theo phong cách CI với Git

Với cách làm thủ công, mỗi khi bạn cần sửa code, bạn sẽ phải publish lại, up lên Azure lại, rất tốn công phải không nào!

Hiện nay, phần lớn các công ty đều đã sử dụng CI – Continous Integration, giúp deploy tự động mỗi khi chúng ta commit code. Vì Azure cũng có hỗ trợ cái này nên mình cùng các bạn làm luôn.

1. Các bạn quay lại Web App của mình -> Deployment Center -> Local Git. Bấm Continue.

Azure có hỗ trợ Github luôn, nhưng làm cách này thì ko dùng Github bạn vẫn deploy được

2. Chọn App Service Kudu build server, bấm Continue => Finish. Chờ 1 xíu để Azure tạo git branch cho bạn push code lên.

3. Các bạn đã có git branch để deploy code. Nhớ lưu Git Clone Uri lại. Mỗi khi có commit mới trong branch này, Azure sẽ tự động deploy code mới nhất lên nha.

Nhớ copy cái Git Clone Uri lại nhé

4. Tạo local Git repository: Nếu các bạn dùng Git để clone project từ github về thì thư mục của bạn đã là repository, có thể bỏ qua bước này, qua bước 5.

Nếu các bạn tải file zip về, giải nén, hãy chạy lần lượt 3 lệnh sau để để commit toàn bộ file vào local nhé nhé.

  • git init
  • git add .
  • git commit -m “First”

5. Tạo liên hệ giữ branch local của git và branch của Azure. Các bạn gõ git remote add azure-deploy [url branch ở bước 3]

azure-deploy ở đây là tên branch, các bạn thích đặt gì cũng được

6. Gõ git push azure-deploy để push code lên branch đó. Khi nó đòi username và password thì các bạn quay lại Azure Portal, bấm vào Deployment Credential để lấy nhé.

7. Chờ một xíu, code của bạn đã được build và deploy rồi đấy.

8. Khi bạn sửa code, chỉ cần commit và chạy git push azure-deploy để build và deploy lại lên azure là được. Tiện chưa nào!

Với cách này, khi làm việc nhóm, dùng chung Git, mỗi khi sửa code thì mỗi thành viên chỉ cần push lên branch remote là được.

Azure sẽ tự động build và deploy bản mới nhất luôn! Rất tiện lợi, đứa nào làm gì break build là biết nhé.

Tạm kết

Sau phần này, các bạn đã biết cách deploy 1 ứng dụng lên Azure App Service. Đây là một trong những kĩ năng quan trọng bậc nhất khi dùng Cloud, biết nó là bạn đã giỏi hơn khối đứa rồi đấy!

Ứng dụng nào cũng phải có Database! Ở phần 3, mình có nói các bạn có thể cài DB trên máy ảo, sau đó mở port 1433 (Với MS SQL Server) hoặc port 3306 (Cho MySQL server) là được.

Tuy nhiên, tội tình gì phải cài tốn công vậy, khi Azure đã có dịch vụ SQL Database trên Cloud luôn. Ở kì sau, tức phần 5, chúng ta sẽ tìm hiểu thêm và làm demo về dịch vụ này nha!

Bật mí nè: Dịch vụ này sẽ giúp bạn có ngay 1 MS SQL Server trong vòng 2 phút mà không cần cài đặt gì luôn!

 

P/S: Nếu trong quá trình làm theo gặp vấn đề, hay có câu hỏi thắc mắc gì, các bạn cứ post trong mục comment nhe. Mình sẽ cố gắng giải đáp.

11 thoughts on “Cùng học Cờ Lao – Azure Phần 4.2: Deploy ứng dụng lên Azure App Service trong 5 phút”

  1. web app trên azure còn deploy được những ứng dụng java, nodejs, php… nữa nói chung khá tiện cho những bạn chỉ biết code ko biết config hệ thống

    Like

  2. Anh ơi hướng dẫn cách làm bằng visual studio đi a,…. cái màn hình màu đen để chạy lệnh đó là gì ạ… bật chỗ nào a

    Like

  3. Thanks a với loại bài này :). Em deploy được nodejs với php thuần theo tutorial của azure bằng service app, mà deploy laravel ko được a ơi.. 😥 giúp em với .. nó báo “You don’t have permission to access / on this server.”

    Like

  4. anh ơi hiện tại em bị gặp lỗi “You do not have permission to view this directory or page” khi truy cập vào link web đã tạo. Lỗi này mình chưa bật quyền ở đâu vậy anh

    Like

Leave a comment