리액트 2

[Jest] 리액트 테스트 코드 작성법

리액트 테스트 코드 방법 컴포넌트 트리 렌더링 : 간략화된 테스팅 환경 및 출력값이 확실한 경우 완성된 앱에서의 테스트(엔드 투 엔드 테스트) : 현실적 브라우저 환경 보통 CRA(create react app)로 만든 리액트 앱에는 테스트 환경 준비 완료 App.test.js도 존재 터미널에 yarn test 입력해서 확인 describe : 어떤 기능을 하는지 it : 테스트 코드를 쪼갤 때 가장 작은 단위 expect : 특정값이 예상값과 일치하는지 describe > it > expect jest프레임워크의 toMatchSnapshot / toMatchInlineSnapshot 를 사용하여 데이터 스냅샷 저장 가능 import renderer from 'react-test-renderer&..

TIL 2022.05.18

리액트 간단 기초 정리

**리액트 관련 정리 컴포넌트 구조 -> 파일 간 분리 용이 반드시 preventDefault를 명시적으로 호출 JSX -> 자바스크립트+html? 껍데기 html 뷰는 동적으로 생성 스타일링 - 스타일도 객체로만 들어감 - 기존 css - SCSS npm i node-sass - Styled-components npm i styled-components ex) const div = styled.div`~~~`; // 백틱사용 리덕스 : 계층별 props 전달 x store 생성으로 데이터 사용 action에 반응하여 상태 변경 가능 action(보통 액션 이름 지정할때 대문자+언더바,,) reducer(액션타입 따라 함수로직) store(리듀서 넣어서 호출) dispatch(action으로 상태 업데이..

TIL 2022.04.27
반응형