본문 바로가기

분류 전체보기110

Typescript 타입 정의 파일 typescript는 컴파일 과정을 거쳐 타입 검증을 하는데, 검증을 하려면 타입이 정의된 파일이 있어야 한다. typescript로 작성한 모듈이라면 문법 자체에 타입이 있으니 문제없지만 javascript로 작성된 모듈을 사용하려면 컴파일러가 타입 검증을 할 수 없게 된다. 모듈의 타입을 알려주기 위해 .d.ts 파일을 두어 타입을 선언해 줘야 한다. 하지만 이 파일은 타입스크립트의 컴파일 과정에 필요한 거라서 npm 같은 저장소에 공개된 모듈들의 필수사항이 아니다. 따라서 typescript 프로젝트에서 .d.ts파일이 없는 외부 javascript 모듈을 받아온다면 문제가 발생한다. 다행히도 요새는 @types/{module_name}의 타입 정의 파일도 배포되기 때문에 타입 전용 모듈도 받음으로.. 2020. 3. 29.
CommonJS / ES 모듈 로딩 방식 모르고 사용하다가는 여러 모듈을 가져다 쓸 때 헷갈릴 수 있어서 가장 기본적인 방법부터 복습해보았다. typescript를 사용하면 typescript의 기능도 섞여있기 때문에 눈에 잘 안 보이는 경우가 있으니 주의하면서 정리해봤다. tsconfig.json의 compilerOptions는 "target": "ES2017" 로 두고 import/export 하는 방법은 다음과 같다. module.ts const obj = { a: 10, b: 20 } const func = (x: number) => x*2 const name = 'myName' export default obj export { func, name } export로 해당 멤버를 외부로 노출시키는데 default 키워드를 추가하면 impo.. 2020. 3. 29.
CSS flex 기본 flex로 css를 작업할 때 항상 유의해야 하는 것이 바로 축이다. 축은 결국 방향을 가리키는데 화살표로 기억하면 쉽다. 이 화살표는 flex-direction으로 설정할 수 있다. flex-direction: row | row-reverse | column | column-reverse row: 아이템을 → 방향으로 배치 (기본값) row-reverse: 아이템을 ← 방향으로 배치 column: 아이템을 ↓ 방향으로 배치 column-reverse: 아이템을 ↑ 방향으로 배치 이 화살표 방향을 따라 내부 아이템들을 배치시킨다. 내부 아이템의 속성이 많은데 괄호 안의 화살표를 기반으로 동작하기 때문에 이 방향을 확실히 인지하고 있어야 한다. 먼저 justify-content는 flex-direction.. 2020. 3. 12.
분산 트랜잭션 - 2단계 커밋(two-phase commit) 트랜잭션은 어떤 일련의 처리의 원자성을 보장하기 위한 방법이다. 흔히 쓰는 mysql에서는 START TRANSACTION으로 트랜잭션을 시작하고 COMMIT 명령으로 이를 실행한다. 디스크에 COMMIT 명령이 성공적으로 써지면 mysql이 장애로 죽는다 해도 디스크에 써둔 로그로부터 복구할 수 있다. 만약 디스크에 쓰기가 실패한다면 트랜잭션은 abort 되고, 트랜잭션에 묶였던 명령은 rollback 된다. 이런 절차를 통해 트랜잭션 단위로 쓴 모든 명령이 성공하거나 실패했다는 원자성을 보장한다. 하지만 하나의 데이터베이스/시스템이 아닌 여러 개의 분산 환경이라면 위의 방법만으로는 충분하지 않다. 한 곳에서는 트랜잭션이 commit 되었지만, 다른 한 곳에서 abort 된다면 분산 트랜잭션의 원자성을.. 2020. 2. 20.
JPA로 batch insert 하는 방법 여러 entity를 table에 생성을 해야 하는 경우, 하나씩 n번 생성하는 것보다는 bulk로 묶어서 생성하는 편이 여러모로 좋다. JPA의 구현체에 .saveAll 로 Iteratable 을 인자로 받는 메소드가 있어서 아주 적은 노력으로 구현했지만, 실제 디버깅 레벨로 쿼리를 출력해보니 하나씩 처리하고 있었다. 인터페이스는 마치 INSERT INTO {TABLE} VALUES ([..., ...]) 꼴의 쿼리로 변환될 것처럼 보였는데, 하나씩 처리하고 있으니 그 원인을 찾아봤다. 역시 가장 먼저 이와 관련된 설정 값이 있다. spring.jpa.properties.hibernate.jdbc.batch_size=20 hibernate에게 batch 처리를 가능하도록 그 크기에 대한 설정 값을 0보다.. 2020. 2. 20.
bracketed paste mode 프로그램에 따라 같은 문자라도 직접 타이핑하는 경우와 복사해서 붙여 넣을 경우는 구분이 필요하다. vim에서 코드를 복붙 해봤으면 공감이 갈 것이다. 자동 indentation 기능으로 직접 코딩할 때는 문제없지만, 다른 코드 여러 줄을 복붙 하면 indentation이 엉망이 되는 경우가 있다. 물론 이를 해결해주는 기능도 있지만 더 근본적으로 vim 입장에서 이 코드가 복사한 건지, 직접 입력한 건지 구분할 수 있다면 좋을 것이다. 구분을 위해 사용하는 게 bracketed paste mode이다. 이게 설정되면 붙여 넣기로 추가된 문자에 대해서 앞뒤로 특수 기호가 추가된다. 그 정체는 앞에는 \e[200~, 뒤에는 \e[201~ 가 붙는데 실제 눈에 보이는 건 00~와 01~일 것이다. 복사 여부를.. 2020. 2. 12.