-
[React] Interface 를 통해 Props 관리하기 💨
Interface 란 ? Interface 는 TypeScript 와 같은 타입을 사용하는 문법요소 중 하나로, 객체의 구조나 함수의 형태를 정의하는데 사용된다. interface 는, 실행 시에는 존재하지 않고, 컴파일 시에만 타입검사에 사용된다. 이를 사용함으로 인해 타입 안정성을 향상시킬 수 있고, 한 번 정의한 인터페이를 다른 곳에서도 재사용 할 수있어, DRY 원칙을 지키는데 도움을 준다. DRY 원칙이란 ? ‘Do not Repeat Yourself’ 의 약자로, 반복하지 말라는 의미를 갖고있다. 소스코드에서 동일한 코드가 반복될 경우 잦은 에러를 야기하므로, 이는 개발습관과 밀접한 관계가 ...
-
[Typescript] React.FC 란 ? 💨
개요 👋 이번 포스팅에서는 프론트엔드 포지션에서 가장 많이 사용하는 React 프레임워크와 안정성을 위해 사용하는 TypeScript 를 사용하여 간단한 컴포넌트를 구현해보고자한다. What is FC ? FC 는 Function Component 의 약자로, React 의 함수 컴포넌트를 정의할 때 사용되는 타입이다. 이 타입은 함수 컴포넌트가 받을 수 있는 props 의 타입을 제네릭으로 받아, 타입 안정성을 높일 수 있다. 기본적으로 React.FC 는, children 이라는 props 를 자동으로 추가한다. // 1 type ComponentsType = React.FC<MyProps...
-
[Typescript] Parameter 'xxx' implicitly has an 'any' type
에러 확인 이미지 갤러리를 클론코딩 하던중 발생한 에러이다. 이미지를 Drag & Drop 하여 추가하기 위해 react-dorpzone Hooks 를 가져와 사용했다. 코드를 작성하고 실행하니 다음과 같은 에러 메세지를 출력한다. 에러를 살펴보면, Parameter implicitly has an ‘any’ type. 직역하면, 매개변수 acceptedFiles 가 암시적으로 any 타입을 갖고있다고 한다. 에러 해결 타입스크립트는 꽤나 까다롭다고 하더라 매개변수에 직접 any 타입을 지정해 주었다. let 이 아닌 const 임 Reference ...