본문 바로가기

전체 글30

<UX/UI의 10가지 심리학 법칙>을 읽고 프론트엔드 개발자로서 사용자가 편리한 서비스를 만들기 위해 노력하고 있다. 편리한 서비스의 대부분은 좋은 UX(사용자 경험)와 UI(사용자 인터페이스)를 보유하고 있다. 그런데, 좋은 UX/UI가 정확히 무엇일까? 을 읽고 난 후, 의문점이 어느 정도 해소되었다. 책에서는 심리학 기반의 논문을 설명 후 해당 논문을 적용한 사례를 소개하여, 논문의 내용을 간략히 이해하는데 큰 어려움이 없었다. 책을 읽으면서 좋았던 점은 주관적이고, 경험을 기반으로 설명하는 게 아니라 객관적, 학문적으로 설명하는 점이었다. 특히, 책의 9장 테슬러의 법칙 파트가 가장 인상 깊었다. 테슬러의 법칙에 따르면, 모든 시스템에는 더 이상 줄일 수 없는 일정 수준이 복잡성이 존재한다. 즉, 개발자, 디자이너, 사용자 중 누군가는 시.. 2022. 6. 22.
[TypeScript] "T extends U ? X : Y"에 대한 고찰 TL;DR 타입은 가능한 값의 집합이다. 서브 타입과 슈퍼 타입을 집합의 관계로 설명할 수 있다. 조건부 타입은 분배법칙을 허용한다. 타입은 집합 타입은 가능한 값의 집합이다. 타입은 가능한 값의 집합? 직관적으로 한 번에 이해가 잘 되지 않는다. 예시를 통해 타입과 집합 관계를 이해해보자. never 타입은 어떠한 값도 할당할 수 없는 타입이다. 어떠한 값도 할당할 수 없기 때문에 공집합이라고 말할 수 있으며, never = {}라고 표기할 수 있다. 예를 하나 더 들어보자. number 타입에는 정수, 소수를 할당할 수 있다. 그러면 number = {정수, 소수}라고 표기할 수 있다. 서브타입과 슈퍼 타입 집합 A가 집합 B의 부분 집합이면 A ⊂ B라고 표기할 수 있다. 두 집합이 서로 같을 때에.. 2022. 6. 7.
[JavaScript] 정말 Promise.all()은 병렬로 실행될까? 병렬성과 트랜잭션 동시성(Concurrency)과 병렬성(Parallelism) 프로그래밍을 공부하다 보면 동시성과 병렬성이란 용어를 듣게 된다. 두 용어 모두 멀티 태스크를 처리하는 방법이다. 우선 동시성을 알아보자. CPU는 한 시점에 하나의 태스크 밖에 처리하지 못한다. 만약 CPU가 하나 인데 여러 태스크를 처리해야 한다면, 태스크를 번갈아가면서 실행시켜야 한다. 이를 동시성이라고 말할 수 있다. 운영체제에서의 컨텍스트 스위칭을 생각해보자. 병럴성은 CPU가 2개 이상인 경우에 사용되는 개념이다. CPU가 여러개 이다 보니, 한 시점에서 여러 태스트를 처리할 수 있다. (동시성과 병렬성을 더 자세히 알고 싶다면, Deview2021 심흥운님의 세션을 들어보면 좋을 것 같다.) 트랜잭션(Transa.. 2022. 6. 1.
[TypeScript] any vs unknown TL;DR any는 모든 타입에 할당될 수 있으며, unknown은 unknown, any 타입에만 할당될 수 있다. any는 속성에 접근이 가능하며, unknown은 불가하다. any, unknown 모두 다른 타입과 연산을 허용하며, unknown은 비교 연산, 논리 연산, typeof, instanceof 연산만 허용한다. unknown은 추론된 타입이 아닌, 개발자가 직접 명시한 타입이다. (타입 시스템이 추론하지 못한 값은 any가 최대) 1. 할당 관점 let anyVal: any; let unknownVal: unknown; let numVal: number; let strVal: string; numVal = anyVal; numVal = unknownVal; // Error: Type '.. 2022. 6. 1.
[TypeScript] type vs interface (차이점을 중심으로) TL;DR 상속 시, type은 동일한 속성의 값 타입을 오버로딩 하며 interface는 서브 타입 관계를 확인한다. type은 모든 타입으로 확장 할 수 있으며, interface는 object 형태의 타입만 상속받을 수 있다. (class, interface, typeof object) type은 선언 병합을 허용하지 않으며, interface는 선언 병합을 허용한다. (단, interface에서 선언 병합 시 동일한 속성이 있다면, 반드시 값 타입이 같아야 한다.) 용어 A >: B : A는 B의 슈퍼타입이다. (= B는 A의 서브타입이다.) 1. 상속 시 동일한 속성이 존재하는 경우 type은 상속 시, 동일한 프로퍼티에 대해 오버로딩한다. interface는 상속 시, 부모 interface의.. 2022. 5. 31.
[TypeScript] enum vs const enum (+ 07/14 객체로 enum 구현 추가 ) enum enum은 c++, Java 언어에서 사용되는 열거형 타입이다. JavaScript에는 지원되지 않는 문법이며, TypeScript에서만 사용할 수 있다. enum은 트리 쉐이킹 되지 않는다. 타입스크립트에서 enum은 컴파일 시점에 즉시 실행 함수(IIFE)로 key-value, value-key 쌍의 속성을 가진 객체를 생성한다. 아쉬운점은 IIFE로 객체를 생성하기 때문에 트리 쉐이킹 되지 않아 번들 파일의 크기를 증가시킬 수 있다. /* TS */ enum EnumKeyboard { "UP", // 0 "LEFT", // 1 "BOTTOM", // 2 "RIGHT", // 3 } /* JS */ var EnumKeyboard; (functio.. 2022. 5. 30.