doeunn.log

🛫 타입스크립트 type과 interface 타입스크립트에서 type과 interface는 모두 타입을 정의하는 데 사용되는 기능입니다. 🪐 type type은 새로운 타입을 정의할 때 사용됩니다. type은 기존 타입을 확장하거나 별칭을 만들 수 있으며, 유니온 타입, 인터섹션 타입, 제너릭 등의 고급 타입 기능을 활용할 수 있습니다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 // 유니온 타입 예시 type MyType = string | number; const myVariable: MyType = "Hello"; const myNumber: MyType = 42; // 인터섹션 타입 예시 type Fi..

🦆 덕 타이핑과 구조적 타이핑 타입스크립트에서 "덕 타이핑"은 객체의 타입을 결정하는 데 객체가 필요로 하는 속성이나 메서드의 존재에 초점을 둔 타입 매칭 방식을 말합니다. 덕 타이핑은 "덕 테스트(duck test)"에서 유래되었는데, "오리처럼 걷고, 오리처럼 꽥꽥 소리를 내면, 그것은 오리다"라는 개념을 기반으로 합니다. 즉, 어떤 새가 오리로 태어났는지, 정말 오리인지는 중요하지 않습니다. 새가 오리처럼 보이고 오리처럼 행동하면 오리가 아닐리가 없다고 생각하는 것입니다. ⛳ 덕 타이핑과 구조적 타이핑은 동일한 개념을 가리킨다 두 용어는 모두 객체의 타입을 결정할 때 구조와 필요한 속성의 존재에 초점을 둔 타입 매칭 방식을 의미합니다. 덕 타이핑이라는 용어는 덕 테스트로부터 유래된 것이며, 이를 좀..

🚀 TDD란? TDD란 Test Driven Development의 약자로, '테스트 주도 개발'이라고 합니다. 반복 테스트를 이용한 소프트웨어 방법론으로, 엔지니어 켄트 벡(Kent Beck)에 의해 고안되었습니다. 작은 단위의 테스트 케이스를 작성하고 이를 통과하는 코드를 추가하는 단계를 반복하여 구현합니다. 짧은 개발 주기의 반복에 의존하는 개발 프로세스이며 애자일 방법론 중 하나의 eXtream Programming(XP)의 'Test-First' 개념에 기반을 두고 있습니다. eXtream Programming(XP)란 ? 미래에 대한 예측을 최대한 하지 않고, 지속적으로 프로토타입을 완성하는 애자일 방법론 중 하나이다. 이 방법으로는 추가 요구사항이 생기더라도, 실시간으로 반영할 수 있다. +..

Jotai ? 간단히 요약해보자면, 추가 렌더링이 없고, 리액트에 속한 상태 그리고 서스펜스와 병렬 기능들의 장점을 모두 취할 수 있고, 심플한 react.useState 대체재부터 복잡한 요구사항을 가진 큰 스케일의 애플리케이션까지 커버 가능한 Jotai ! 주요 기능 Minimal API TypeScript oriented Tiny bundle size (3kb) Many extra utils and official integrations Supports Next.js and Reat Native 컨셉 리렌더링 이슈를 기존 useContext + useState 조합으로 해결하기엔 다음의 문제가 존재하기 때문에, Jotai는 리렌더링 이슈를 해결하기 위해 만들어졌습니다. Provider hell : ..

🚀 유틸리티 타입이란 ? 유틸리티 타입은 이미 정의해 놓은 타입을 변환할 때 사용하기 좋은 타입 문법입니다. 예를 들어 Information이라는 인터페이스에서 일부 속성만 사용하고 싶다면, 일부만 있는 타입을 선언해서 사용하지 않아도 유틸리티 타입 한 줄로 보다 간결하게 사용할 수 있게 됩니다. 유틸리티 타입을 꼭 쓰지 않더라도 기존의 인터페이스, 제네릭 등의 기본 문법으로 충분히 타입을 변환할 수 있지만 유틸리티 타입을 쓰면 훨씬 더 간결한 문법으로 타입을 정의할 수 있습니다! 자주 사용되는 유틸리티 타입 알아보기 자주 사용되는 타입을 몇 개 알아봅시다 ! Partial Partail 타입은 특정 타입의 일부만 사용하는 것을 허용하는 타입을 정의할 수 있습니다. interface Address { e..

🚀 Hook에 대해 정확히 이해해보자 ..😂 React를 공부하고 있지만, 정확하게 "Hook에 대해 설명해봐" 하면 어... 하게 되어서 이번 기회에 한번 제대로 정리해보려고 합니다 :) 제가 커스텀 훅을 제대로 만들지 못하는 이유가 Hook에 대해 정확하게 이해하고 있지 못해서라고 생각이 들어서이기도 합니다.. Hook이 등장하게 된 배경 Hook은 리액트 16.8 버전 이후로 추가된 기능이며, Hook이 등장하기 전에는 상태를 관리하기 위해 class를 작성했었습니다. Hook이 등장하기 전 리액트에는 여러 문제들이 존재했습니다. 컴포넌트 사이에서 상태와 관련된 로직을 재사용하기 어려웠다. Hook은 계층 변화 없이 상태 관련 로직을 재사용할 수 있도록 도와준다. 생명주기 컴포넌트로 인한 복잡한 컴..