Discover the power of advanced hooks in React! Unleash the full potential of functional components with custom hooks, useTransition, useDeferredValue, and more. Elevate your React skills and build dynamic, efficient, and reusable hooks effortlessly. Let's dive into the world of advanced hooks!

Advanced hooks in React

Explore the enchanting world of CSS animation, elevating web designs with captivating transitions and dynamic effects. Unleash creativity as we delve into key techniques and practices, empowering you to create immersive experiences. Join our exciting CSS animation journey!

Animation in CSS

Design patterns are reusable solutions to common problems in software development, and they can be especially useful in React applications. In this blog, we will explore some popular design patterns in React and how they can improve the structure, maintainability, and scalability of your code.

Design patterns in React

Do you know Web 3.0? Have you ever listened to some keywords like Blockchain, Tokens, Smart Contracts, Block, Semantic website and do not really understand them? You want to deeply understand Web 3.0 and its application architecture. Let me explain for you in this blog.

Introduction to Web 3.0

Tech Lead

Phuong Bui

.NET Developer

Vu Truong

Senior Developer

Trung Tran

Tech lead

Wind

Long Nguyen

Business Analyst

Duong Dat Thanh

Creating an English learning video for TikTok using Remotion involves scripting educational content, audio, text, images, and adding animation to engage viewers.

How to Create an English Learning Video for TikTok Using Remotion

<html><body>1. Introduction ECMAScript, the standard behind JavaScript, continues to evolve, bringing new features and improvements to the language. The latest version, ECMAScript 2024, introduces several exciting updates that promise to enhance the way developers write and manage their code. In this blog post, we’ll explore the key features of ECMAScript 2024 and their potential impact on the JavaScript ecosystem. JavaScript is one of the most widely used programming languages in the world, powering everything from simple web pages to complex web applications. As the language evolves, new features are introduced to make development more efficient, intuitive, and powerful. ECMAScript 2024, the latest version of the ECMAScript standard, brings a host of new features that promise to take JavaScript to the next level. Whether you’re a seasoned developer or just starting out, understanding these new features can help you write better code and stay ahead of the curve. 2. New Features in ECMAScript 2024 2.1. Object.groupBy() and Map.groupBy() One of the standout features in ECMAScript 2024 is the introduction of Object.groupBy() and Map.groupBy(). These methods allow developers to group elements of an object or map based on the values returned by a callback function. This feature simplifies the process of organizing data, making it more intuitive and efficient. Example:<pre><code class="language-plaintext"> const people = [ 
 { name: "Alice", age: 21 }, 
 { name: "Bob", age: 25 }, 
 { name: "Charlie", age: 21 }, 
 ]; 
 const groupedByAge = Object.groupBy(people, (person) =&gt; person.age); 
 console.log(groupedByAge); // Output: { '21': [{ name: 'Alice', age: 21 }, { name: 'Charlie', age: 21 }], '25': [{ name: 'Bob', age: 25 }] } 
 </code></pre>In this example, the Object.groupBy() method groups the people array by age, creating a new object where the keys are the ages and the values are arrays of people with that age. This can be incredibly useful for tasks like data analysis, where you need to group data by certain criteria. The Map.groupBy() method works similarly but operates on maps instead of objects. This can be particularly useful when working with more complex data structures or when you need the benefits of a map, such as maintaining the order of insertion. Use Cases: <ol><li style="text-align:justify;">Data Analysis: Grouping data by specific criteria for easier analysis. </li><li style="text-align:justify;">Reporting: Creating reports that group data by categories, such as sales by region or users by age group. </li><li style="text-align:justify;">UI Development: Grouping items for display in a user interface, such as grouping products by category in an e-commerce application. </li></ol>2.2. Temporal API The Temporal API is another significant addition to ECMAScript 2024. It provides a modern way to work with dates and times, addressing many of the limitations of the existing Date object. The Temporal API offers precise and flexible date-time manipulation, making it easier to handle complex date and time operations. Key Classes: <ol><li style="text-align:justify;">Temporal.PlainDate </li><li style="text-align:justify;">Temporal.PlainTime </li><li style="text-align:justify;">Temporal.PlainMonthDay </li><li style="text-align:justify;">Temporal.PlainYearMonth </li></ol>Example: <pre><code class="language-plaintext"> const date = Temporal.PlainDate.from("2024-08-14"); 
 console.log(date.add({ days: 1 }).toString()); // Output: 2024-08-15 
 </code></pre>In this example, the Temporal.PlainDate class is used to create a date object, and the add method is used to add one day to the date. The Temporal API provides a more intuitive and powerful way to work with dates and times, making it easier to perform common tasks like adding or subtracting time, comparing dates, and formatting dates for display. Benefits: <ol><li style="text-align:justify;">Precision: The Temporal API provides precise control over dates and times, avoiding many of the pitfalls of the existing Date object. </li><li style="text-align:justify;">Flexibility: The API is designed to handle a wide range of date and time operations, from simple tasks like adding days to complex tasks like working with time zones. </li><li style="text-align:justify;">Ease of Use: The API is designed to be intuitive and easy to use, with clear and consistent methods for common tasks. </li></ol>Use Cases: <ol><li style="text-align:justify;">Scheduling: Creating and managing schedules, such as meeting times or event dates. </li><li style="text-align:justify;">Time Zone Management: Handling dates and times across different time zones, such as scheduling meetings with participants in different parts of the world. </li><li style="text-align:justify;">Date Calculations: Performing complex date calculations, such as calculating the number of days between two dates or determining the next occurrence of a recurring event. </li></ol>2.3. Unicode Strings ECMAScript 2024 brings improvements in handling Unicode strings, enhancing the language’s ability to work with international text. These improvements ensure that developers can work with Unicode strings more accurately, benefiting applications that require internationalization. Example: <pre><code class="language-plaintext"> const str = "𝌆"; 
 console.log(str.length); // Output: 2 (in older versions) 
 console.log([...str].length); // Output: 1 (correct length) 
 </code></pre>In this example, the string 𝌆 is a single Unicode character, but in older versions of JavaScript, it would be counted as two characters. The improvements in ECMAScript 2024 ensure that the length is correctly reported as one character, making it easier to work with Unicode strings. Benefits: <ol><li style="text-align:justify;">Accuracy: The improvements ensure that Unicode strings are handled accurately, avoiding common pitfalls like incorrect string lengths or character counts. </li><li style="text-align:justify;">Internationalization: The improvements make it easier to work with international text, benefiting applications that need to support multiple languages or scripts. </li><li style="text-align:justify;">Consistency: The improvements provide a consistent way to work with Unicode strings, making it easier to write and maintain code. </li></ol>Use Cases: <ol><li style="text-align:justify;">Text Processing: Working with text in different languages or scripts, such as processing user input or displaying text in a user interface. </li><li style="text-align:justify;">Internationalization: Developing applications that need to support multiple languages or scripts, such as translating text or formatting dates and times for different locales. </li><li style="text-align:justify;">Data Validation: Validating and processing text input, such as checking the length of a string or ensuring that a string contains only valid characters. </li></ol>2.4. ArrayBuffer Transfer The new ArrayBuffer Transfer feature allows for efficient transfer of ArrayBuffer objects between different contexts, such as web workers. This feature enhances performance by avoiding the need to copy data, making it ideal for high-performance applications. Example: <pre><code class="language-plaintext"> const buffer = new ArrayBuffer(8); 
 const worker = new Worker("worker.js"); 
 worker.postMessage(buffer, [buffer]); 
 </code></pre>In this example, an ArrayBuffer is created and transferred to a web worker using the postMessage method. The ArrayBuffer is transferred without being copied, improving performance and efficiency. Benefits: <ol><li style="text-align:justify;">Performance: The feature improves performance by avoiding the need to copy data, making it ideal for high-performance applications. </li><li style="text-align:justify;">Efficiency: The feature allows for efficient transfer of data between different contexts, such as web workers or iframes. </li><li style="text-align:justify;">Flexibility: The feature provides a flexible way to transfer data, making it easier to build complex applications that need to share data between different parts of the application. </li></ol>Use Cases: <ol><li style="text-align:justify;">Web Workers: Transferring data between the main thread and web workers, such as offloading computationally intensive tasks to a web worker. </li><li style="text-align:justify;">Data Sharing: Sharing data between different parts of an application, such as transferring data between iframes or different tabs. </li><li style="text-align:justify;">High-Performance Applications: Building high-performance applications that need to transfer large amounts of data efficiently, such as real-time data processing or gaming applications. </li></ol>3. Impact on Development The new features in ECMAScript 2024 are set to improve coding practices by providing more powerful and intuitive tools. Developers can expect to write cleaner, more efficient code, leading to better performance and maintainability. These updates also bring JavaScript closer to other modern programming languages in terms of functionality and ease of use. Improved Coding Practices: The new features in ECMAScript 2024 encourage better coding practices by providing more powerful and intuitive tools. For example, the Object.groupBy() and Map.groupBy() methods make it easier to organize data, while the Temporal API provides a more intuitive way to work with dates and times. These features help developers write cleaner, more efficient code, leading to better performance and maintainability. Enhanced Performance: The new features in ECMAScript 2024 also enhance performance by providing more efficient ways to handle common tasks. For example, the ArrayBuffer Transfer feature allows for efficient transfer of data between different contexts, improving performance in high-performance applications. Similarly, the improvements in handling Unicode strings ensure that text is processed accurately and efficiently, benefiting applications that need to support multiple languages or scripts. Increased Flexibility: The new features in ECMAScript 2024 provide increased flexibility, allowing developers to handle a wider range of tasks more easily. For example, the Temporal API provides a flexible way to work with dates and times, while the improvements in handling Unicode strings make it easier to work with international text. These features help developers build more powerful and flexible applications, meeting the needs of a diverse range of users and use cases. Comparison with Previous Versions: Compared to previous versions of ECMAScript, the 2024 edition brings significant improvements and new features that enhance the language’s capabilities. For example, the introduction of Object.groupBy() and Map.groupBy() provides a more intuitive way to organize data, while the Temporal API offers a modern way to work with dates and times. These features address many of the limitations and pain points that developers have faced in the past, making JavaScript a more powerful and versatile language. Developer Experience: The enhancements in ECMAScript 2024 are designed to improve the overall developer experience. By providing more intuitive and powerful tools, developers can focus more on solving problems and building features rather than dealing with the intricacies of the language. This leads to increased productivity and satisfaction, as developers can achieve more with less effort. Community and Ecosystem: The JavaScript community and ecosystem are likely to benefit significantly from the new features in ECMAScript 2024. As developers adopt these new features, we can expect to see a wave of new libraries, frameworks, and tools that leverage the capabilities of ECMAScript 2024. This will further enrich the JavaScript ecosystem, providing developers with even more resources and options to build high-quality applications. Learning Curve: While the new features in ECMAScript 2024 bring many benefits, they also introduce new concepts and APIs that developers need to learn. However, the learning curve is mitigated by the fact that these features are designed to be intuitive and consistent with existing JavaScript paradigms. Additionally, the wealth of resources available in the JavaScript community, including tutorials, documentation, and community support, will help developers quickly get up to speed with the new features. 4. ConclusionsECMAScript 2024 introduces several exciting features that promise to enhance the JavaScript development experience. From grouping objects to handling dates and times more effectively, these updates are set to make a significant impact. As the language continues to evolve, it’s an exciting time to be a JavaScript developer. The new features not only address long-standing pain points but also open up new possibilities for building more powerful and efficient applications. Thank you for following along with this blog. I hope it has been helpful and inspiring. Happy blogging!  - Reference: <a href="https://ecma-international.org/wp-content/uploads/ECMA-262_15th_edition_june_2024.pdf">ECMAScript 2024</a>  </body></html>

ECMAScript 2024 (ES2024) introduces exciting new features like Object.groupBy(), Map.groupBy(), and enhancements to the Temporal API. These updates aim to improve JavaScript’s functionality and developer productivity, making it more robust and expressive for modern web development.

Exploring ECMAScript 2024: What’s New and Exciting?

Cám ơn bài viết hay, nhưng mình thấy lý thuyết hơn nhiều, chưa có ví dụ để làm rõ

Nin Tran

<html><body><h2 style="text-align:justify;">1. Kiến trúc N-Layer</h2>Chúng ta sẽ có các lớp logic và vật lý khác nhau đáp ứng cho các nhu cầu trong quá trình phát triển ứng dụng. Hầu hết các ứng dụng sử dụng kiến trúc này đều sẽ chứa 4 lớp: presentation, business, persistence và database. Tùy thuộc vào độ phức tạp của ứng dụng mà các lớp sẽ nhiều hoặc ít hơn.<figure class="image"><img src="https://api.careers.saigontechnology.com/storage/ck-editor/CKEDITOR-qMDyPoAWykT2Iwws5bsA5h2lA9Asp2r769b8hj8N.png"></figure><h6 style="text-align:justify;">Nguồn: <a href="https://www.oreilly.com/library/view/software-architecture-patterns/9781491971437/?_gl=1*7a1tjd*_ga*NzE5NTM3ODY4LjE2NzkzODcyOTk.*_ga_092EL089CH*MTY3OTYzMDAzNy42LjEuMTY3OTYzMDA1NS40Mi4wLjA.">Software Architecture Patterns by Mark Richards</a></h6>Các lớp trong mô hình kiến trúc này sẽ đảm nhiệm một vai trò cụ thể, và khi đứng từ một lớp nào đó, chúng ta chỉ có thể giao tiếp với các lớp bên trên hoặc bên dưới của nó. Trong đó:<ul><li style="text-align:justify;">Presentation: là lớp sẽ đảm nhiệm việc tương tác với người dùng, như là giao diện người dùng hoặc cung cấp thông tin dưới dạng Web API.</li><li style="text-align:justify;">Business: được xem như là thành phần chính trong các ứng dụng, là lớp sẽ chứa các logic nghiệp vụ, ánh xạ trực tiếp đến các nghiệp vụ thực tế mà ứng dụng cần đáp ứng.</li><li style="text-align:justify;">Persistence: là lớp truy xuất và lưu trữ dữ liệu bằng cách giao tiếp với lớp Database.</li><li style="text-align:justify;">Database: là nơi lưu trữ dữ liệu của ứng dụng, như là các cơ sở dữ liệu (SQL, No-SQL) hoặc File (Excel, CSV) ...</li></ul>Kiến trúc N-Layer có một số ưu điểm có thể kể đến đó là đơn giản, có thể tái sử dụng, kiểm thử độc lập, giúp cho lập trình viên có thể dễ tiếp cận và làm việc với các logic nghiệp vụ nhanh chóng. Vì vậy, chúng ta có thể sử dụng kiến trúc này cho các ứng dụng quy mô nhỏ hoặc thông thường.Tuy nhiên, đối với các ứng dụng quy mô lớn, tính mở rộng và phức tạp cao, thì kiến trúc sẽ hoạt động không hiệu quả. Do thiết kế phân lớp, việc thay đổi logic ở một lớp nào đó sẽ khó cập nhật lại ở các lớp khác, đồng thời cũng gây giảm hiệu suất vì các lớp không liền kề phải giao tiếp gián tiếp thông qua một lớp khác. Điều này làm cho ứng dụng sẽ ngày càng trở nên phức tạp và cồng kềnh hơn khi logic nghiệp vụ cũng nhiều hơn.<h2 style="text-align:justify;">2. Kiến trúc Onion</h2>Được giới thiệu lần đầu tiên bởi Jeffrey Palermo và năm 2008, để khắc phục các vấn đề kể trên của N-Layer, dựa trên mô hình Domain Driven, tức là xây dựng ứng dụng theo hướng tập trung vào Domain (nghiệp vụ). Từ cái tên "Onion", dịch ra là củ hành tây, ta có thể hiểu được ý đồ của mô hình này là đặt domain làm trung tâm, và bao bọc dần xung quanh bởi các lớp hệ thống khác.<figure class="image"><img src="https://api.careers.saigontechnology.com/storage/ck-editor/CKEDITOR-PLCfIJtUNLXs2P2w7dVtbBJaIFlEafSq30vXLWIj.png"></figure><h6 style="text-align:justify;">Nguồn: <a href="https://www.thoughtworks.com/insights/blog/architecture/demystify-software-architecture-patterns">Demystifying software architecture patterns</a></h6>Các lớp trong Onion được cải tiến dựa trên nguyên lý Dependency Inversion để giải quyết vấn đề phân lớp quá chặt chẽ của N-Layer. Đối với các lập trình viên .NET Core, việc cải tiến này được thể hiện thông qua Dependency Injection, được hỗ trợ sẵn, nhằm giảm tối đa sự phụ thuộc giữa các lớp, service với nhau.Thông thường, Onion sẽ có 4 lớp chính: domain model, domain services, application service và presentation. Như đã đề cập ở trên, Domain Model sẽ là lớp trung tâm của kiến trúc này. Trong đó:<ul><li style="text-align:justify;">Domain Model: là nơi tập trung các trạng thái và phương thức, hành vi nghiệp vụ của ứng dụng.</li><li style="text-align:justify;">Domain Services: là lớp kế tiếp domain model, chứa các interfaces cho việc lưu trữ dữ liệu, phương thức truy xuất, còn được gọi là Repository.</li><li style="text-align:justify;">Application Services: chứa các interfaces với các phương thức như là Thêm, xóa, sửa.. Ở các lớp services sẽ chỉ chứa các interfaces và các commons class.</li><li style="text-align:justify;">Presentation: chứa UI và tests. Lớp này cũng chứa các cài đặt của các interface ở tầng services.</li></ul>Một số ưu điểm của kiến trúc này:<ul><li style="text-align:justify;">Ít bị ràng buộc giữa các lớp với nhau</li><li style="text-align:justify;">Xây dựng tập trung vào nghiệp vụ</li><li style="text-align:justify;">Linh hoạt, dễ chuyển đổi, bổ sung và mở rộng</li><li style="text-align:justify;">Có thể đưa vào phát triển với mẫu DDD (Domain-Driven Design)</li></ul>Bên cạnh đó, một số nhược điểm dễ nhận thấy ở kiến trúc Onion này là:<ul><li style="text-align:justify;">Khó tiếp cận đối với những lập trình viên mới bắt đầu tham gia, đòi hỏi thời gian học và tìm hiểu sâu</li><li style="text-align:justify;">Phức tạp và khó áp dụng nếu ứng dụng không có nhiều nghiệp vụ</li></ul><h2 style="text-align:justify;">3. Kiến trúc Clean</h2>Kiến trúc Clean được giới thiệu bởi Uncle Bob vào năm 2012, dựa trên nguyên lý và thừa hưởng các đặc tính của kiến trúc Onion. Điểm khác biệt là kiến trúc này lấy Entities (các đối tượng nghiệp vụ) làm trung tâm.<figure class="image"><img src="https://api.careers.saigontechnology.com/storage/ck-editor/CKEDITOR-ddf3HUlqvDtDKQ9V9OIRe0gUVlbphOCyCuX7NF5U.png"></figure><h6 style="text-align:justify;">Nguồn: The Clean Code Blog by Robert C. Martin</h6>Các lớp trong kiến trúc clean sẽ được phân tách dựa trên các vai trò cụ thể:<ul><li style="text-align:justify;">Các entities sẽ là nơi chứa các logic nghiệp vụ chính (enterprise wide business), có thể là các đối tượng cùng phương thức, hành vi của nó, hoặc là tập hợp các cấu trúc dữ liệu (danh sách, node..) và các hàm. Các entities có thể được sử dụng ở nhiều nơi khác trong ứng dụng hoặc xuyên suốt quá trình xử lý nghiệp vụ. Các entities sẽ chỉ ràng buộc với chính nó.</li><li style="text-align:justify;">Bên ngoài sẽ là lớp chứa nghiệp vụ của ứng dụng - use cases (application specific business). Các thành phần trong lớp này sẽ chứa những cài đặt cho việc ứng dụng đó làm những gì (use cases). Những thay đổi ở lớp này sẽ không được tác động tới các entities, cũng như chính nó cũng sẽ không bị tác động bởi sự thay đổi của các thành phần khác (database, UI, thư viện...).</li><li style="text-align:justify;">Bao bọc các lớp nghiệp vụ sẽ là lớp thứ ba, chứa các interface adapters, dùng để khai báo interface chuyển đổi dữ liệu và thông tin được yêu câu giữa các lớp nghiệp vụ và các dịch bên ngoài, như là cơ sở dữ liệu, các frameworkss hay là API bên thứ ba.</li><li style="text-align:justify;">Lớp ngoài cùng sẽ chứa các frameworks và drivers, là các cái đặt cụ thể cho các interface adapters. Đây được xem là nơi chứa mọi chi tiết mà ở các lớp khác khai báo thông qua interfaces. Các frameworks và tools như là cơ sở dữ liệu, web framework, các thư viện bên thứ ba...</li></ul>Kiến trúc Clean vẫn đi theo nguyên lý của Onion: ràng buộc giữa các lớp nên là từ cấp thấp hơn sẽ phụ thuộc vào lớp cấp cao hơn thông qua các interfaces, có thể sử dụng Dependency Injection. Như vậy các logic xử lý chính sẽ không bị phụ thuộc vào các thay đổi đến từ lớp bên ngoài (frameworks and drivers). Ngoài ra, số lượng các lớp ở kiến trúc này cũng không cố định. Nó tùy thuộc vào ứng dụng cụ thể phức tạp ra sao, các yêu cầu nghiệp vụ như thế nào...Từ đó, ta có thể thấy một số ưu nhược điểm của kiến trúc này:<ul><li style="text-align:justify;">Ưu điểm:<ul><li style="text-align:justify;">Có thể sử dụng với mô hình microservices hay mẫu DDD</li><li style="text-align:justify;">Các lớp độc lập với nhau, các logic nghiệp vụ không bị phụ thuộc vào các lớp khác</li><li style="text-align:justify;">Dễ kiểm thử</li><li style="text-align:justify;">Dễ mở rộng, vì các lớp đã có vai trò riêng của nó</li></ul></li><li style="text-align:justify;">Nhược điểm:<ul><li style="text-align:justify;">Khó để học và hiểu các nghiệp vụ đã được chia tách thành các lớp</li><li style="text-align:justify;">Cấu trúc phức tạp vì cần phải triển khai qua nhiều lớp</li><li style="text-align:justify;">Do các lớp không phụ thuộc nhau nên sẽ khá trừu tượng</li></ul></li></ul><h2 style="text-align:justify;">4. Vậy kiến trúc Onion và Clean có giống nhau?</h2>Tuy kiến trúc Clean ra đời có nhiều ảnh hưởng từ Onion, giữa 2 kiến trúc vẫn có những điểm giống và khác nhau.Cả hai kiến trúc đều hướng tới việc chia ứng dụng thành nhiều lớp xử lý với các vai trò khác nhau, giúp cho việc xây dựng và triển khai dự án dễ dàng hơn. Cả hai kiến trúc đều áp dụng nguyên lý Dependency Inversion giữa các lớp, giúp cho sự ràng buộc giữa các lớp giảm bớt, các lớp cấp thấp hơn sẽ phụ thuộc lớp cấp cao hơn thông qua abstractions chứ không phải là trực tiếp. Ngoài ra các ứng dụng xây dựng trên 2 kiến trúc này sẽ có khả năng mở rộng cao và có thể được kiểm thử độc lập cho từng lớp.Những điiểm khác nhau giữa hai kiến trúc:<ul><li style="text-align:justify;">Kiến trúc Onion<ul><li style="text-align:justify;">Tập trung vào xử lý nghiệp vụ và đưa nó vào trung tâm</li><li style="text-align:justify;">Các lớp được chia theo vai trò chung (domain, repositories, services..), chủ yếu để phục vụ cho lớp domain trung tâm</li><li style="text-align:justify;">Các xử lý liên quan đến kỹ thuật, công nghệ được đưa các xử lý ra các lớp bên ngoài</li></ul></li><li style="text-align:justify;">Kiến trúc Clean:<ul><li style="text-align:justify;">Chia việc xử lý nghiệp vụ thành 2 lớp: enitities (enterprise wide business) và use cases (application specific business)</li><li style="text-align:justify;">Các lớp được chia theo vai trò cụ thể (entities, interface adapters, frameworks and drivers..)</li><li style="text-align:justify;">Sử dụng dependency inversion để phân tách các xử lý rồi mới đưa ra bên ngoài</li></ul></li></ul><h2 style="text-align:justify;">5. Vậy ta nên sử dụng kiến trúc nào?</h2>Các ứng dụng khác nhau sẽ có khối nghiệp vụ và độ phức tạp khác nhau. Cho nên, tùy vào mỗi ứng dụng và các yêu cầu chức năng của nó mà ta sẽ chọn kiến trúc cho phù hợp.Một số gợi ý khi chọn kiến trúc Onion:<ul><li style="text-align:justify;">Thường dành cho mô hình nghiệp vụ của ứng dụng tương đối phức tạp, yêu cầu khá nhiều về tính nhất quán cũng như nhiều tính toán chặt chẽ.</li><li style="text-align:justify;">Các công nghệ, thư viện sử dụng ở các lớp services có thể linh động</li></ul>Chúng ta sẽ cân nhắc chọn kiến trúc Clean khi:<ul><li style="text-align:justify;">Mô hình nghiệp vụ không quá phức tạp, có thể chứa trong các đối tượng truyền dữ liệu cùng các hành vi và phương thức</li><li style="text-align:justify;">Các công nghệ, thư viên sử dụng ở các lớp services có tính phổ biến, cung cấp nhiều tính năng cho hệ thống</li></ul><h2 style="text-align:justify;">6. Kết luận</h2>Onion và Clean đều là những kiến trúc rất hay, hướng ứng dụng tới việc xử lý những khía cạnh của nghiệp vụ, đưa các thư viện, dịch vụ khác ra các lớp bên ngoài. Những ứng dụng này sẽ có khả năng linh động cao, mở rộng tốt, và có tính bảo trì. Có thể nói, 2 kiến trúc này có thể sử dụng để xây dựng bất kỳ loại ứng dụng nào. Và các lập trình viên sẽ cần phải lựa chọn loại kiến trúc phù hợp với nhu cầu, sự phát triển của dự án, ứng dụng.Tài liệu tham khảo<ol><li style="text-align:justify;"><a href="https://www.oreilly.com/library/view/software-architecture-patterns/9781491971437/?_gl=1*7a1tjd*_ga*NzE5NTM3ODY4LjE2NzkzODcyOTk.*_ga_092EL089CH*MTY3OTYzMDAzNy42LjEuMTY3OTYzMDA1NS40Mi4wLjA.">Software Architecture Patterns by Mark Richards</a></li><li style="text-align:justify;"><a href="https://www.oreilly.com/library/view/clean-architecture-a/9780134494272/">Clean Architecture: A Craftsman’s Guide to Software Structure and Design</a></li><li style="text-align:justify;"><a href="https://blog.cleancoder.com/uncle-bob/2012/08/13/the-clean-architecture.html">The Clean code blog - Clean Architecture (Uncle Bob)</a></li><li style="text-align:justify;"><a href="https://jeffreypalermo.com/2008/07/the-onion-architecture-part-1/">The Onion Architecture - Jeffrey Palermo</a></li></ol></body></html>

Mô hình kiến trúc N-layer đã khá phổ biến trong phát triển phần mềm, nhưng nó vẫn có khá nhiều điểm yếu. Từ đó, nhiều kiến trúc khác đã ra đời để giúp việc phát triển được tốt hơn. Trong bài viết này, chúng ta sẽ tìm hiểu 2 mô hình được sử dụng rộng rãi là Onion và Clean.

&lt;html&gt;&lt;body&gt;&lt;h2&gt;1. Design Patterns l&agrave; g&igrave; nhỉ?&nbsp;&lt;/h2&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Tổng quan th&igrave; Design Patterns như một c&ocirc;ng thức để ta c&oacute; thể &aacute;p dụng v&agrave;o giải quyết một số vấn đề cụ thể trong lập tr&igrave;nh, cụ thể l&agrave; Lập tr&igrave;nh hướng đối tượng (OOP). N&oacute; l&agrave; những giải ph&aacute;p đ&atilde; được đ&uacute;c kết v&agrave; tối ưu h&oacute;a cho c&aacute;c trường hợp cụ thể. Thay v&igrave; phải t&igrave;m c&aacute;ch tối ưu h&oacute;a, tổ chức code lại từ đầu, th&igrave; bạn đơn giản c&oacute; thể &aacute;p dụng c&aacute;c Design Patterns ph&ugrave; hợp v&agrave; đ&atilde; được tối ưu cho trường hợp bạn gặp phải. Từ định nghĩa đ&oacute; ta c&oacute; thể thấy được một số t&igrave;nh huống m&agrave; Design Patterns c&oacute; thể ph&aacute;t huy sức mạnh tối đa của n&oacute;:&lt;/p&gt;&lt;ul&gt;&lt;li style=&quot;text-align:justify;&quot;&gt;Bạn gặp một t&igrave;nh huống phức tạp khi lập tr&igrave;nh. Đừng lo, khả năng cao đ&atilde; c&oacute; một (hoặc c&oacute; thể l&agrave; một v&agrave;i) Design Patterns c&oacute; thể giải quyết vấn đề của bạn thật đơn giản v&agrave; gọn g&agrave;ng. Chỉ cần &aacute;p dụng theo l&agrave; xong.&lt;/li&gt;&lt;li style=&quot;text-align:justify;&quot;&gt;Bạn trao đổi với c&aacute;c developer kh&aacute;c trong team về c&aacute;ch tổ chức source code của một hệ thống kh&aacute; lớn v&agrave; phức tạp. Bạn (v&agrave; team của bạn) cảm thấy kh&oacute; khăn khi tr&igrave;nh b&agrave;y &yacute; tưởng của m&igrave;nh. H&atilde;y sử dụng Design Patterns như một ng&ocirc;n ngữ chung để n&oacute;i về những &yacute; tưởng phức tạp một c&aacute;ch đơn giản. (Giả sử thay v&igrave; n&oacute;i rằng &ldquo;Ta c&oacute; thể tạo một Abstract Class để tập trung c&aacute;c xử l&yacute; tạo c&aacute;c Instance của class Hotel để dễ d&agrave;ng che giấu việc khai b&aacute;o c&aacute;c Instance con li&ecirc;n quan đến Hotel đồng thời c&oacute; thể dễ d&agrave;ng tạo nhiều Instance của Hotel mootj c&aacute;ch dễ d&agrave;ng v&agrave; tường minh&rdquo; th&igrave; ta c&oacute; thể n&oacute;i l&agrave; &ldquo;Ta c&oacute; thể &aacute;p dụng Abstract Factory Design Patterns cho class Hotel&rdquo; thế th&ocirc;i!)&lt;/li&gt;&lt;/ul&gt;&lt;h2&gt;2. Những điểm mạnh của Design Patterns&lt;/h2&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Việc nắm bắt v&agrave; &aacute;p dụng Design Patterns v&agrave;o trong c&ocirc;ng việc của một Developer thực sự sẽ gi&uacute;p ta c&oacute; một bước ph&aacute;t triển ho&agrave;n to&agrave;n mới về cả tư duy lẫn kỹ năng lập tr&igrave;nh. Bạn c&oacute; thể thấy r&otilde; điều đ&oacute; qua những điểm mạnh của n&oacute; sau đ&acirc;y:&nbsp;&lt;/p&gt;&lt;ul&gt;&lt;li style=&quot;text-align:justify;&quot;&gt;Gi&uacute;p bạn tăng tốc độ ph&aacute;t triển c&aacute;c ứng dụng.&nbsp;&lt;/li&gt;&lt;li style=&quot;text-align:justify;&quot;&gt;Cải thiện code structure, dễ d&agrave;ng n&acirc;ng cấp v&agrave; sửa đổi.&lt;/li&gt;&lt;li style=&quot;text-align:justify;&quot;&gt;Tăng khả năng code reusability.&lt;/li&gt;&lt;li style=&quot;text-align:justify;&quot;&gt;Tăng t&iacute;nh readable đối với những cấu tr&uacute;c code phức tạp. Tăng khả năng communicate giữa c&aacute;c th&agrave;nh vi&ecirc;n trong team (Nếu mọi người đều biết về Design Patterns)&lt;/li&gt;&lt;li style=&quot;text-align:justify;&quot;&gt;Do c&aacute;c Design Patterns đ&atilde; được tối ưu n&ecirc;n ta cũng c&oacute; thể tr&aacute;nh được những lỗi kh&ocirc;ng mong muốn ph&aacute;t sinh trong qu&aacute; tr&igrave;nh Implementation.&lt;/li&gt;&lt;/ul&gt;&lt;h2&gt;3. Những hạn chế của Design Patterns&lt;/h2&gt;&lt;ul&gt;&lt;li style=&quot;text-align:justify;&quot;&gt;Design Patterns kh&ocirc;ng phải l&agrave; ch&igrave;a kh&oacute;a vạn năng, n&oacute; chỉ c&oacute; thể giải quyết được một số những vấn đề nhất định. Nếu ta sử &aacute;p dụng Design Patterns v&agrave;o những trường hợp kh&ocirc;ng ph&ugrave; hợp c&oacute; thể l&agrave;m code trở n&ecirc;n rối v&agrave; phức tạp hơn.&lt;/li&gt;&lt;li style=&quot;text-align:justify;&quot;&gt;Design Patterns chỉ l&agrave;m cho code dễ đọc dễ hiểu với những người c&oacute; kinh nghiệm về Design Patterns đang được &aacute;p dụng. Tuy nhi&ecirc;n đối với những người mới c&oacute; thể sẽ gặp kh&oacute; khăn trong việc nắm bắt cấu tr&uacute;c v&agrave; kh&oacute; khăn trong việc debug.&lt;/li&gt;&lt;li style=&quot;text-align:justify;&quot;&gt;Bản th&acirc;n từng Design Patterns cũng c&oacute; những khuyết điểm của ri&ecirc;ng n&oacute; (ta sẽ khảo s&aacute;t cụ thể khi đi v&agrave;o chi tiết từng Pattern). N&ecirc;n khi &aacute;p dụng Design Patterns n&agrave;o ta lu&ocirc;n phải c&acirc;n nhắc kỹ lưỡng những lợi &iacute;ch v&agrave; khuyết điểm của n&oacute; để đưa ra quyết định c&oacute; n&ecirc;n sử dụng hay kh&ocirc;ng.&lt;/li&gt;&lt;/ul&gt;&lt;h2&gt;4. Ph&acirc;n loại c&aacute;c Design Patterns:&lt;/h2&gt;&lt;ul&gt;&lt;li style=&quot;text-align:justify;&quot;&gt;Nh&oacute;m Creational: Nh&oacute;m Creational l&agrave; nh&oacute;m những Design Patterns tập trung c&aacute;c giải ph&aacute;p khởi tạo đối tượng v&agrave; che giấu logic khởi tạo những đối tượng:&lt;ul&gt;&lt;li style=&quot;text-align:justify;&quot;&gt;&lt;i&gt;Nh&oacute;m Creational bao gồm: Factory Method,&nbsp;Abstract Factory, Builder, Prototype, Singleton&lt;/i&gt;&lt;/li&gt;&lt;/ul&gt;&lt;/li&gt;&lt;li style=&quot;text-align:justify;&quot;&gt;Nh&oacute;m Structural: Nh&oacute;m Structural l&agrave; nh&oacute;m những Design Patterns tập trung v&agrave;o việc tối ưu c&aacute;c thiết kế của class v&agrave; sự kết hợp c&aacute;c class v&agrave; object trở lại một cấu tr&uacute;c lớn hơn.&lt;ul&gt;&lt;li style=&quot;text-align:justify;&quot;&gt;&lt;i&gt;Nh&oacute;m Structural bao&nbsp;gồm:&nbsp;Adapter, Bridge, Composite, Decorator, Facade, Flyweight v&agrave;&nbsp;Proxy&lt;/i&gt;&lt;/li&gt;&lt;/ul&gt;&lt;/li&gt;&lt;li style=&quot;text-align:justify;&quot;&gt;Nh&oacute;m Behavioral: Nh&oacute;m Behaviour l&agrave; nh&oacute;m những Design Patterns tập trung sự ph&acirc;n chia tr&aacute;ch nhiệm của c&aacute;c class v&agrave; object để phục vụ một mục đ&iacute;ch cụ thể. Nh&oacute;m n&agrave;y tập trung nhiều hơn v&agrave;o mối quan hệ giữa c&aacute;c class v&agrave; object với nhau.&lt;ul&gt;&lt;li style=&quot;text-align:justify;&quot;&gt;&lt;i&gt;Nh&oacute;m Behavioral bao gồm:&nbsp;Interpreter, Template Method, Chain of Responsibility, Command, Iterator, Mediator, Memento, Observer, State, Strategy v&agrave; Visitor&lt;/i&gt;&nbsp;&lt;/li&gt;&lt;/ul&gt;&lt;/li&gt;&lt;/ul&gt;&lt;h2&gt;5. Cần chuẩn bị những g&igrave; trước khi t&igrave;m hiểu về Design Patterns?&lt;/h2&gt;&lt;ul&gt;&lt;li style=&quot;text-align:justify;&quot;&gt;OOP: Tất nhi&ecirc;n rồi, bạn phải nắm t&iacute;nh vũng tư duy lập tr&igrave;nh theo hướng đối tượng đ&atilde;. C&aacute;c Design Patterns đơn giản l&agrave; gi&uacute;p bạn triển khai c&aacute;c t&iacute;nh chất của OOP dễ d&agrave;ng v&agrave; linh hoạt hơn m&agrave; th&ocirc;i.&lt;/li&gt;&lt;li style=&quot;text-align:justify;&quot;&gt;C&aacute;ch đọc sơ đồ UML:&nbsp; C&aacute;c Design Pattern thường được thể hiện dưới dạng UML diagram, việc đọc hiểu một số concept UML cơ bản l&agrave; cần thiết để bắt đầu học Design Patterns&nbsp;&lt;/li&gt;&lt;li style=&quot;text-align:justify;&quot;&gt;C&aacute;c bạn c&oacute; thể tham khảo tại đ&acirc;y:&nbsp;&lt;a href=&quot;https://www.guru99.com/uml-diagrams.html&quot;&gt;&lt;i&gt;&lt;u&gt;https://www.guru99.com/uml-diagrams.html&lt;/u&gt;&lt;/i&gt;&lt;/a&gt;&lt;/li&gt;&lt;li style=&quot;text-align:justify;&quot;&gt;Dưới đ&acirc;y l&agrave; 1 số concept UML cơ bản m&igrave;nh sẽ sử dụng trong loạt b&agrave;i viết n&agrave;y:&nbsp;&lt;/li&gt;&lt;/ul&gt;&lt;p&gt;&nbsp;&lt;/p&gt;&lt;p&gt;&lt;img src=&quot;https://api.careers.saigontechnology.com/storage/ck-editor/CKEDITOR-Cn1yI9X33XdJ5N3xgCYsyzvq0ix1YjSsqI6bTqLf.png&quot; alt=&quot;A picture containing diagram
        Description automatically generated&quot;&gt;&lt;/p&gt;&lt;p&gt;&lt;img src=&quot;https://api.careers.saigontechnology.com/storage/ck-editor/CKEDITOR-CpD296nUoYXW0lMySCd5csSytIINBYEQV7eQ1CdD.png&quot; alt=&quot;Diagram
        Description automatically generated&quot;&gt;&lt;/p&gt;&lt;p&gt;&nbsp;&lt;/p&gt;&lt;ul&gt;&lt;li&gt;Ngo&agrave;i ra hiểu được 2 quy tắc thiết kế &ldquo;&lt;i&gt;program to interfaces, not implementations&rdquo;&nbsp;&lt;/i&gt;v&agrave; &ldquo;&lt;i&gt;favor composition over inheritance&rdquo;&nbsp;&lt;/i&gt;cũng kh&aacute; quan trọng. Hầu hết c&aacute;c Design Patterns đề được thiết kế dựa tr&ecirc;n 2 quy tắc n&agrave;y.&lt;/li&gt;&lt;/ul&gt;&lt;h2&gt;6. Lời Kết&lt;/h2&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;T&oacute;m lại th&igrave;: Design Patterns l&agrave; những mẫu thiết kế để giải quyết những vấn đề phổ biến hay gặp phải trong lập tr&igrave;nh, đ&atilde; được chấp nhận v&agrave; sử dụng rộng r&atilde;i của nhiều lập tr&igrave;nh vi&ecirc;n c&oacute; kinh nghiệm.&lt;/p&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&Aacute;p dụng Design Patterns gi&uacute;p bạn cải thiện đ&aacute;ng kể tốc độ ph&aacute;t triển ứng dụng v&agrave; dễ d&agrave;ng hơn trong việc bảo tr&igrave;, sửa chữa.&lt;/p&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Tuy nhi&ecirc;n, bạn cũng cần phải c&acirc;n nhắc kỹ lưỡng t&iacute;nh chất của b&agrave;i to&aacute;n cần giải quyết, quy m&ocirc; dự &aacute;n đang triển khai cũng như những th&agrave;nh vi&ecirc;n trong team của bạn trước khi cố gắng &aacute;p dụng bất k&igrave; Design Patterns n&agrave;o v&agrave;o code của dự &aacute;n.&lt;/p&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Cuối c&ugrave;ng, Design Patterns sinh ra nhằm mục đ&iacute;ch đơn giản h&oacute;a qu&aacute; tr&igrave;nh ph&aacute;t triển ứng dụng, chứ kh&ocirc;ng phải l&agrave;m cho n&oacute; phức tạp l&ecirc;n. Nhớ điều n&agrave;y nh&eacute;!&lt;/p&gt;&lt;p&gt;&nbsp;&lt;/p&gt;&lt;p&gt;&lt;strong&gt;References:&nbsp;&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;&lt;a href=&quot;https://refactoring.guru/design-patterns&quot;&gt;&lt;u&gt;Design Patterns&lt;/u&gt;&lt;/a&gt;&lt;/p&gt;&lt;p&gt;&lt;a href=&quot;https://www.digitalocean.com/community/tutorials/gangs-of-four-gof-design-patterns&quot;&gt;&lt;u&gt;Gangs of Four (GoF) Design Patterns | DigitalOcean&lt;/u&gt;&lt;/a&gt;&lt;/p&gt;&lt;p&gt;Books:&nbsp;&lt;a href=&quot;https://books.google.com.vn/books/about/Head_First_Design_Patterns.html?id=GGpXN9SMELMC&amp;amp;redir_esc=y&quot;&gt;&lt;u&gt;Head First Design Patterns&lt;/u&gt;&lt;/a&gt;&lt;/p&gt;&lt;/body&gt;&lt;/html&gt;

Design Patterns là một trong những công cụ hữu hiệu nhất để giải quyết các bài toán bạn gặp phải trong khi lập trình. Trong bài viết này mình sẽ chia sẻ cho các bạn khái niệm tổng quan về Design Patterns. Ở những bài viết sau ta sẽ đi sâu vào từng Design Patterns để có thể hiểu sâu hơn về nó.

Giới thiệu tổng quan về Design Patterns

So sánh Onion Architecture và Clean Architecture

Bài viết này mình tập trung chủ yếu vào các nguyên lý của SOLID.  Nhằm hướng dẫn cho anh em lập trình viên nhà mình có một cái nhìn tổng quan về SOLID chẳng hạn như: SOLID là gì? Lợi hại của SOLID? Hy vọng có thể support được mọi người có thêm kiến thức về các nguyên lý thiết kế code.

[Design Pattern] Bài 01: SOLID Trong Thiết Kế Hướng Đối Tượng

Bài viết nằm trong chuỗi bài về design pattern. Mở đầu của serie này là một design pattern khá quen thuộc và thân thương đó chính là Singleton. Vậy Singleton là gì, làm sao để implement một Singleton...
Qua bài viết hy vọng có thể support được mọi người có thêm kiến thức về Singleton.
OK Let’s Go.

[Design Pattern] Bài 03: Sử Dụng Singleton Trong Java

Bài viết nằm trong chuỗi bài về design pattern. Là phần tiếp theo của series design pattern, Factory một design pattern cực kỳ hữu dụng trong việc tạo ra object. Vậy Factory là gì, làm sao để implement một Factory. Qua bài viết hy vọng có thể support được mọi người có thêm kiến thức về Factory.

[Design Pattern] Bài 04: Sử Dụng Factory Trong Java

Bài viết nằm trong chuỗi bài về design pattern. Là phần tiếp theo của Creational pattern, Builder một design pattern cực kỳ hữu dụng trong việc tạo ra object. Vậy Builder là gì, làm sao để implement một Builder. Qua bài viết hy vọng có thể support được mọi người có thêm kiến thức về Builder.

[Design Pattern] Bài 05: Sử Dụng Builder Trong Java

&lt;html&gt;&lt;body&gt;&lt;h2&gt;&lt;span style=&quot;color:hsl(0,0%,0%);&quot;&gt;&lt;strong&gt;1. Prototype Design Pattern L&agrave; G&igrave;&lt;/strong&gt;&lt;/span&gt;&lt;/h2&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;Để đi v&agrave;o chi tiết c&aacute;c thức hoạt động cũng như t&iacute;nh chất của&nbsp;&lt;strong&gt;Prototype&lt;/strong&gt; pattern m&igrave;nh xin ph&eacute;p lấy một v&iacute; dụ về việc tạo ra c&aacute;c loại thẻ ng&acirc;n h&agrave;ng.&lt;/p&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;X&atilde; hội ng&agrave;y c&agrave;ng ph&aacute;t triển v&agrave; việc kh&ocirc;ng d&ugrave;ng tiền mặt ở c&aacute;c đ&ocirc; thị lớn đang l&agrave; xu thế. Gần như mọi người đều c&oacute; ri&ecirc;ng cho m&igrave;nh &iacute;t nhất một t&agrave;i khoản ng&acirc;n h&agrave;ng. B&ecirc;n cạnh đ&oacute; c&aacute;c c&ocirc;ng việc giao dịch về tiền tệ đều được thực hiện dễ d&agrave;ng th&ocirc;ng qua thẻ ATM.&lt;/p&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;C&oacute; rất nhiều loại thẻ ATM như Master, Visa&hellip;B&ecirc;n cạnh đ&oacute;, mỗi ng&acirc;n h&agrave;ng c&ograve;n ph&aacute;t h&agrave;nh h&agrave;ng loạt c&aacute;c loại thẻ kh&aacute;c nhau cho từng nh&oacute;m kh&aacute;ch h&agrave;ng như thẻ VIP, thẻ CashBack... Về mặt physical th&igrave; c&aacute;c thẻ ATM n&agrave;y c&ugrave;ng chất liệu, c&ugrave;ng k&iacute;ch thước, c&ugrave;ng h&igrave;nh dạng v&agrave; chứa nhiều th&ocirc;ng tin chung, dĩ nhi&ecirc;n mỗi loại thẻ vẫn c&oacute; nhiều th&ocirc;ng tin kh&aacute;c biệt như m&agrave;u sắc, background số CVV&hellip;v&acirc;ng v&acirc;ng v&agrave; m&acirc;y m&acirc;y.&lt;/p&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;Một topic nho nhỏ cho anh em dev l&agrave; l&agrave;m thế n&agrave;o c&oacute; thể tạo ra được những loại thẻ ATM một c&aacute;ch tiện lợi m&agrave; kh&ocirc;ng mất qu&aacute; nhiều effort. C&oacute; rất nhiều giải ph&aacute;p, một trong những giải ph&aacute;p m&igrave;nh c&oacute; thể consider đ&oacute; l&agrave;&nbsp;&lt;strong&gt;Builder&lt;/strong&gt; pattern. Tuy nhi&ecirc;n, với việc tạo ra một object c&oacute; nhiều tham số v&agrave; logic phức tạp (parameters) th&igrave; c&oacute; vẻ&nbsp;&lt;strong&gt;Builder&lt;/strong&gt; kh&ocirc;ng phải l&agrave; sự lựa chọn hợp l&yacute;. Với m&igrave;nh, c&aacute;i g&igrave; l&agrave;m nhiều th&igrave; m&igrave;nh chọn giải ph&aacute;p l&agrave; sao ch&eacute;p thay v&igrave; m&igrave;nh phải l&agrave;m bằng &ldquo;cơm&rdquo;.&lt;/p&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;Do đ&oacute;,&nbsp; m&igrave;nh tận dụng một trong những skill-set đỉnh ch&oacute;p của anh em lập tr&igrave;nh đ&oacute; l&agrave; copy-paste v&agrave;&nbsp;&lt;strong&gt;Prototype&lt;/strong&gt; sẽ gi&uacute;p m&igrave;nh ph&aacute;t huy tối đa c&ocirc;ng dụng của việc tạo object bằng việc&nbsp;&lt;strong&gt;clone&lt;/strong&gt; từ một mẫu c&oacute; sẵn. V&agrave; sau đ&oacute; m&igrave;nh c&oacute; thể modify theo c&aacute;ch m&igrave;nh mong muốn dựa tr&ecirc;n từng context cụ thể.&lt;/p&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;Đến đ&acirc;y, m&igrave;nh tin anh em cũng đ&atilde; hiểu mục đ&iacute;ch sử dụng của pattern n&agrave;y rồi. Tiếp theo m&igrave;nh sẽ giới thiệu với anh em về c&aacute;ch thiết kế cũng như c&aacute;ch để implement pattern n&agrave;y.&nbsp;&nbsp;&lt;br&gt;Đầu ti&ecirc;n m&igrave;nh c&ugrave;ng nhau tham khảo qua class diagram của&nbsp;&lt;strong&gt;Prototype&lt;/strong&gt; để c&oacute; c&aacute;i nh&igrave;n tổng quan về em n&oacute;.&lt;/p&gt;&lt;h2&gt;&lt;span style=&quot;color:hsl(0,0%,0%);&quot;&gt;&lt;strong&gt;2. Prototype Design Pattern Diagram&lt;/strong&gt;&lt;/span&gt;&lt;/h2&gt;&lt;figure class=&quot;image&quot;&gt;&lt;img src=&quot;https://api.careers.saigontechnology.com/storage/ck-editor/prototype-design-pattern-1-3UWckMfOTe6LSnFefvA7g8cug7j5agBbvYU2xZAl.webp&quot;&gt;&lt;/figure&gt;&lt;p&gt;Trong lược đồ ph&iacute;a tr&ecirc;n, th&agrave;nh phần ch&iacute;nh l&agrave; ba class:&nbsp;&lt;strong&gt;Client, Prototype v&agrave; SubPrototype&lt;/strong&gt;&lt;/p&gt;&lt;p&gt;&lt;strong&gt;Class Client&lt;/strong&gt;: Đại diện cho class sử dụng&nbsp;&lt;strong&gt;Prototype&lt;/strong&gt; object để clone ra c&aacute;c SubPrototype&lt;/p&gt;&lt;p&gt;&lt;strong&gt;Class Prototype&lt;/strong&gt;: Interface/Abstract class chứa abstract clone() method&lt;/p&gt;&lt;p&gt;&lt;strong&gt;Class Sub-Prototype&lt;/strong&gt;: Đại diện cho c&aacute;c class con m&agrave; ch&uacute;ng m&igrave;nh sẽ implement clone() ở c&aacute;c sub-class n&agrave;y.&lt;/p&gt;&lt;h2&gt;&lt;span style=&quot;color:hsl(0,0%,0%);&quot;&gt;&lt;strong&gt;3. Prototype Pattern Implementation&lt;/strong&gt;&lt;/span&gt;&lt;/h2&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;Anh em m&igrave;nh đ&atilde; xem qua class diagram. Giờ m&igrave;nh c&ugrave;ng&nbsp; nhau đi chi tiết về c&aacute;ch implement pattern n&agrave;y th&ocirc;ng qua b&agrave;i to&aacute;n tạo ra c&aacute;c loại bank card.&lt;/p&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;Context l&agrave; m&igrave;nh sẽ sử dụng class&nbsp;&lt;strong&gt;BankCard&lt;/strong&gt; để tạo ra c&aacute;c loại card như&nbsp;&lt;strong&gt;PlatinumCard&lt;/strong&gt; v&agrave;&nbsp;&lt;strong&gt;DiamondCard&lt;/strong&gt; hai loại thẻ d&agrave;nh cho hai tập kh&aacute;ch h&agrave;ng của một ng&acirc;n h&agrave;ng, bằng c&aacute;ch sử dụng&nbsp;&lt;strong&gt;Prototype&lt;/strong&gt; pattern.&lt;/p&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;Đầu ti&ecirc;n m&igrave;nh tạo ra một class&nbsp;&lt;strong&gt;BankCard&lt;/strong&gt;, class n&agrave;y đại diện cho c&aacute;c loại&nbsp;&lt;strong&gt;BankCard&lt;/strong&gt; (Visa, Master&hellip;). Class n&agrave;y chứa c&aacute;c thuộc t&iacute;nh th&ocirc;ng dụng như: CardNumber, HolderName, CardType&hellip; Tuy nhi&ecirc;n, giả thuyết l&agrave; để tạo ra một object của&nbsp;&lt;strong&gt;BankCard&lt;/strong&gt; th&ocirc;ng qua constructor() th&igrave; cần điền th&ocirc;ng tin cho rất nhiều field, việc n&agrave;y l&agrave;m tăng effort một c&aacute;ch đ&aacute;ng kể cho cả lập tr&igrave;nh vi&ecirc;n v&agrave; hệ thống. Do đ&oacute; m&igrave;nh sẽ thay thế bằng phương ph&aacute;p sử dụng cơ chế clone của&nbsp;Cloneable interface.&lt;/p&gt;&lt;p&gt;Chi tiết của class&nbsp;&lt;strong&gt;BankCard&lt;/strong&gt; như sau:&lt;/p&gt;&lt;pre&gt;&lt;code class=&quot;language-plaintext&quot;&gt; public class BankCard implements Cloneable{

    public String cardNumber;
    public String holderName;
    public String cardType;
    public BigDecimal amount;

    public BankCard(String cardType){
        this.cardType = cardType;
    }

    @Override
    protected BankCard clone() {
        try {
            return (BankCard) super.clone();
        } catch (CloneNotSupportedException e) {
            e.printStackTrace();
        }
        return null;
    }

    @Override
    public String toString() {
        return &quot;BankCard [cardNumber=&quot; + cardNumber + &quot;,
 holderName=&quot; + holderName + &quot;,
 cardType=&quot;+ cardType + &quot;, amount=&quot;+amount+&quot; ]&quot;;
    }

// Getters and Setters
}

&lt;/code&gt;&lt;/pre&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;Theo như class diagram, m&igrave;nh cần tạo ra class&nbsp;CardClient,&nbsp;class n&agrave;y sẽ&nbsp;sử dụng&nbsp;&lt;strong&gt;Prototype&lt;/strong&gt;&nbsp;để tạo ra nhiều loại thẻ cho c&ugrave;ng một customer bằng c&aacute;ch sử dụng&nbsp;clone() method của class&nbsp;BankCard.&lt;/p&gt;&lt;pre&gt;&lt;code class=&quot;language-plaintext&quot;&gt; public class CardClient{

    public static void main(String[] args){
        BankCard platinumCard = new BankCard(&quot;master&quot;);
        platinumCard.setHolderName(&quot;Tom&quot;);
        platinumCard.setCardNumber(&quot;1234&quot;);

        BankCard diamondCard = masterCard.clone();
        diamondCard.setCardType(&quot;visa&quot;);

        System.out.println(platinumCard);
        System.out.println(diamondCard);
    }
}
&lt;/code&gt;&lt;/pre&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;Implementation của Prototype cũng rất đơn giản, kh&ocirc;ng qu&aacute; cầu k&igrave;, phức tạp. Đến đ&acirc;y, m&igrave;nh nghĩ sẽ c&oacute; một v&agrave;i question được đặt ra như sau.&lt;/p&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;C&acirc;u hỏi đầu ti&ecirc;n, đ&oacute; l&agrave; nếu m&igrave;nh update một attribute n&agrave;o đ&oacute; của&nbsp;&lt;strong&gt;platinumCard&lt;/strong&gt; th&igrave; attribute tương ứng của&nbsp;&lt;strong&gt;diamondCard&lt;/strong&gt; c&oacute; bị thay đổi gi&aacute; trị hay kh&ocirc;ng? Bởi v&igrave;&nbsp;&lt;strong&gt;diamondCard&lt;/strong&gt; được tạo ra bằng c&aacute;ch&nbsp;copy th&ocirc;ng tin từ&nbsp;&lt;strong&gt;platinumCard.&lt;/strong&gt;&lt;/p&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;Good question. Dĩ nhi&ecirc;n c&acirc;u trả lời trong trường hợp n&agrave;y l&agrave; &ldquo;&lt;strong&gt;Kh&ocirc;ng&lt;/strong&gt;&rdquo; v&igrave; bản chất của h&agrave;m clone() l&agrave; deep copy, n&ecirc;n việc modify một newly object sẽ kh&ocirc;ng l&agrave;m ảnh hưởng đến original object.&lt;/p&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;C&acirc;u hỏi số hai, điểm kh&aacute;c nhau trong việc sử dụng phương thức clone() v&agrave; to&aacute;n tử dấu&nbsp;&ldquo;=&rdquo;.&lt;/p&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;span style=&quot;color:hsl(0,75%,60%);&quot;&gt;&nbsp;BankCard diamondCard = platinumCard.clone() vs&nbsp;&nbsp;BankCard diamondCard = platinumCard;&lt;/span&gt;&lt;/p&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;Khi ch&uacute;ng ta sử dụng to&aacute;n tử&nbsp; dấu&nbsp;&ldquo;=&rdquo; đều n&agrave;y c&oacute; nghĩa l&agrave; object&nbsp;&lt;strong&gt;diamondCard&lt;/strong&gt; tham chiếu đến object&nbsp;&lt;strong&gt;platinumCard&lt;/strong&gt;, nếu&nbsp;&lt;strong&gt;platinumCard&lt;/strong&gt; thay đổi th&ocirc;ng tin điều n&agrave;y dẫn đến&nbsp;&lt;strong&gt;diamondCard&lt;/strong&gt; cũng thay đổi th&ocirc;ng tin theo&nbsp;(shallow copy)&lt;/p&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;M&igrave;nh cũng sẽ c&oacute; một b&agrave;i viết về hai phương ph&aacute;p&nbsp;&lt;strong&gt;Deep-Copy&lt;/strong&gt; v&agrave;&nbsp;&lt;strong&gt;Shallow-Copy&lt;/strong&gt; để giải th&iacute;ch cụ thể sự kh&aacute;ch biệt của hai loại copy n&agrave;y với mọi người.&lt;/p&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;Đến đ&acirc;y th&igrave; anh em m&igrave;nh cũng đ&atilde; t&igrave;m hiểu về c&ocirc;ng năng cũng như implementation của&nbsp;&lt;strong&gt;Prototype&lt;/strong&gt; rồi. M&igrave;nh cũng đ&atilde; apply pattern n&agrave;y cho nhiều dự &aacute;n n&ecirc;n tiếp theo, m&igrave;nh sẽ liệt k&ecirc; ra pros v&agrave; cons của pattern n&agrave;y dựa tr&ecirc;n kinh nghiệm thực chiến của m&igrave;nh.&lt;/p&gt;&lt;h2&gt;&lt;span style=&quot;color:hsl(0,0%,0%);&quot;&gt;&lt;strong&gt;4. The Pros and Cons of Prototype Design Pattern&lt;/strong&gt;&lt;/span&gt;&lt;/h2&gt;&lt;h3&gt;&lt;span style=&quot;color:hsl(0,0%,0%);&quot;&gt;&lt;strong&gt;The Pros of Prototype&lt;/strong&gt;&lt;/span&gt;&lt;/h3&gt;&lt;p&gt;Một trong những điểm mạnh nổi bật nhất của&nbsp;&lt;strong&gt;Prototype&nbsp;&lt;/strong&gt;m&agrave; bất kỳ lập tr&igrave;nh vi&ecirc;n n&agrave;o cũng c&oacute; thể nhận ra đ&oacute; ch&iacute;nh l&agrave; việc tạo ra c&aacute;c object mới dựa tr&ecirc;n một object đ&atilde; tồn tại sẵn một c&aacute;ch tiện lợi. Điều n&agrave;y gi&uacute;p giảm đi rất nhiều effort cho anh em coder cũng như đem lại performance xịn hơn cho hệ thống.&lt;/p&gt;&lt;p&gt;Prototype rất hữu &iacute;ch khi bạn muốn tạo ra c&aacute;c object c&oacute; logic phức tạp, b&ecirc;n cạnh đ&oacute; pattern n&agrave;y c&ograve;n gi&uacute;p m&igrave;nh hạn chế được việc phải tạo th&ecirc;m c&aacute;c class con kh&ocirc;ng cần thiết.&lt;/p&gt;&lt;p&gt;Trong qu&aacute; tr&igrave;nh l&agrave;m project thực tế m&igrave;nh đ&atilde; kết hợp Prototype v&agrave; Factory với nhau, để implement một t&iacute;nh năng kh&aacute; phức tạp đ&oacute; l&agrave; tạo ra c&aacute;c loại contract cho kh&aacute;ch h&agrave;ng trong c&aacute;c hệ thống finance khi kh&aacute;ch mua bảo hiểm, hoặc hợp đồng vay thế chấp, t&iacute;n chấp&hellip;Đồng thời, kết hợp với&nbsp;&lt;strong&gt;Map&lt;/strong&gt; collection để n&acirc;ng cao tối đa hiệu quả của&nbsp;&lt;strong&gt;Prototype&lt;/strong&gt;.&lt;/p&gt;&lt;pre&gt;&lt;code class=&quot;language-plaintext&quot;&gt; public class ContractFactory{

    public Map&amp;lt;String, Contract&amp;gt; contractMaps = new HashMap&amp;lt;&amp;gt;();

    public void extendContract(String customerId){
        Contract extended = null;
        if(contractMaps.containsKey(customerId)) {
            Contract original = contractMaps.get(customerId);
            extended = original.clone();
            extended.setRenewDate(new Date());
        }else {
            extended = new Contract();
        }
        contractMaps.put(customerId, extended);
    }
}
&lt;/code&gt;&lt;/pre&gt;&lt;h3&gt;&lt;strong&gt;The Cons of Prototype&lt;/strong&gt;&lt;/h3&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;strong&gt;Prototype&lt;/strong&gt; pattern ph&ugrave; hợp đối với việc tạo ra c&aacute;c object c&oacute; nhiều th&ocirc;ng tin chung. Tuy nhi&ecirc;n, cần phải xem x&eacute;t kỹ lưỡng trong trường hợp cần tạo ra object đặc biệt khi m&agrave; object mới c&oacute; qu&aacute; nhiều field cần phải update.&lt;/p&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;Dĩ nhi&ecirc;n việc tạo ra c&aacute;c object mới bằng c&aacute;ch clone từ object hiện tại th&igrave; khả năng cao object mới sẽ chứa nhiều th&ocirc;ng tin dư thừa từ original object.&lt;/p&gt;&lt;h2&gt;&lt;span style=&quot;color:hsl(0,0%,0%);&quot;&gt;&lt;strong&gt;5. The Conclusion&lt;/strong&gt;&lt;/span&gt;&lt;/h2&gt;&lt;p style=&quot;text-align:justify;&quot;&gt;Prototype design pattern rất hiệu quả trong việc tạo ra object phức tạp. B&ecirc;n cạnh đ&oacute;, n&oacute; cũng thể hiện kha kh&aacute; điểm yếu. Tất cả m&igrave;nh đều đ&atilde; liệt k&ecirc; trong b&agrave;i viết. Dĩ nhi&ecirc;n, sẽ kh&ocirc;ng c&oacute; một giải ph&aacute;p n&agrave;o l&agrave; to&agrave;n diện. V&igrave; vậy, anh em n&ecirc;n xem x&eacute;t kỹ trước khi đưa ra quyết định l&agrave; n&ecirc;n d&ugrave;ng pattern n&agrave;o, để đạt được hiệu quả tối ưu nhất.&lt;/p&gt;&lt;/body&gt;&lt;/html&gt;

Creational Design Pattern là một nhóm pattern vô cùng hữu ích trong việc tạo ra một object. Việc tạo ra object phụ thuộc nhiều vào ngữ cảnh như: số lượng tham số truyền vào, điều kiện cơ sở…Là một trong những pattern phổ biến của nhóm Creational, Prototype pattern đem lại hiệu quả cao trong việc tạo ra một object phức tạp. Chúng mình cùng nhau tìm hiểu chi tiết về kỹ thuật thiết kế một Prototype pattern như thế nào  nhé

[Design Pattern] Bài 06: Sử Dụng Prototype Trong Java

Design Patterns

Join me as I share my first AWS adventure, transitioning from FE to Fullstack, and the solutions that saved me from common pitfalls.

Nguyễn Nhật Minh