전체 글 139

React - DragDrop 구현

회사에서 Drag Drop 이벤트를 사용을 하는 부분이 라이브러리를 통해 구현되어 있었는데 커스텀이 힘든 경우가 대부분이였었다.. 그렇기에 HTML 에서 지원하는 방식으로만 구성해봤다. 공식문서 https://developer.mozilla.org/en-US/docs/Web/API/HTML_Drag_and_Drop_API HTML Drag and Drop API - Web APIs | MDN HTML Drag and Drop interfaces enable applications to use drag-and-drop features in browsers. developer.mozilla.org "use client" import { DragEvent } from "react" const DragItem ..

React 2024.04.10

LeetCode - Same Tree Javascript

Same Tree 의 경우 두 이진트리가 같은지 확인하는 문제이다. 두 이진트리가 같다는것은 두 트리의 구조가 동일하며, 노드들의 값이 모두 같아야 한다는 것을 의미하는 것이다. 재귀적으로 두 트리를 동시에 탐색하는 방식으로 풀었다. 각 단게에서 현재 노드의 값이 같은지 확인하고 왼쪽 자식과 오른쪽 자식을 각각 재귀적으로 비교하면 정답이다. p = [1,2,3]; q = [1,2,3]; function TreeNode(val, left, right) { this.val = (val===undefined ? 0 : val) this.left = (left===undefined ? null : left) this.right = (right===undefined ? null : right) } 정답 var i..

알고리즘 2024.03.30

Nginx - 로드밸런싱 알고리즘

Nginx 에서는 대표적인 로드밸런싱 알고리즘 여러가지가 있지만 그중에서 라운드 로빈과 리스트 커넥션 개념을 정리해보려 한다. (라운드 로빈, 리스트 커넥션, IP 해시, 리스트 타임 등등....) 리스트 타임은 Nginx plus에서만 사용할 수 있는 방법이다. 1. 라운드 로빈(Round Robin) 라운드로빈은 기본값으로 설정된 부하분산 방법이다. 요청이 순차적으로 각 서버에 동일하게 분배되는 방식이다. upstream 풀에 지정된 서버의 순서에 따라 요청을 분산한다. upstream 내부에 가중치(weight)를 설정할 ㅅ ㅜ잇는데 더 높은 정숫값으로 설정된 서버는 더 많은 요청을 받도록 설정할 수 있다. http { upstream back { server api.backend.com:8080 ..

NginX 2024.03.23

Jest - Cannot find module

서비스 클래스 테스트 코드 작성중 계속 테스트 할 서비스 클래스에서 import 하는 모듈을 못 찾는다는 에러가 떴다. ../../ 이처럼 상대경로로 변경하면 해결되는데 기존에 vscode 를 통해 자동완성했던 것들이 너무 많아서 다른 방법 찾다가 해버린 방법 여기서는 jest.config.js 가 아닌 package.json 키값으로 함 "moduleNameMapper": { "^src/(.*)$": "/$1" }, package.json 키 값에 넣고 npm run test 다시 하면 모듈을 제대로 찾는다.

Nest.js 2024.03.17

Nest.js - Molecular 서비스 브로커 예제

이 글은 어떻게든 Molecular 로 사용해보기 위해 적용해본 코드 및 정의이므로 정답이 아닐 수 있습니다. Molecular는 Node.js를 위한 빠르고 강력한 MSA 프레임워크이다. 효율적이고 안정저깅며 확장 가능한 서비스를 구축하는데 도움이 된다고 공식문서에 나와있다. Moleculer is a fast, modern and powerful microservices framework for Node.js. It helps you to build efficient, reliable & scalable services. Moleculer provides many features for building and managing your microservices. 해당 라이브러리를 사용하면 Service..

Nest.js 2023.12.18

Nest.js - TypeORM 설정

TypeORM 은 Node.js 환경에서 사용되는 객체 관계 매핑 라이브러리이다. Nest.js에서 적용하는 방법 1. npm 으로 typeorm 라이브러리 다운 2. AppModule에 TypeOrmModule.forRoot({}); 설정 (db 연결정보 및 엔티티 위치) 3. Entity 정의 4. 사용하려는 모듈에 TypeOrmModule.forFeature([엔티티]) 등록 5. 해당 모듈에 속한 클래스 생성자에서 @InjectRepository(엔티티) 를 통해 해당 엔티티에 대한 레포지토리를 주입 받아 사용 코드 1. TypeORM 및 데이터베이스 드라이버 설치 npm install --save @nestjs/typeorm typeorm mysql 2. TypeORM 모듈 등록 - AppMo..

Nest.js 2023.11.26

Nest.js - Interceptor 로 로그 및 응답 데이터 변형하기

Nest.js 에서 Interceptor 주요 기능과 특징 1. 컨트롤러 실행 전후 로직 : Interceptor는 컨트롤러 메서드가 실행되기 전과 후에 특정 로직을 수행할 수 있다. 이를 통해 요청을 가로채거나 응답을 수정할 수 있다. 2. 응답변형 : 인터셉터를 사용하여 컨트롤러에서 반환된 응답을 변형하거나, 특정 형식으로 포멧팅할 수 있다. 3. 비동기처리: Interceptor는 RxJS 의 Observable 을 사용한다. 이를 통해 비동기 데이터 스트림을 관리하고, 효율적인 비동기 처리를 할 수 있다.  4. 로깅 및 모니터링: 요청과 응답에 대한 로깅을 수행하거나 실행시간을 측정하는 등의 모니터링 작업을 인터셉터에서 처리할 수 있다. 구현코드 일단 인터셉터를 구현하려면 NestInterce..

Nest.js 2023.11.26

JS - var 를 for문에서 함수와 사용시 문제점 및 해결

0번 인덱스 1번 인덱스 2번 인덱스 이런식으로 addEventListener로 클릭 이벤트시 콘솔에 출력시 어떤 결과가 나올지 살펴보면 문장만 봐서는 0, 1, 2가 나와야 한다고 생각할 수 있다. 하지만 실제로 사용해보면 모든 li 태그를 클릭시 전부 2가 출력되는 걸 볼 수 있다. 이벤트를 다뤄서 그럴 수 있다고 생각할 수 있지만 JS 코드로 테스트 해볼경우도 같은 결과이다. function addClick(items){ for(var i = 0 ; i < items.length; i++){ items[i].onSearch = function(){ return i; } } return items; } const example = [{},{}]; const clickSet = addClick(exam..

Node.js 2023.08.26

SQL - 재귀쿼리 (MYSQL)

테스트 데이터 CREATE TABLE categories ( id INT PRIMARY KEY, name VARCHAR(100) NOT NULL, parent_id INT ); INSERT INTO categories (id, name, parent_id) VALUES (1, 'Electronics', NULL), (2, 'Mobile Phones', 1), (3, 'Laptops', 1), (4, 'Smartphones', 2), (5, 'Tablets', 2), (6, 'Apple', 4), (7, 'Samsung', 4); 재귀쿼리 재귀쿼리는 한 쿼리 내에서 자기 자신을 참조하는 쿼리를 말하낟. 계층 구조를 가진 데이터를 처리하거나 계층적인 쿼리를 작성하는데 유용하다. 재귀 쿼리는 일반적으로 WIT..

SQL 2023.07.17

Linux - find, grep, pgrep

1. find - find 명령어는 파일 및 디렉토리를 검색하는데 사용된다. - 일반적인 사용법 find [경로] [조건] [동작] 경로 -> 경로 검색을 시작할 디렉토리 겨올이다. 기본적으로 현재 디렉토리에서 검색을 시작한다. 조건 -> 조건 파일 검색을 위한 조건이다. 예를 들어 '-name' 옵션을 사용하여 검색결과를 출력한다. 동작 -> 동작 검색 결과에 대한 동작을 지정한다. 일반적으로 -print 옵션을 사용하여 검색 결과를 출력한다. find . -name "*.txt" -print 2. grep - grep 명령어는 파일 내용에서 특정 패턴을 검색하는데 사용된다. - 일반적인 사용법 옵션 종류 -v 옵션은 지정된 패턴과 일치하지 않은 라인을 출력한다. 즉 패턴을 제외한 내용을 출력한다. -..

Linux 2023.07.09