MVVM 패턴이란? Model - View - ViewModel 의 약자로 프로그램의 비지니스 로직과 프레젠테이션 로직을 UI로 명확하게 분리하는 패턴이다. 데이터를 관리하는 로직과 UI로직을 분리하여 Application의 테스트와 유지 보수를 보다 용이하게 할 수 있게 되고, Code의 재사용성을 증대 시켜 UI Designer 와 협업을 ...

1. git 저장소 복제 git clone [Github Repository URL] [**Directory**] Github Repository URL 에는 클론해올 저장소의 주소를 지정해준다. Directory 에는 저장소를 복제할 파일 경로를 의미한다. 기능적으로 DIR 은 생략 가능하며, 보통 특별한 이유가 없는한 생략한다. 2. g...

Immer 는 리액트에서 상태값을 업데이트 할 때, “불변성“을 신경쓰지 않고 업데이트 할 수 있는 코드를 작성하기 쉽게 해주는 라이브러리이다. 그렇다면 불변성이란 도대체 무엇인가? 사전적으로 불변성이란 값이나 상태를 변경할 수 없는 것을 의미한다. 자바스크립트의 원시타입을 통해 불변성을 살펴보자.원시타입은 불변성을 가지고 있다. 대표...

Git rebase 란? git rebase 는 공통 Base를 가진 두 브랜치에서(main 브랜치 & feature 브랜치) feature 브랜치의 Base 를 main 브랜치의 최신 커밋으로 Base를 옮기는 작업이다. 쉽게말해서, 커밋의 베이스를 재설정 하는 것이라고 생각하면 된다. 1. feature 브랜치 생성후, main 브랜...

조인이란 여러 테이블에 흩어져 있는 정보 중 사용자가 필요한 정보만 가져와서 가상의 테이블처럼 만들어서 결과를 보여주는 것으로 2개의 테이블을 조합하여 하나의 열로 표현하는 것이다. INNER JOIN(내부 조인) INNER JOIN 은 키 값이 있는 테이블의 칼럼 값을 비교 후에 조건에 맞는 값을 가져오는 조인이다. 간단히 말해 서로 연관된 ...

작업중에 여러 차레의 커밋을 하는 것은 개발자에게 많은 이점을 제공한다. 누군가의 개발로 이한 변화 결과를 확인하거나, 작업 이전의 상태로 롤백하기 등 유용한 상황이 많다. 하지만 이렇게 많은 커밋이 운영 브랜치에 고스란히 반영이 된다면 커밋 히스토리가 복장해지고 이해하기 어려워진다. 이런경우, –squash 옵션을 사용하게 되면 문제를 해결할 수 ...

git은 다른 형상 관리툴과 달리 branch를 생성할 때 파일을 복사하는 것이 아니라 파일의 스냅샷만 가지고 생성하기 때문에 자원의 부담없이 branch 를 만들어 사용할 수 있다. 이러한 장점 때문에 git 으로 작업을 할 때에는 다양한 용도의 branch를 만들어 사용하는데, git 에서 한 브랜치에서 다른 브랜치로 합치는 방법으론 크게 두 가...

Gitflow Workflow 는 프로젝트에서 Git을 사용하여 코드를 관리하는 방식을 설명하는 것으로 가장 일반적으로 사용되는 workflow 이다. 이는 개발자들이 코드를 공유하고 협업하는 방식을 표준화하고 단순화하여 팀의 생산성을 높이는 데 도움이 된다. Gitflow Workflow 에서는 항상 유지되는 메인 브랜치(master, develo...

카프카(Kafka) 란? 카프카(Kafka)는 링크드인(Linked-in) 에서 처음 개발되어 2011년 오픈소스화 된 솔루션이다. 실시간으로 스트리밍 데이터를 게시/ 구독/ 저장 및 처리할 수 있는 “분산형 데이터 스트리밍 플랫폼” 이다. 기존의 직접적인 (end-to-end) 연결 방식의 아키텍처는 데이터 연동의 복잡성이 높고 확장이 어...

Hexagonal Architecture 란? Hexagonal Architecture 는 클린 아키텍처를 구현하는 가장 대표적인 모델로, Alistair Cockburn 이 처음로 제안한 개념이다. 이 아키텍처는 소프트웨어 시스템을 여러개의 계층(Layer)으로 분리하고, 외부 요소와 내부 요소 사이으이 결합도를 낮추는 것을 목표로 한다. 이...

Singleton Pattern 이란 무엇인가? 싱글톤 패턴은 소프트웨어 디자인에서 사용되는 패턴 중 하나로, 이 패턴은 특정 클래스가 인스턴스를 오직 하나만 생성하도록 보장하는 것을 목적으로 한다. 이는 보통 전역 변수를 사용하지 않고 객체를 하나만 생성하여 이를 공유하는 데 사용된다. 이를 구현하기 위해, 먼저 클래스 내에 해당 클래스의 인...

객체 지향 프로그래밍이란? 객체 지향 프로그래밍 (Object-Oriented Programming, OOP)은 프로그래밍에서 필요한 데이터를 추상화 시켜서 상태와 행위를 가진 객체 로 만들고, 객체들간의 상호작용을 통해 로직을 구성하게끔 프로그래밍 하는 방법이다. 출처 :  https://www.reddit.com/r/ProgrammerH...

문자열 앞뒤의 공백을 제거하기 위해서 java.lang.String Class의 trim(), strip() 메서드를 사용할 수 있다. 하지만, 위 두 개의 메서드는 비슷한듯 하지만 차이점이 존재한다. trip() java.lang.String 클래스의 trim() 메서드는 앞뒤 공백을 제거한 문자열의 복사본을 리턴한다. public clas...

@Value 어노테이션은 Lombok 라이브러리에서 제공하는 어노테이션 중 하나로, 불변(Immutable) 한 값을 가지는 클래스를 간편하게 생성할 때 사용된다. @Value 어노테이션을 사용하면 클래스의 필드를 final로 선언하고, 해당 필드들에 대한 getter 메서드를 자동으로 생성해준다. 또한 클래스에 대한 equals, hashCode,...

Clean Architecture 관점에서 Domain 객체는 외부로부터 오염이 되면 안되는 클래스이다. 왜냐하면 Domain 클래스는 크리티컬한 정보를 담고 있고, 각 Service 에 있어서 핵심이기 때문에 안전하게 관리되어야 한다. 도메인 모델 성격의 클래스를 관리함에 있어서 각각의 멤버변수들을 private final 하게 정의하고, 각각의...

의존성 주입(Dependency Injection)이란? 외부에서 두 객체 간의 관계를 결정해주는 디자인 패턴으로, 인터페이스를 사이에 둬 클래스 레벨에서는 의존 관계가 고정되지 않도록 하고 런타임 시에 관계를 동적으로 주입하여 유연성을 확보하고 결합도를 낮출 수 있게 해준다. 다음과 같이 Store 객체가 Pencil 객체를 사용하고 있는 경...

과거에는 어떤방식으로 상수를 정의했었나? 1. final 상수 우선적으로 final 제어자를 이용하여 변수를 상수화 하는 방식이다. final 제어자를 할당함으로써 한번 지정하며 바뀌지 않게 설정되며, 동시에 static 을 사용하여 메모리에 한번만 할당 되게 설정한다. 하지만 해당 방식은 접근제어자들 때문에 가독성이 좋지 않다는 단점이 존재...

Intro Spring boot 에서 JPA 로 개발을 할때면 Entity Class 에서는 Setter 메서드를 생성하는 것이 바람직하지 않다고 흔히들 말한다. 바람직하지 않다고 하니 Setter 의 사용을 지양 하긴 하는데 “왜 지양하는가?” 에 대한 궁금증이 문득 들었다. 왜 지양해야하는가? 우선 Setter 를 무지성으로 사용...

Interceptor 란? Axios 의 interceptor 는 HTTP 요청과 응답을 가로채고 수정하는 기능을 제공한다. 이를 통해 요청을 서버로 보내기 전이나 서버로부터 응답을 받은 후에 다양한 작업을 수행할 수 있다. axios 에서는 두 가지 유형의 interceptor 를 제공한다. Request Interceptor (요청 ...

lodash 란? 우선 lodash 란 자바스크립트 유틸리티 라이브러리로, 다양하고 유용한 기능과 도구를 제공하여 개발자가 코드를 더 효율적으로 작성할 수 있다록 도와준다. lodash 는 아주 풍부한 유틸리티 함수를 가지고 있다. 배열처리, 객체 조작, 함수형 프로그래밍, 문자열 조작 등 다양한 영역에서 활용할 수 있는 함수를 제공한다. 그리...

정규표현식이란? 정규표현식(Regular Expression), 줄여서 “정규식”이라고 불리우는 해당 표현식은 텍스트 패턴을 검색하고 일치하는 문자열을 찾기 위한 패턴 기술이다. 정규식은 문자열 내에서 특정한 규칙이나 패턴을 검색하고 추출하는 데 사용된다. 정규식은 일련의 문자들로 구성된 문자열을 나타내는데, 이러한 문자열은 특정 패턴을 나타낸...

Yup 란? Yup 는 Javascript 로 작성된 유효성 검사 라이브러리 이다. 특히, Yup 는 객체 스키마를 정의하고 이를 사용하여 입력 데이터의 유효성을 검사하는데 메우 유용하다. 주로 Form Data의 유효성 검사와 관련하여 React 및 다른 프론트엔드 프레임워크와 함께 사용된다. Yup 는 강력하고 유연한 유효성 검사 도구로서,...

모듈 분해로 인해 발생 가능한 문제들 (개발자 관점) 1. 요청에 대한 처리량(throughput)이 급격히 하락 각 서비스의 정확히 필요한 컴퓨팅 리소스 파악 어려워진다. 즉 필요한 컴퓨팅 자원의 최적화가 어려워 성능 하락의 가능성이 생긴다. 2. http, gRPC 프로토콜 상의 이슈로 디버깅이 어렵다. Connect...

Sequence Diagram 시퀀스 다이어그램(Sequence Diagram)은 객체지향 소프트웨어 개발에서 사용되는 UML(Unified Modeling Language) 다이어그램 중 하나로, 시스템 또는 시스템의 일부 컴포넌트 간의 상호 작용을 시간 순서에 따라 보여주는 도구입니다. 시퀀스 다이어그램은 시스템의 동적인 행위를 시각적으로 ...

ERD 란 무엇일까? ERD(Entity-Relationship Diagram)는 엔터티와 엔터티 간의 관계를 시각적으로 나타내는 데이터베이스 설계 도구로, 데이터베이스의 구조와 관계를 이해하고 표현하는 데 사용됩니다. 엔터티는 데이터베이스에서 정보를 나타내는 객체를 의미하며, 관계는 엔터티 간의 연관성을 표현합니다. ERD 작성 사이트...

1. MSA 환경에서 소프트웨어아키텍처가 중요한 이유 MSA 는 모놀리스부터 분리/분해 된 Micro Service 들의 모임 Micro Services 들을 이루는 비즈니스 / 도메인은 시간이 흐름에 따라 성격, 복잡도 등이 변함 개별적인 Micro Service 내에서도 비즈니스적인 목적에 따라 별개의 기능, 효율을 중요시 해야하는 ...

1. Code Splitting 의 필요성 코드스플리팅은 React 뿐만이 아니라 Webpack 을 이용한 기타 다른 Application 에서도 모두 사용 가능한 언어이다. JavaScript 로 개발을 하고 배포하는 과정에서 Build 과정을 거치게 되는데, 이 과정에서 모든 파일들이 하나로 합쳐지게 된다. 쉽게 말해 index.js 부터 ...

Intro 불필요한 rerendering은 component를 reflow & repaint 시킴으로써 브라우저 성능 저하가 발생할 수 있다. 함수형 컴포넌트의 경우 리렌더링을 할 경우 내부 로직들이 재호출 되기 때문에 불필요한 컴포넌트 리렌더링을 최소화 해야 한다. Rendering 조건 본인의 state가 변경될 때 부모 ...

State 관리 react에서 상태를 업데이트 할 때 useState 말고도 useReducer hook을 통해 상태를 관리 할 수 있다. useReducer를 사용하게 되면 component state update 로직을 component에서 분리 시킬 수 있다. usestate 함수형 업데이트를 통해 렌더링을 최적화 할 수 있지만 u...

React v16.8 React Router v6는 React Hook 을 많이 사용하므로 v5 → v6로 업그레이드 하기 전에 React 16.8 이상 이어야 한다. 1. Routes 의 사용법 변경 1. Switch 컴포넌트 대신 Routes 컴포넌트 사용 Switch 의 네이밍이 Routes 로 변경 exact 옵션 삭제 ...

Intro MSA 컨셉을 생각하면 비즈니스 도메인 중심으로 서비스를 모델링하고 구현하는 것이 중요하다. 이 때 각각의 복잡한 도메인을 모델링하고 표현력있게 설계하는 것을 도메인 주도 설계(DDD) 라고 한다. Layer 구조 레이어간의 참조 관계에서는 단방향 의존을 유지하고 계층간 호출에서는 인터페이스를 통한 호출이 되도록 한다. L...

Next 새버전 출시 Vercel 에서 1년을 주기로 Next 131에 이어 Next 142 버전을 출시하였다. 13 버전 이후로 업데이트되면서 이전의 NextJS 구성 방식과는 많은 차이가 생겼는데 주요 특징을 알아보겠다. NextJS 13 불러온 변화 1. Routing Page Router -> App Router 13 ...

옵션 - REQUIRES_NEW 스프링에는 외부 트랜잭션과 내부 트랜잭션을 완전히 분리해서 사용하기 위한 옵션이 존재한다. 외부 트랜잭션과 내부 트랜잭션을 완전히 분리해서 각각 별도의 물리 트랜잭션을 사용하는 방법으로 (commit / rollback) 이 각각 별도로 이루어지게 된다. 이 옵션은 내부 트랜잭션에 문제가 발생해서 롤백해도, 외부 트랜...

Transaction Propagation - 내부 롤백 물리 트랜잭션은 외부 트랜잭션에 의해 커밋 / 롤백 을 한다. 즉 내부 트랜잭션에 의한 롤백의 경우 물리 트랜잭션에 영향을 주지 못한다. 스프링은 내부 트랜잭션에 의한 롤백 문제를 어떻게 해결할까? @Test void inner_rollback() { log.info("외부 트랜잭션 시...

Transaction Propagation 기본 트랜잭션을 각각 사용하는 것이 아니라, 트랜잭션이 이미 진행중인데, 여기에 추가로 트랜잭션을 수행하면 어떻게 될까? 기존 트랜잭션과 별도의 트랜잭션을 진행해야 할지, 아니면 기존 트랜잭션을 그대로 이어 받아서 트랜잭션을 수행해야 할지를 결정하는 것을 트랜잭션 전파(propagation) 이라고 한다...

Transaction 기본 import lombok.extern.slf4j.Slf4j; import org.junit.jupiter.api.Test; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.boot.test.context.Sp...

INTRO 트랜잭션을 처리하기 위해 트랜잭션 추상화, 트랜잭션 동기화, 트랜잭션 템플릿 등을 도입했다. 덕분에 트랜잭션을 처리하는데 있어서 반복되는 코드를 해결할 수 있었지만, 아직 Application 구조상의 서비스 계층 순수함은 충족시키지 못했다. 이를 해결하기 위해 스프링 AOP를 통한 프록시를 활용해 보겠다. 프록시를 통한 문제...

프로그래밍 언어가 가지고 있는 프로그래밍 패러다임 중, 각 언어만이 가지고 있는 고유한 프로그래밍 패러다임이 있다. JavaScript 의 경우 클래스를 이용한 객체지향 뿐만 아니라 Prototype 기반의 객체지향, 나아가서는 최근에 인기를 끌고 있는 함수형 프로그래밍까지 가능한 멀티패러다임을 가진다. 커링(Currying) 은 이러한 Jav...

Application 구조 여러가지 애플리케이션 구조가 있지만, 가장 단순하면서 많이 사용하는 방법은 역할에 따라 아래 그림과 같이 3가지 계층으로 나누는 구조이다. [그림. 1] Application 의 구조 여기서 가장 중요한 곳은 어디일까? 바로 핵심 비즈니스 로직이 들어있는 서비스 계층이다. 시간이 흘러서 UI(웹) 와 관련된...

INTRO 데이터를 저장할 때, 그냥 파일에 저장하지 않고 데이터베이스에 저장하는 이유는 무엇일까? 가장 대표적인 이유로는 트랜잭션이라는 개념을 데이터베이스가 지원하기 때문이다. 트랜잭션은 말그대로 거래 라는 뜻인데 풀어서 말하자면 하나의 거래를 안전하게 처리하도록 보장해주는 것을 뜻한다. 그렇다면 거래에 있어서 안전한 처리가 무슨 뜻일까? 하나의...