Nhật ký học tập

Trong bài trước, chúng ta sử dụng props để truyền data từ parent component tới component. Vấn đề đặt ra là làm sao chúng ta có thể tự cập nhật được data. Lúc này chúng ta sử dụng State State là gì? State dùng để lưu trữ giá trị thuộc về component trong ReactJS. Nó chủ yếu được sử dụng để cập nhật component khi người dùng thực hiện một số hành động như nhấp vào nút, nhập một số văn bản, nhấn một số phím, v.v. Tóm lại Là 1 object chứa component data Access bởi component Chỉ được update qua setState() Có 2 loại components trong React: class và functional components. Class components là ES6 class được extend từ built-in Component class, nên có state và lifecycle methods import { Component } from 'react'; class Message extends Component { constructor(props) { super(props); this.state = { message: '' }; } componentDidMount() { /* ... */ } render() { return <div>{this.state.message}</div>; } } Có một số lý do tại sao bạ

Giới thiệu Data driven trong ReactJS là một phương pháp thiết kế ứng dụng web bằng cách sử dụng dữ liệu để khởi tạo và điều khiển các thành phần UI. Theo cách này, dữ liệu được lưu trữ trong state và props của các thành phần, và được truyền qua lại giữa chúng để cập nhật giao diện. Khi có sự thay đổi trong dữ liệu, ReactJS cập nhật lại giao diện ứng dụng một cách tự động, giúp cho trải nghiệm người dùng trở nên tuyệt vời hơn. Tham khảo Sử dụng props Props là một khái niệm quan trọng trong ReactJS, được sử dụng để truyền dữ liệu từ một component cha sang một component con.  Props là viết tắt của properties, có nghĩa là thuộc tính. Props là một object được truyền vào trong một component, mỗi component sẽ nhận vào props và trả về react element. Props cho phép chúng ta giao tiếp giữa các component với nhau bằng cách truyền tham số qua lại giữa các component. Khi một component cha truyền cho component con một props thì component con chỉ có thể đọc và không có quyền chỉnh sửa nó bên phía

Giới thiệu Các dữ liệu JSON thường được sử dụng trong ứng dụng web, đặc biệt là Web API, Serverless. Chính vì vậy từ .NET Core 3.0, Microsoft đã đưa System.Text.Json vào Framework và ngày càng xử lý tốt hơn. Trong bài viết này, mình sẽ tìm hiểu cách sử dụng cơ bản của 2 thư viện trên, và cách xử lý lỗi khi serialize object trên Azure Functions. JSON là gì? JSON là viết tắt của JavaScript Object Notation, là một kiểu định dạng dữ liệu tuân theo một quy luật nhất định mà hầu hết các ngôn ngữ lập trình hiện nay đều có thể đọc được. JSON là một tiêu chuẩn mở để trao đổi dữ liệu trên web. Serialize và deserializie là gì? Trong C#, serialization là quá trình chuyển đổi đối tượng sang byte stream để có thể lưu vào memory, file hoặc database. Quá trình ngược lại gọi là deserialization Serialize an object Deserialzie byte stream to object Ví dụ sử dụng serialization và deserialization Tạo 2 class Person và Pet class Person { public string Name { get; set; } public int Age { get; set; }

Giả sử bạn có class Person public class Person { public string Name { get; set; } public int Age { get; set; } } Bạn có data dynamic như sau: using System.Dynamic; dynamic expando = new ExpandoObject(); expando.Name = "John Doe"; expando.Age = 30; expando.Address = new ExpandoObject(); expando.Address.State = "WA"; Console.WriteLine(expando.Address.State); Cách 1 using ExpandoObjectExample; using Newtonsoft.Json; //--your old code var convertedObject = JsonConvert.DeserializeObject<Person>(JsonConvert.SerializeObject(expando)); Console.WriteLine(convertedObject.Name); Cách 2 public static TObject ToObject<TObject>(this IDictionary<string, object> someSource, BindingFlags bindingFlags = BindingFlags.Instance | BindingFlags.Public) where TObject : class, new() { Contract.Requires(someSource != null); TObject targetObject = new TObject(); Type targetObjectType = typeof(TObject); // Go through all bound target object type properties..

Outbox Pattern là một mẫu thiết kế được sử dụng trong các hệ thống phân tán dựa trên sự kiện, cho phép thực hiện các thao tác cơ sở dữ liệu và đăng tin nhắn một cách đáng tin cậy. Mục đích của mẫu này là để giải quyết vấn đề mất mát hoặc trùng lặp tin nhắn khi có sự cố xảy ra giữa việc lưu dữ liệu và gửi tin nhắn. Cơ chế của mẫu này là lưu trữ các tin nhắn vào một bảng (gọi là Outbox) trong cùng một giao dịch với dữ liệu, sau đó sử dụng một tiến trình nền để đọc các tin nhắn từ Outbox và gửi chúng đến Message Broker. Khi tin nhắn được gửi thành công, chúng sẽ được xóa khỏi Outbox (to be continue) Tham khảo Triển khai hệ thống đồng bộ dữ liệu giữa n server có n database tách biệt nhau – Thao Tran (wordpress.com) Distributed transaction - Transactional outbox pattern Outbox Pattern for Microservices Architectures | by Mehmet Ozkaya | Design Microservices Architecture with Patterns & Principles | Medium Outbox Pattern(phương thức thiết kế để lưu trạng thái và publish event đáng tin cậ

Giới thiệu Azure Service Bus là một dịch vụ được cung cấp bởi Microsoft Azure để hỗ trợ việc trao đổi tin nhắn giữa các ứng dụng khác nhau trên nền tảng điện toán đám mây. Đây là một trong những service khá hay và được sử dụng phổ biến trong những hệ thống phức tạp. Các tính năng của Azure Service Bus bao gồm việc hỗ trợ nhiều giao thức trao đổi tin nhắn như AMQP, HTTP và HTTPS, hỗ trợ đa nền tảng và tích hợp với nhiều ngôn ngữ lập trình khác nhau. Để sử dụng Azure Service Bus, bạn cần đăng ký tài khoản Azure và tạo một Service Bus Namespace. Sau đó, bạn có thể tạo các Queue hoặc Topic để truyền tải các tin nhắn giữa các ứng dụng. Ngoài ra, Azure Service Bus còn cung cấp nhiều tính năng và công cụ phân tích để giúp bạn quản lý và giám sát hệ thống của mình. Với Azure Service Bus, bạn có thể xây dựng được các ứng dụng đám mây hiệu quả và tự động hóa được các quy trình liên quan đến trao đổi tin nhắn giữa các ứng dụng khác nhau. Namespace Azure namespace là một khái niệm được sử dụng để

Azure functions hỗ trợ rất nhiều triggers, trong đó có Cosmos DB Trigger. Cosmos DB Trigger sử dụng Azure Cosmos DB change feed để listen những thay đổi từ container (inserting, updating, chưa hỗ trợ delete). Tham khảo bài viết Tìm hiểu về CosmosDB để xem cách tạo Database, container trong Cosmos:  https://nhatkyhoctap.blogspot.com/2023/05/tim-hieu-ve-azure-comos-db.html Tham khảo bài viết cách tạo Azure Functioin trong Visual Studio Code:  https://nhatkyhoctap.blogspot.com/2023/05/azure-functions-tao-project-azure.html Các bước tạo Azure Function tương tự như trên, tuy nhiên ở bước chọn trigger, bạn chọn Azure Cosmos DB Trigger . Nếu có hộp thoại hỏi chọn database name, bạn bấm Skip for now. Azure Function sẽ có đoạn code như sau: using System; using System.Collections.Generic; using Microsoft.Azure.Functions.Worker; using Microsoft.Extensions.Logging; namespace AzureLearning.Function { public class CosmosSampleTrigger { private readonly ILogger _logger; pub

Trong bài viết này, mình sẽ hướng dẫn các bạn các tạo Project Function App trong Visual Studio, Visual Studio Code, và thực hiện việc debug.  Tạo Project Azure Function trong Visual Studio Trong Visual Studio: Tạo project bằng cách chọn Create a new project Chọn Visual C# > Cloud > Azure Functions. Nhấp Next. Bước tiếp theo chúng ta chọn Azurite Nhấp Finish Bạn sẽ có project code như sau: Tại dòng 13, 15, bạn có thể thay Function1 bằng 1 tên có ý nghĩa. public static class HelloFunctionApp { [FunctionName("HelloFunctionApp")] public static async Task<IActionResult> Run( [HttpTrigger(AuthorizationLevel.Function, "get", "post", Route = null)] HttpRequest req, ILogger log) { log.LogInformation("C# HTTP trigger function processed a request."); string name = req.Query["name"]; string requestBody = await new StreamReader(req.Body).ReadToEndAsync(); dynamic data = JsonConvert.DeserializeObject(requestBody);

Azure Functions là 1 giải pháp để thực hiện dễ dàng những đoạn code nhỏ, hoặc “functions” trên cloud. Bạn không cần quan tâm đến đến các thành phần khác như ngôn ngữ, hạ tầng, hoặc server. Vì Azure Functioin hỗ trợ nhiều ngôn ngữ lập trình như C#, F#, Node.js, Java, hoặc PHP. Hoặc nếu bạn đang muốn chuyển đổi ứng dụng từ on-premises lên cloud, thì bạn thử suy nghĩ đến phương án Azure Function. Azure Functions, Function Apps, và Functions Khi bạn làm việc Azure Functions, bạn sẽ gặp rất nhiều thuật ngữ liên quan tới "functions". Azure Functions: Đây là tên dịch vụ trên Azure. Một số dịch vụ khác của Azure như Azure Automation, Azure Virtual Machines, hoặc Azure Storage Accounts. (Bên AWS có AWS Lambda, Google có Google Cloud Functions) Function App: Đây là 1 instance của Azure Functions. Đây là ứng dụng duy nhất Function: một hàm trong code. Bạn có thể có nhiều hàm (1-n) trong Function App. Có 2 loại Function App: Functions chứa C# script (.csx) file In-Process Class Library

Azure Cosmos DB bắt đầu với tên gọi Dự án Florence Florence năm 2010 để giải quyết các điểm đau của nhà phát triển phải đối mặt với các ứng dụng quy mô lớn trong Microsoft. Quan sát rằng những thách thức trong việc xây dựng các ứng dụng phân tán trên toàn cầu không phải là vấn đề duy nhất đối với Microsoft, năm 2015 microsoft đã tạo ra thế hệ đầu tiên của công nghệ này cho các nhà phát triển Azure dưới dạng Azure DocumentDB. Kể từ đó, Microsoft đã thêm dần các tính năng mới và giới thiệu các khả năng mới quan trọng. Năm 2017, Microsoft đã đổi tên Azure DocumentDB thành Azure Cosmos DB và mở rộng hỗ trợ cho nhiều giao diện cơ sở dữ liệu khác nhau Comos db có nhiều ưu điểm như: Tốc độ và thông lượng cao với độ trễ thấp và phân phối dữ liệu toàn cầu. Khả năng mở rộng tự động và linh hoạt theo nhu cầu của ứng dụng. Hỗ trợ nhiều giao diện cơ sở dữ liệu như NoSQL, MongoDB, PostgreSQL, Apache Cassandra, Apache Gremlin và Table. An ninh và tính sẵn sàng cao với sao lưu liên tục và bảo mật doan

Refit là một thư viện cho C# giúp bạn tương tác với các API dựa trên HTTP một cách an toàn về kiểu dữ liệu. Refit được lấy cảm hứng từ thư viện Retrofit của Square, cho phép bạn chuyển đổi API của bạn thành live interface Rest API (Server): public interface IGitHubApi { [Get("/users/{user}")] Task<User> GetUser(string user); } Trường hợp không sử dụng Refit var gitHubApi = RestService.For$lt;IGitHubApi>("https://api.github.com"); var octocat = await gitHubApi.GetUser("octocat"); Trường hợp sử dụng Refit Khai báo lại interface public interface IGitHubApi { [Get("/users/{user}")] Task<User> GetUser(string user); } Đăng ký interface trong Program.cs (trường hợp xài Blazor) services .AddRefitClient<IGitHubApi>() .ConfigureHttpClient(c => c.BaseAddress = new Uri("https://api.github.com")); Tham khảo reactiveui/refit Making Faster API Calls Using Refit Rest Library (c-sharpcorner.com) Using

A resource group is a container used for the logical organization of resources in Azure. These resources may be part of the same solution or based on any grouping that you prefer. Some organizations prefer to keep all services that are part of a solution in a single resource group. For example, say you are hosting a payroll application that has a virtual machine, SQL database, and storage. You can group these resources so that you can manage the lifecycle of them together. Some organizations prefer to keep resources of the same type together, for example, all virtual machines in a single resource group or all databases in a single resource group. This strategy would help them to manage the access to all virtual machines or databases easily. Note: Resource group có thể chứa resource ở những region khác nhau

Azure account Azure account là một email (nhận dạng) cho phép bạn truy cập các tài nguyên liên quan đến tất cả các subscription liên kết với Azure Active Directory (AAD) với các quyền thích hợp Azure Subscription Azure subscription là một khối chứa cơ bản bao gồm một nhóm các tài nguyên liên quan đến kinh doanh hoặc kỹ thuật. Bạn có thể có nhiều subscription cho các mục đích khác nhau, chẳng hạn như sản xuất, phát triển, kiểm thử, v.v Azure management group là một công cụ giúp bạn quản lý hiệu quả truy cập, chính sách và tuân thủ cho các subscription của bạn. Bạn có thể xác định một hệ thống phân cấp của các management group trong AAD của bạn để phù hợp với cấu trúc và nhu cầu của tổ chức bạn2. Bạn có thể sử dụng một subscription để sử dụng một hoặc nhiều dịch vụ hoặc nền tảng đám mây của Microsoft, chẳng hạn như Microsoft 365, Microsoft Azure hoặc Microsoft Dynamics 365. Các chi phí tính theo phí bản quyền người dùng hoặc theo tiêu thụ tài nguyên đám mây Azure cost management Kiểm soá

Định nghĩa Compliance (n): sự tuân theo Governance (n): Sự cai quản; nhiệm vụ cai quản Compliance and Cloud Governance là hai khái niệm liên quan đến việc đảm bảo an ninh và tuân thủ các quy tắc trong môi trường đám mây. Compliance là các thủ tục và thực hành nhằm đảm bảo môi trường đám mây tuân thủ các quy tắc quản trị. Nói cách khác, khi bạn xây dựng một môi trường đám mây tuân thủ, môi trường của bạn phù hợp với một hoặc nhiều bộ tiêu chuẩn an ninh và bảo mật cụ thể. Cloud Governance là một tập hợp các quy tắc và chính sách được áp dụng bởi các công ty chạy các dịch vụ trong đám mây. Mục tiêu của Cloud Governance là nâng cao an ninh dữ liệu, quản lý rủi ro và cho phép hoạt động trơn tru của các hệ thống đám mây.  Bao gồm: Manage subscriptions và governance Manage role-based access control (RBAC) Azure Region Azure region là một khu vực địa lý chứa một hoặc nhiều datacenter (trung tâm dữ liệu) của Azure. Bạn có thể tạo các tài nguyên Azure trong các khu vực định sẵn như ‘West US’, ‘N

Trong bài viết này, chúng ta sẽ xây dựng giao diện từ project html-javascript-css cho đến project sử dụng react app. Giao diện trang web Giao diện bao gồm: HTML5 + Bootstrap 5 <!DOCTYPE html> <html lang="en"> <head> <title>Bootstrap 5 Example</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet"> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"></script> </head> <body> <div class="container-fluid p-5 bg-primary text-white text-center"> <h1>My First Bootstrap Page</h1> <p>Resize this responsive page to see the effect!</p> </div> <div class="container mt-5"> <div class="r