Chuyển đến nội dung chính

Bài đăng

AZ-204: Scale apps trong Azure App Service - Day 5

Giới thiệu Azure App Service là một dịch vụ đám mây cung cấp khả năng lưu trữ và chạy các ứng dụng web, API và máy chủ. Một trong những tính năng hữu ích của Azure App Service là tự động mở rộng, cho phép bạn tự động tăng hoặc giảm số lượng server chạy ứng dụng của mình để đáp ứng nhu cầu về tài nguyên. Autoscaling rules Autoscale rule là một quy tắc xác định cách Azure App Service tự động mở rộng ứng dụng của bạn. Quy tắc bao gồm các điều kiện kích hoạt và hành động. Điều kiện kích hoạt xác định khi nào Azure App Service nên mở rộng ứng dụng của bạn, trong khi hành động xác định cách Azure App Service nên mở rộng ứng dụng của bạn. Có hai loại điều kiện kích hoạt (Autoscale conditions):  Base rule: Điều kiện kích hoạt cơ bản dựa trên số lượng requrest chờ được xử lý bởi ứng dụng của bạn, hoặc disk size của ứng dụng. Advanced rule: Điều kiện kích hoạt nâng cao dựa trên các chỉ số khác, chẳng hạn như sử dụng bộ nhớ hoặc CPU, hoặc tại 1 thời điểm trong ngày hoặc 1 ngày đặc biệt nà...

Giới thiệu về .NET Isolated Process Azure Functions

.NET Isolated Process Azure Functions .NET Isolated Process Functions là một mô hình triển khai Azure Function cho phép các hàm chạy trong một quy trình riêng biệt (isolated process), tách biệt khỏi Azure Functions Runtime. Đây là roadmap của isolated và in-process Azure Function   Sử dụng Isolated Process Azure Functions có nhiều lợi ích Quản lý quá trình app startup Cấu hình Dependency Injection Cấu hình middleware Tránh xung đột với các version với các class library Tạo project Azure Function Có 2 cách để tạo project Azure Function, 1 là tạo thông qua IDE (Visual Studio, Visual Studio Code), 2 là thông qua command line 1. Để tạo project từ command line, bạn cần cài đặt Azure Functions Core Tools tại đây Gõ lệnh func init ProjectName Chọn worker runtime là donet (isolated process) Use the up/down arrow keys to select a worker runtime: dotnet dotnet (isolated process) node python powershell custom 2. Trong Visual Studio, chọn Azure Function => tại Dialog A...

AZ-204: Exercise: Create a static HTML web app by using Azure Cloud Shell - Day 4

Exercise: Create a static HTML web app by using Azure Cloud Shell - Training | Microsoft Learn Giải thích Azure Cloud Shell is an interactive, authenticated, browser-accessible terminal for managing Azure resources. It provides the flexibility of choosing the shell experience that best suits the way you work, either Bash or PowerShell. resourceGroup=$(az group list --query "[].{id:name}" -o tsv) az group list: Đây là một lệnh của Azure Command-Line Interface (CLI) được sử dụng để liệt kê các nhóm tài nguyên trong tài khoản Azure. --query "[].{id:name}": Đây là một tùy chọn sử dụng để truy vấn (query) dữ liệu được trả về từ command. Trong trường hợp này, chúng ta đang yêu cầu trả về danh sách các resource group và chỉ lấy ra hai thuộc tính của mỗi nhóm tài nguyên, đó là id và name. Biểu thức "[].{id:name}" là một biểu thức JMESPath, được sử dụng để định dạng dữ liệu trả về theo yêu cầu. JMESPath is a query language for JSON. -o tsv: Đây là tùy chọn để...

React: Higher-Order Component - Day 15

Giới thiệu Higher-order component (HOC) là một kỹ thuật nâng cao trong React được sử dụng trong việc sử dụng lại các component. HOCs không là một phần trong React API. Một cách cụ thể, một higher-order component là một hàm và nó nhận đối số là một component và trả về một component mới. A higher-order component (HOC) is an advanced technique in React for reusing component logic. HOCs are not part of the React API, per se. They are a pattern that emerges from React's compositional nature. Concretely, a higher-order component is a function that takes a component and returns a new component. Higher-Order Component Structure Để định nghĩa Higher-Order Component (HOC) trong React, bạn cần qua các bước: - Define HOC function: Hàm này nhận vào input là component (hoặc có thêm vài parameter khác) và trả về 1 component mới với thêm 1 số tinh năng mới. const higherFunction = (WrappedComponent) => { // ... } Định nghĩa new component const NewComponent = () => { return ( <...

Giới thiệu Aspect Oriented Programming (AOP)

Nguồn:  https://gpcoder.com/5112-gioi-thieu-aspect-oriented-programming-aop/ AOP là gì? Trong khi xây dựng các chương trình ứng dụng, có rất nhiều những vấn đề liên quan đến phần mềm mà chúng ta cần quan tâm. Chẳng hạn, chúng ta xây dựng một hệ thống đăng ký tạo tài khoản cho một ngân hàng. Ngoài công việc chính cho phép người dùng có thể tạo tài khoản (core concern), hệ thống còn phải đảm bảo các vấn đề khác (cross-cutting concern) như chứng thực người dùng, kiểm tra ràng buộc, quản lý transaction, xử lý ngoại lệ, ghi log, debug, đo hiệu năng của ứng dụng, … Logger logger = Logger.getLogger(...); TransactionManager tm = getTransactionManager(); public void addAccount(Account account) { logger.info("Creating (" + account + ") Account"); try { tm.beginTransaction(); db.add(account); tm.commit(); } catch (Exception) { tm.rollback(); logger.error("Account creation failed"); } } Như bạn thấy, logic của c...

React: React Router - Day 14

Giới thiệu React-Router là một thư viện định tuyến (routing) tiêu chuẩn trong React. Nó giữ cho giao diện của ứng dụng đồng bộ với URL trên trình duyệt. React-Router cho phép bạn định tuyến "luồng dữ liệu" (data flow ) trong ứng dụng của bạn một cách rõ ràng. Trong bài viết này, chúng ta sẽ hướng dẫn sử dụng React Router trong functional component, cung cấp một số ví dụ đơn giản về việc sử dụng Route, Link, Separate Routes, Nested Routes và Dynamic Routes. Cài đặt Cài đặt React Router bằng cách sử dụng npm hoặc yarn: npm install react-router-dom //or yarn add react-router-dom Import react-router-dom vào trong file App.tsx: import { BrowserRouter } from "react-router-dom"; Các thành phần chính Có 3 thành phần chính trong React Router: Routes, như là <BrowserRouter> và <HashRouter> Route Matchers, như là <Route> và <Switch> Navigation, như là <Link> , <NavLink> và <Redirect> Sử dụng Route React-Router cung cấp cho c...

React: Cách tổ chức thư mục trong React Js - Day 13

Bài này mang tính chất tổng hợp từ các nguồn khác nhau. Cấu trúc project my-app/ README.md node_modules/ package.json public/ index.html favicon.ico src/ common/ ... components/ common/ Link.js ... forms/ TextBox.js TextBox.container.js /* Container component */ TextBox.res/style.css TextBox.locale/vi-VN/... ... layout/ App.js - The top-level React component App.res/style.css App.locale/en-US/... Navigation.js Navigation.res/style.css Navigation.res/data.json Navigation.locale/en-US/... ... pages/ Home.js Home.css Account/index.js Account/index.css ... core/ ... constants/ ... helpers/ ... reducers/ ... stores/ ... Trong đó: common: Chứa các thành phần được sử dụng chung trong toàn bộ dự án. components: Chứa các thành phần ...