본문 바로가기
반응형

분류 전체보기1062

C++ - 개방-폐쇄 원칙 (OCP, Open-Closed Principle) C, C++ 전체 링크 Architecture & Design Pattern 전체 링크 참고 - 연산자 오버로딩을 이용하여 구조체 출력하기 개방-폐쇄 원칙 (OCP, Open-Closed Principle) - Open : 소프트웨어의 기능을 추가할 때, 기존의 코드를 변경하지 않고 확장할 수 있어야 한다. - Closed : 이미 동작하는 코드에 대한 변경이 필요 없이 새로운 기능을 추가할 수 있어야 한다. - 클래스는 확장에 대해서는 열려 있어야 하고, 코드 변경에 대해서는 닫혀 있어야 한다. 먼저 개방-폐쇄 원칙 위반 사례를 보자. 아래 코드는 사각형과 원의 넓이를 출력하는 예시다. #include using namespace std; class Rectangle { public: Rectangle.. 2024. 2. 12.
C++ - 의존 역전 원칙 (DIP, Dependency Inversion Principle) C, C++ 전체 링크Architecture & Design Pattern 전체 링크 참고- 팩토리 메서드 패턴 의존 역전 원칙 (DIP, Dependency Inversion Principle)- 구체화에 의존하지 말고 추상화에 의존해야 한다.- 상위 모듈은 하위 모듈에 의존해서는 안 되며, 모든 모듈은 추상화된 것에 의존해야 한다.- 이 원칙으로 하위 모듈의 변경이 상위 모듈에 영향을 주지 않고, 상위 모듈이 하위 모듈에 종속되지 않도록 한다.- 예를 들어, DB 연결과 같은 하위 모듈에 대한 의존성을 해결하기 위해 인터페이스를 제공하고,  상위 모듈은 해당 인터페이스를 구현하게 하여 실제 코드가 변경되더라도 상위 모듈에 영향을 미치지 않게 된다.먼저 아래의 의존 역전 원칙 위반 사례를 보자.#inc.. 2024. 2. 12.
C++ - 데코레이터 패턴 (Decorator Pattern) C, C++ 전체 링크 Architecture & Design Pattern 전체 링크 참고 - 클래스 다이어그램 그리기 - 스마트 포인터 : unique_ptr - 템플릿으로 클래스 상속하기 데코레이터 (Decorator Pattern) - 구조 패턴 - 기존 객체의 동작을 수정하지 않고, 그 객체의 기능을 확장하거나 수정하는 패턴 - 런타임에 동적으로 객체의 기능을 추가하거나 수정할 수 있다. 구현 - Component : 데코레이터와 구체적인 컴포넌트를 동일한 타입으로 처리하는 추상 클래스 / 인터페이스 - ConcreteComponent : 기본 동작을 구현하는 컴포넌트 - Decorator : 컴포넌트를 상속하고, 동적으로 기능을 추가, 변경하는 메서드를 가지는 추상 클래스 / 인터페이스 - C.. 2024. 2. 10.
C++ - 복합체, 컴포지트 패턴 (Composite Pattern) C, C++ 전체 링크 Architecture & Design Pattern 전체 링크 참고 - 반복자, 이터레이터 패턴 (Iterator Pattern) - 스마트 포인터 : unique_ptr 복합체, 컴포지트 패턴 (Composite Pattern) - 구조 패턴 - 객체들을 트리 구조로 구성하여 부분-전체 계층 구조(part-whole hierarchy)를 표현하는 패턴 - 클라이언트에서 개별 객체와 다른 객체들로 구성된 복합 객체(composite)를 똑같은 방식으로 다룰 수 있다. 구현 - Component (구성 요소) : 인터페이스 또는 추상 클래스를 정의, 복합 객체와 개별 객체에 공통된 동작을 정의 - Leaf (원소) : Component를 구현, 단일 객체, 메서드를 구현 - Com.. 2024. 2. 9.
Node JS - 폴더 내부의 전체 파일 개수 구하기 (Counting the Total Number of Files In Folder) Node JS 전체 링크 지정한 경로에 대해 파일의 개수를 구하려면 fs와 path 모듈을 이용하면 된다. 폴더 내부에 폴더가 있다면 재귀적으로 함수를 호출해서 파일 개수를 누적한다. const fs = require("fs"); const path = require("path"); const countFilesInDirectory = (dir) => { let count = 0; const items = fs.readdirSync(dir); for (const item of items) { const itemPath = path.join(dir, item); const stats = fs.statSync(itemPath); if (stats.isDirectory()) { count += countFil.. 2024. 2. 8.
C++ - 반복자, 이터레이터 패턴 (Iterator Pattern) C, C++ 전체 링크 Architecture & Design Pattern 전체 링크 참고 - 연산자 오버로딩을 이용하여 구조체 출력하기 - 클래스 다이어그램 그리기 - 스마트 포인터 : unique_ptr 반복자, 이터레이터 패턴 (Iterator Pattern) - 행동 패턴 - 객체의 컬렉션을 순회하고 요소에 접근할 수 있는 방법을 제공하는 패턴 - 컬렉션의 요소에 대한 구체적인 구현을 노출시키지 않고 컬렉션을 순회 구현 - Iterator (반복자) : 컬렉션의 요소를 순회하고 접근하는 인터페이스, next()와 hasNext()를 제공 - ConcreteIterator : Iterator 인터페이스를 구현하여 실제 컬렉션에 대한 순회 및 접근 동작 구현 - Aggregate (집합체) : 어떤.. 2024. 2. 4.
리액트 Material - Alert로 플로팅 메시지 만들기 (Floating / Toast Message with Mui Alert) 리액트 전체 링크 참고 - https://mui.com/material-ui/react-alert/ - https://mui.com/base-ui/react-snackbar/ 이벤트가 발생하면 플로팅 메시지(토스트 메시지)가 나타나고 사라지도록 해보자. (링크에서 확인) 구현 showAlert는 플로팅 메시지를 보여주는 조건이다. const [showAlert, setShowAlert] = useState(false); 버튼을 클릭하면 N번째 메시지를 보여준다고 가정하자. const handleButtonClick = (index) => { setShowAlert(true); setFloatingMessage(`${index} 번째 플로팅 메시지...`); }; 임의의 여러 내용은 아래와 같이 만들었다... 2024. 2. 3.
리액트 Material - 런타임에 Tab 추가, 삭제하기 (Mui Dynamic Tabs) 리액트 전체 링크 참고 - https://mui.com/material-ui/react-tabs/ - SweetAlert2로 모달, 팝업 만들기 Mui Tabs를 이용해서 동적으로 Tab을 추가 / 삭제해 보자. (링크에서 확인) 먼저 위의 링크를 참고하여 Tab 아래에 Text Area를 추가해 보자. 코드는 다음과 같다. import React, { useState } from "react"; import Box from "@mui/material/Box"; import Tabs from "@mui/material/Tabs"; import Tab from "@mui/material/Tab"; import Textarea from "@mui/joy/Textarea"; const TextAreaTabPa.. 2024. 2. 3.
리액트 - react-diff-viewer-continued로 텍스트 비교하기 (Compare Text with Diff Viewer) 리액트 전체 링크 참고 - https://github.com/aeolun/react-diff-viewer-continued 아래 결과는 링크에서 확인할 수 있다. 위의 뷰어를 만들기 위해 react-diff-viewer-continued를 설치하자. npm install react-diff-viewer-continued 예제 코드는 다음과 같다. import React from "react"; import Box from "@mui/material/Box"; import ReactDiffViewer, { DiffMethod } from "react-diff-viewer-continued"; const oldCode = ` const a = 10 const b = 10 const c = () => cons.. 2024. 1. 31.
반응형

티스토리툴바