Angular πŸ‡ΊπŸ‡¦ - practical notes
1.63K subscribers
1.6K photos
1 file
532 links
Angular - practical notes

This group is for posting practical notes for Angular developers. Mostly all posts are for quick implementation https://t.me/angular_practical_notes (Commenting on posts only in ENG and UA langs here). Welcome!
Download Telegram
πŸ“„ Composite Design Pattern

#js #patterns #composite

Composite: Basic Idea
The first thing we need to look at is the definition offered by the book from the Gang of Four:

β€œCompose objects into tree structures to represent part-whole hierarchies. Composite lets clients treat individual objects and compositions of objects uniformly.”


βœ… Article link
πŸ“΅ DOM Events and Pub/Sub

#js #patterns

Pub/Sub, which means Publish-Subscribe, uses a more structured approach. Instead of depending on DOM components, it uses a central message bus, similar to an events message board. Here is the summary:

- Publishers: These are the event announcers who broadcast messages (events) via the messaging bus.
- Subscribers: These are the visitors who registered to receive specific announcements (events). When a relevant interaction comes, subscribers get notified and can take action.


βœ… Article link
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
πŸ‘2
🚱 Interview Questions: Function currying

#js #interview #deepClone #patterns

Analysis: Currying of the add function is achieved by recursively calling a function that continues to accept parameters.
Please open Telegram to view this post
VIEW IN TELEGRAM
❀️ Angular Design Patterns: Composite

#angular #patterns #composite

The Composite pattern defines two basic types of elements sharing the same interface: simple leaves and complex containers. A container can consist of both leaves and other containers. This allows for the construction of a nested, recursive structure of objects resembling a tree.


βœ… Article link
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
πŸ“„ Implement the Chainable Utility Type

#ts #types #patterns

βœ… Article link
πŸ“΅ JavaScript Design Pattern β€” Facade

#js #patterns

βœ… Article link
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
πŸ‘4
🚳 JavaScript Design Pattern: Builder

#js #patterns #ui_element

βœ… Article link
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
πŸ‘1
πŸ“„ The Adapter Pattern in TypeScript

#ts #patterns #adapter

The Adapter Pattern is a structural design pattern that allows incompatible interfaces to work together by providing a "wrapper" or "adapter" around an existing class. Below is a real-world example of the Adapter Pattern in TypeScript, where we want to integrate a new payment gateway into an existing e-commerce application.


βœ… Article link
πŸ‘1
πŸ’™ Angular: Design Patterns

#angular #patterns

Why Design Patterns are important

1. Scalability

Design Patterns help break your app into small, reusable pieces. This makes it easy to add new features later without messing up existing ones.

2. Maintainability

Following design patterns ensures your code has a clear, organized structure.

For example using patterns like the Singleton Pattern makes the app more maintainable because you only have to change one piece of code in the service, and all the components that depend on it will automatically adapt.

3. Testability

Design patterns promotes the separation of concerns which makes it easier to mock and test components

4. Code Reusability

Patterns encourage writing reusable code.

For example, patterns like Factory and Singleton help you organize similar tasks in one place, so you can easily reuse them without rewriting the same logic.


βœ… Article Link
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
πŸ‘4
πŸ“„ Advanced TypeScript Patterns

#ts #patterns

βœ… Article Link
πŸ‘9
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
πŸ‘5