VSCode, Azure và Containers

Phi Huynh
Azure Vietnam
Published in
7 min readJul 1, 2018

VS Code, một trong những sản phẩm nguồn mở thành công nhất của Microsoft, đang trở thành một xu hướng mới và là một tool không thể thiếu cho các developers. VS Code hỗ trợ hầu hết các ngôn ngữ phổ biến như JavaScript, C#, Python, Java và cả C++ nữa. Với hệ sinh thái rất giàu có, anh em hầu như có thể làm được rất nhiều việc khác ngoài viết code, chẳng hạn như kết nối đến Azure, deploy ứng dụng lên đám mây và thậm chí có thể deploy các container lên mây và debugging một cách dễ dàng.

Trong bài này, chúng ta sẽ từng bước xây dựng một ứng dụng bằng .NET Core và đóng gói thành image sau đó deploy lên Azure App Service.

Chuẩn bị các công cụ cần thiết

  1. VS Code hỗ trợ hầu hết các OS phổ biến: Windows, Mac và Linux, các bạn cài đặt ở đây.
  2. Cài đặt Docker. Giả sử là anh em đã có kiến thức Docker cơ bản rồi nhé. Nếu chưa thì cần phải nâng cấp kiến thức gấp ah.
  3. Đăng ký Azure Account. Sẽ cần có Credit Card để điền thông tin, tuy nhiên không quá lo lắng vì Azure sẽ không tính bất kỳ phí gì, sau khi đăng ký thì chúng ta sẽ có 200$ sử dụng các Azure Service trong một năm.
  4. Cài đặt Docker Extension
  5. Cài đặt Azure App Service Extension
  6. Cài đặt .NET Core SDK 2.1. Do bài viết dùng .NET Core nên sẽ cần cài thêm SDK này, nếu bạn dùng NodeJS hoặc các ngôn ngữ khác thì sẽ cài tùy biến theo yêu cầu.

Tạo ứng dụng .NET Core và chạy ở local

Từ cửa sổ console, bạn chạy lệnh sau để tạo một ứng dụng .NET Core WebAPI mới:

$ dotnet new webapi -o sampleapi
The template "ASP.NET Core Web API" was created successfully.
Processing post-creation actions...
Running 'dotnet restore' on sampleapi/sampleapi.csproj...
Restore succeeded.

Chạy thử ứng dụng ở local

$ cd sampleapi && dotnet run
Using launch settings from /Users/.../launchSettings.json...
User profile is available. Using '../DataProtection-Keys' as key repository; keys will not be encrypted at rest.Hosting environment: DevelopmentContent root path: /Users/phihuynh/Data/projects/sampleapiNow listening on: https://localhost:5001
Now listening on: http://localhost:5000
Application started. Press Ctrl+C to shut down.

Sau đó test thử xem API chạy đã okie chưa :) . Mở một cửa sổ khác và chạy lệnh sau, sẽ thấy kết quả trả về là một mảng ["value1", "value2"]

$ curl -k https://localhost:5001/api/values["value1","value2"]%

Từ terminal, gõ lệnh code . để mở project trong VS Code

Ứng dụng sampleapi trong VS Code

Đóng gói ứng dụng thành image

Đóng gói ứng dụng .NET Core thành image là một xu hướng mới, nó giống như sau khi chúng ta sản xuất xong hàng hóa thì đóng vào công-tai-nơ trong thế giới thật vậy. Việc đóng gói ứng dụng thành image sẽ giúp anh em dễ dàng mang image đi khắp nơi mà không sợ bị thay đổi gì.

Để đóng gói ứng dụng thành image, sẽ cần khai báo một Dockerfile. Bạn có thể tạo bằng tay hoặc VS Code có thể tạo cho bạn cũng được, dù VS Code tạo ra Dockerfile nhìn rất cùi bắp :) Anyway, dù sao nó cũng tạo một skeleton có sẵn rồi mình chỉnh sửa thêm cũng không phải là một cách tồi. Bạn mở dự án ở trên bằng VS Code, sau đó nhấn phím kết hợp Command + Shift + P, rồi gõ vào Add Dockerfile to workspace, chọn .NET Core là VS Code sẽ tự tạo ra Dockerfile, docker-compose và .dockerignore. Hơi rườm ra, nhưng dù sao có cũng hơn ko phải không ah :)

Chọn .NET Core sau khi nhấn Command + Shift + P (trên Mac), trên Windows chắc khác chút 😥

Và đây là nội dung Dockerfile, file Dockerfile này đã được chỉnh sửa lại thì mới chạy được, còn file nguyên gốc của VS Code thì bị lỗi (hơi cùi tí 😞)

FROM microsoft/dotnet:2.1-sdk
LABEL Name=sampleapi Version=0.0.1
ARG source=.
WORKDIR /app
EXPOSE 80
COPY $source .
RUN dotnet publish -c Release -o publish
ENTRYPOINT dotnet publish/sampleapi.dll

Tiếp tục nhấn phím tắt Control + ` để mở cửa sổ Terminal bên trong VS Code. Sau đó gõ lệnh $ docker build -t sampleapi . để build ứng dụng thành image tên là sampleapi.

$ docker build -t sampleapi .
Sending build context to Docker daemon 1.284MB
Step 1/7 : FROM microsoft/aspnetcore:1
1: Pulling from microsoft/aspnetcore
3d77ce4481b1: Already exists
a3fdd11ed866: Pull complete
Digest: sha256:f9f57541975345ec6b57d88831885c13d170fd7575ed941cfb3c5d08cea71462
Status: Downloaded newer image for microsoft/aspnetcore:1
---> 19f26fd165b6
Step 2/7 : LABEL Name=sampleapi Version=0.0.1
---> Running in 300ffa40572c
Removing intermediate container 300ffa40572c
---> 825b1306abc8
Step 3/7 : ARG source=.
---> Running in b31538b2a5c0
Removing intermediate container b31538b2a5c0
---> 6faa78a533fb
Step 4/7 : WORKDIR /app
Removing intermediate container 222069ed23f0
---> c25e3883e48b
Step 5/7 : EXPOSE 5000
---> Running in 50ae504e2514
Removing intermediate container 50ae504e2514
---> 86cad413fd69
Step 6/7 : COPY $source .
---> c9708a68ef23
Step 7/7 : ENTRYPOINT dotnet sampleapi.dll
---> Running in c5d9d8e5422f
Removing intermediate container c5d9d8e5422f
---> 756452fa6a31
Successfully built 756452fa6a31
Successfully tagged sampleapi:latest

Chuyển image của ứng dụng lên Docker Hub

DockerHub có thể được hiểu như là một kho trung tâm tập trung các image của rất nhiều ứng dụng. Dĩ nhiên kho này là public và ai cũng có thể thấy được, nếu anh em muốn image chỉ được một số người thấy (private) thì có thể mua của Docker (tối thiểu 7$/tháng) hoặc của Azure Container Registry (tối thiểu 5$/tháng). Trong bài này mình xài hàng miễn phí, để đẩy lên DockerHub, anh em phải tạo account trên Docker, sau đó đăng nhập vào trên terminal, rồi đẩy lên thôi.

Đăng nhập vào Docker

$ docker loginLogin with your Docker ID to push and pull images from Docker Hub. If you don't have a Docker ID, head over to https://hub.docker.com to create one.
Username: [username]
Password:[password]
Login Succeeded

Đẩy lên Docker Hub, đầu tiên cần tag image với cú pháp [username]/imagename, sau đó push lên Docker Hub. Đến đây xem như chúng ta đã có một image sẵn sàng cho việc deploy đi bất kỳ môi trường nào mà không sợ image bị thay đổi, vì nó là immutable mà :)

$ docker tag sampleapi trumhemcut/sampleapi
$ docker push trumhemcut/sampleapi
The push refers to repository [docker.io/trumhemcut/sampleapi]
13890210e4cf: Pushed
fdf1236c5ead: Mounted from microsoft/aspnetcore
...
2c833f307fd8: Mounted from microsoft/aspnetcore
latest: digest: sha256:70896c5cdbd5c116791d4f14ea951590a87f550e2bc8d1cba0a40cb4627eb4c8 size: 1791

Deploy ứng dụng lên Azure App Service

Sau khi đã build image, anh em có thể deploy bằng nhiều cách. Có thể là deploy ở môi trường local (bằng lệnh docker run ) hoặc chạy “trên mây” với Azure App Service / Service Fabric / Azure Kubernetes Service, … Trong bài này mình hướng dẫn chạy trên mây với Azure App Service.

Dùng VS Code tiện là ở chỗ này, anh em chú ý là phải cài đầy đủ hàng ở bước đầu tiên nhé. Khi đó VS Code sẽ hiển thị các image trên Docker Hub như trong hình. Anh em nhấn phải chuột vào image sampleapi, sau đó chọn Deploy image to Azure App Service

sampleapi image đã được push thành công lên Docker Hub

Sau khi chọn Deploy to Azure App Service, cần phải điền thêm một số thông số như sau:

  • Tạo web app tên là sampleapi3006, nói chung là tên tùy ý để đừng bị trùng
  • Tạo resource group, cái này giống như ngăn chưa để chứa thông tin các service của chúng ta
  • Tạo App Service Plan, cái này giống như một máy Linux có sẵn Nginx (hoặc một máy Windows có cài sẵn IIS)
Đặt tên Web App là sampleapi
Đặt tên cho Resource Group là sampleapi
Đặt tên cho App Service Plan và gói S1
Và kết quả là có một website ngon lành cành đào: https://sampleapi3006.azurewebsites.net . Lưu ý là site này bạn phải đặt một tên chưa tồn tại nhé

Sau đó test thử xem website hoạt động okie không.

Mình lỡ xóa app cũ, nên deploy lại app mới với tên khác :)

Nếu anh em làm đến đây thì coi như okie hết rồi đó. Các bạn thấy chỉ từ VS Code, không cần truy cập đến Azure Portal, anh em vẫn có thể deploy một ứng dụng .NET Core bằng image build sẵn lên Azure rất dễ dàng đúng không ạ. Anh em thử xem sao, chứ tôi là tôi xem VS Code là tool mà mình ưng ý nhất đến thời điểm hiện tại và nó vẫn đang phát triển như vũ bão :) Chúc anh em thành công.

--

--