React + TypeScript + DesignPattern
This is a repository for examples that implement Design Pattern as React and TypeScript.
React + TypeScript + DesignPattern = ?
As the size of the web page grows, the web has many states. The Web has developed a store concept for state manipulation and has developed models to make them easier to manage within store.
so as to model and inject object-oriented concepts, As I saw it, I needed a design pattern. This repository organized the design pattern.
Classification and Type
Design patterns had originally been categorized into 3 sub-classifications based on kind of problem they solve. Creational patterns provide the capability to create objects based on a required criteria and in a controlled way. Structural patterns are about organizing different classes and objects to form larger structures and provide new functionality. Finally, behavioral patterns are about identifying common communication patterns between objects and realize these patterns.
| name | classification | github repository | blog post |
|---|---|---|---|
| Factory Pattern | Creational Pattern | https://vallista.kr/2020/05/05/TypeScript-%EB%94%94%EC%9E%90%EC%9D%B8-%ED%8C%A8%ED%84%B4-%ED%8C%A9%ED%86%A0%EB%A6%AC-%ED%8C%A8%ED%84%B4/ | |
| Observer Pattern | Behavioral Pattern | https://github.com/Vallista/React-Observer-Pattern-Use-TypeScript | https://vallista.kr/2020/05/22/TypeScript-%EB%94%94%EC%9E%90%EC%9D%B8-%ED%8C%A8%ED%84%B4-%EC%98%B5%EC%A0%80%EB%B2%84-%ED%8C%A8%ED%84%B4/ |
| Memento Pattern | Behavioral Pattern | https://github.com/Vallista/React-Memento-Pattern-Use-TypeScript | https://vallista.kr/2020/06/07/TypeScript-%EB%94%94%EC%9E%90%EC%9D%B8-%ED%8C%A8%ED%84%B4-%EB%A9%94%EB%A9%98%ED%86%A0-%ED%8C%A8%ED%84%B4/ |