const store = {}
변화 ⇒ 수정, 추가 (배열 요소의 추가, 삭제)
데이타 ⇒ 값과 형태(스키마)
무언가 사건이 일어났을 때 무언가를 한다.
Zod
⭐ this
자바스크립트 this에 관련해서 면접때 물어보면 막힘없이 쭉쭉 나와야한다.
1초의 딜레이도 없이 달달달달 나와야한다. 프론트엔드 개발자의 숙제..같은것..
- this ⇒ window 객체를 가르킨다.
- 소유객체를 가르킨다 .bar() .foo() ⇒ foo 안에서 this는 bar를 가르킨다.
실행 컨텍스트. - this ⇒ 인스턴스 객체일때 생성자 안에서 인스턴스 객체를 가르킨다.
new Person ⇒ constructor() ⇒ this는 {} 만들어진 인스턴스 객체
강제 연결된 객체
-
함수의 bind 메소드로 연결된 객체
foo.bind({ bar: true }), foo() ⇒ foo 함수 안에서 this 는 { bar: true } 객체를 가르킨다. -
함수 호출 함수, 모든 함수는 호출방법이 3가지 있다.
- () 연산자호출 ⇒ 제일 많이 사용함 foo()
- call() 메소드 호출 ⇒ foo.call({})
- apply() 메소드 호출 ⇒ foo.apply({})
테스트코드
내가 알고있듯이 테스트코드 작성하면 안되고 인터페이스 기반으로 테스트코드 작성해야 한다.
구현을 보고 테스트코드를 작성하면 안된다.
인터페이스도 테스트코드 생각하면서 차근차근 작성할 것.
성공을 전제로 하는 테스트가 있고 실패를 전제로 하는 테스트가 있다.
모든코드들이 테스트하기 힘들다. 수동으로 해야될때도 있다. UI 다루는 테스트코드가 테스트코드 하기 힘들다.
내가 구현체를 작성하고 테스트 코드를 작성해보며 테스트 코드의 형태를 연습을하고 비로소 테스트를 먼저 작성을 할 수 있다. 테스트코드를 짤때 AI를 적극적으로 활용해보는것이 좋다.
JEST
유니테스트 라이브러리
내가 만든 앱안에서 함수, 개별컴포넌트 등 단위 하나하나 테스트하는것을 유니테스트라고 한다.
jest는 유닛테스트 라이브러리 내가 만든 코드를 하나하나 동작에 대해서 테스트를 하고
playwright는 위에 처럼 관심이 없고 이미 실행되고있는 앱을 사용자관점에서 바라봐서 테스트를 한다. 그걸 E2E 테스트 이다.
유닛테스트가 통과해서 E2E테스트가 될일이 없고 E2E테스트가 통과해서 유닛테스트가 통과 될일 없다. 서로 보장되지 않는다.
vite랑 jest랑 궁합이 잘 맞지는 않다.
Snapshot testing with Jest
스냅샷은 그 순간을 찍을 수 있는 것.
Snapshot Testing은 각각의 변화를 찍어서 따로따로 찍어서 비교를 해서 테스트를 할수 있다.
JSON.stringfy(obj) = 직렬화하는 함수
직렬화 함수를 올리는 함수가 JSON.parse(obj)이다.
⭐ 직렬화(Serialization)
- 정의: 객체나 데이터 구조를 바이트 스트림으로 변환하는 과정.
- 역직렬화: 바이트 스트림을 다시 원래 객체로 복원하는 과정.
목적
- 데이터 전송: 네트워크를 통해 객체를 주고받기 위해 사용.
- 영속성: 객체를 파일이나 데이터베이스에 저장하기 위해 사용.
활용 예
- 웹 API, 소켓 통신, 파일 저장 등에서 사용.
직렬화 (개발자라면 꼭 알고있어야하는 개념): 어느 컴퓨터환경 속에서나 다룰수있게 하는 작업
소프트웨어 개발에서 직렬화(Serialization)란 객체나 데이터 구조를 저장하거나 전송할 수 있도록 연속적인 바이트 스트림으로 변환하는 과정을 의미
Testing Library
CoreAPI: Queries, Actions, Advanced가 있다
리액트 테스트 라이브러리는 버츄얼돔까지 테스트 할수 있음.
리액트 컴포넌트를 렌더링을 시킬때 Jest는 직렬화시켜야하는데 리액트 테스트라이브러리는 그려진 스크린에 대고 한다. 브라우저를 추상화해놓은 객체가 screen이다. screen안에 사용되는 메소드를 이용해서 테스트를 할 수 있다. 예시) geByLableText
크롬에서만 된다고 되는게 아니다.
엣지, 사파리, 파이어폭스 등 다양하기 때문에 테스트는 여러 브라우저에서 돌려봐야한다.
Playwright
playwright는 jest처럼 구현 세부사항에 전혀 관심이 없다.
오로지 웹페이지가 잘 돌아가는지 사용자 관점에서의 테스트
