🍉 jest 시작하기 변경할 때마다 모든 test 실행 commit되지 않은 파일만 test 실행 🍉 기본 테스트 작성 >- 예제) calculator.js describe : 관련있는 테스트끼리 묶음. beforeEach : 각각의 테스트가 실해오디기 전에

한번 작성된 테스트 코드는 영원히 유지보수 해야한다. => clean code테스트 코드에서는 내부 구현사항을 테스트하면 안된다.재사용성을 높이기 (테스트 유틸리티)배포용 코드와 철저히 분리테스트코드를 통한 문서화 => 테스트코드는 문서화의 효과도 있다모든 테스트 코드

Property 'header' is missing in type '{}' but required in type 'HeaderProps'.참고 SFC 타입 선언에 & { defaultProps: Partial } 에러 처리

HOC는 리액트 컴포넌트를 인자로 받아서 새로운 리액트 컴포넌트를 리턴하는 함수이다.예제1 고차 컴포넌트예제2 React 고차 컴포넌트 튜토리얼

useState 초기값이 없는 경우 다음과 같이 타입을 지정할 수 있다. 아래의 경우는 null 혹은 AuthUser 타입을 가진다는 것을 의미 하지만, 위와 같이 설정하게 되면 null 타입 또한 허용되기 때문에, as를 이용하는 것이 좋다. 아래와 같이 as를

SCSS 세팅

Dom 요소 선택

퍼스트 클래스 데코레이터

제네릭

인터섹션 타입을 이용해 “여러 경우에 모두 해당”하는 타입을 표현할 수 있다.A & B 타입의 값은 A 타입에도, B 타입에도 할당 가능해야 한다. 만약 A와 B 모두 객체 타입이라면 A & B 타입의 객체는 A와 B 타입 각각에 정의된 속성 모두를 가져야 한다.typ

typescript class

오늘 프론트엔드 개발 첫 면접을 보게 되었다.나도 누군가의 후기글에 많은 도움을 받았기 때문에 면접에서 받은 실제 질문들을 나열해 보겟다.날짜 : 2022.01.27면접관 : 개발자 2분, 비개발자 1면접 총 시간 : 1시간직무 : 프론트엔드 개발공고에서 기재된 스택

타겟 요소와 root 요소 사이의 intersection 변화를 비동기적으로 관찰하는 방법페이지 스크롤 시 이미지를 Lazy-loading(지연 로딩)할 때Infinite scrolling(무한 스크롤)을 통해 스크롤할 때 새로운 콘텐츠를 불러올 때광고의 수익을 계산하

성별 여성 선택 => 적용하기 버튼 클릭 => 성별 남성 선택 => 적용하기 버튼 클릭 => 성별 모두 선택 => 적용하기 버튼 클릭 CardFilter 컴포넌트에서 12번의 리렌더링이 발생하였다.지도페이지를 구성하는 MapPage 컴포넌트에는 CardFilter, S

개선 전 Lighthouse 성능 npm run build React.lazy을 통한 개선 ![](https://images.velog.io/images/ellie1

프로그래밍의 상태와 상태를 변경시키는 구문의 관점에서 연산을 설명하는 방식input data를 받아들여 가공해 output data를 만들어내고 출력하는 구조의 프로그래밍 방식.즉, 문제를 어떻게(how) 해결할 것인지를 설명하는 프로그래밍 방식.데이터와 기능(함수)으

아래의 3가지 의도를 분명히 드러내는 이름이 필요하다변수의 존재 이유는?수행 기능은?사용 방법은?이름 d는 아무 의미도 드러나지 않는다. 측정하려는 값과 단위를 표현하는 이름이 필요하다.코드의 함축성이 필요하다. 코드 맥락이 코드 자체에 명시적으로 드러나야 한다.위의

dd

React 공식문서

타입스크립트에서는 타입 표기가 없는 경우, 타입 정보를 제공하기 위해서 타입을 유추한다.ES6의 템플릿 문자열도 지원한다.물론 객체 타입은 중첩 객체에 대해서도 생성할 수 있다.따라서 객체 타입 안에 객체 타입이 있다고 말할 수 있다.