일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 | 30 |
- 렌더링
- 타입스크립트
- 자바스크립트
- Front-End
- mapped types
- useCallback
- 프론트엔드
- rendering
- JavaScript
- react code splitting
- router dom
- 리액트 코드분할
- React
- 자동 배칭
- 렌더링 동작원리
- TS
- lifting state up
- 리액트
- react rendering
- 타스
- state 최적화
- useMemo
- 상태 끌어올리기
- 고급타입
- Interface
- react router dom v6
- TypeScript
- NextJS
- Next.js
- 배칭
- Today
- Total
목록프론트엔드/React (13)
서녕이네 개발단지
유용한 matcher함수 종류 정리 // person.js// 테스트할 함수function getPerson(id) { return { id, email: `person${id}@test.com`, };}module.exports = getPerson; toEqual() - 객체가 일치한지 검증한다. 웬만한 일치를 비교하려할때 이 메소드를 쓰면 된다.const { getPerson } = require('person'); // 테스트할 함수를 가져옴 test("return a user object", () => { // getPerson(1)의 리턴 결과값이 { 객체 } 값이 같은 경우 true expect(getPerson(1)).toEqual({ id: 1, email:..

JestFaceBook에 의해서 만들어진 테스팅 프레임 워크이다. 최소한의 설정으로 동작하며 Test Case를 만들어서 애플리케이션 코드가 잘 돌아가는지 확인해 준다.단위 (Unit) 테스트를 위해서 이용한다. Jest가 테스트할 파일을 찾는 방법?- 어떠한 파일에 테스트 코드를 작성해놓으면 Jest가 그 테스트 파일을 찾아서 테스트 케이스를 실행해준다. 테스트할 파일을 찾는 방법은? 1. 파일 이름 뒤에 test를 명시해 주거나2. spec를 달아주거나3. 폴더를 만드는데 그 폴더 이름을 "tests"라고 해주면👉🏻 Jest가 알아서 이게 테스트를 위한 파일이구나~ 또는 폴더구나라고 인식하고 찾아서 그 안에 있는 테스트 케이스들을 실행함. Jest 파일 구조- jest에는 de..

오랜만에 포스팅을 한다 (베베 너무 귀욥다) 여태 공부한걸 포스팅 했어야 하는데.. 주기적으로 작성하려고 노력해야지🥲 이번엔 socket 포스팅을하려고 하는데, 예전에 한번 따라만들기로 사용해봤지만 제대로 이해하지 못하고 넘어갔음.. 줍줍 프로젝트에서 소켓을 사용했지만 내가 한게 아니기 때문에 면접에서 소켓 질문이 나왔을때 대답을 못한 나 자신이 원망스러웠다 ㅜ 내가 맡은 파트가 아니라도 공부를 제대로 하자라는 다짐을 다시 하며.. WebSocket? Socket.IO? WebSocket 애초에 둘은 다른 개념이다. 웹소켓은 양방향 소통을 위한 프로토콜이다. 프로토콜은 쉽게 말하자면 서로 다른 컴퓨터끼리 소통하기 위한 약속 정도로 이해하면 된다. Socket.IO 반면에, socket.io는 양방햔 통신..

앞서 포스팅한 내용 중 렌더링 최적화를 위한 방법으로 메모이제이션이 있다는걸 포스팅 했던적이 있다. 🙌🏻 메모이제이션을 사용하는 이유는? 👇🏻 아래 포스팅을 보고 오면 된다! https://seonzzi-honey-factory.tistory.com/5 [React] 렌더링 최적화 React를 사용하면 렌더링 성능에 대해 고민을 해야 하는데, 렌더링 최적화 방법은 다양하겠지만 현재 내가 아는 최적화 방법을 몇 가지 적어보려고 한다. 많이 써보지 않아 익숙하지 않은 친구들 seonzzi-honey-factory.tistory.com 하지만! 이번 포스팅은 이것들을 쓰면 안되는❌ 이유와 과연 메모이제이션이 꼭 필요한가에 대해 포스팅을 하려고 한다. React에서의 Memoization(메모이제이션) 이란? ..