728x90 분류 전체보기204 fireEvent와 userEvent 구현체 살펴보기 목차 userEvent는 fireEvent를 사용하여 구현되어있었다. userEvent는 async, await가 왜 필요한 것일까? Testing Library를 공부하던 중 fireEvent와 userEvent의 다른점을 학습하면서 fireEvent는 왜 필요한 것일까라는 궁금증을 시작으로 탐구하게 되었다. userEvent는 fireEvent를 사용하여 구현되어있었다. 이 두가지를 비교하거나 소개하는 오래된 글들을 보면 userEvent가 fireEvent로 구성되어있다고 이야기합니다. 하지만 이는 버전에 따라 맞을수도 있고 틀릴수도 있습니다. React-testing-library: fireEvent vs userEvent 먼저 fireEvent의 구현체를 확인해보겠습니다. 실제 fireEvent.. 2024. 1. 21. 2023 회고 2023년을 돌아보며 참여했던 활동과 영감받은 생각들을 정리해보았습니다. 목차 활동 DevOcean 스터디 OSSCA - 한국인 모두가 볼 수 있도록! MDN 문서 한글화 글또 9기 생각 돈보다 시간 갖기 위해 가진 것을 포기하기 고민보다 실패를 활동 DevOcean 스터디 지난 4월 즈음 우연히 기회가 되어 React-Native 스터디에 참여하게 되었다. 6월 말까지 진행하는 스터디로 주 1회 주말마다 모여서 북 스터디와 사이드 프로젝트를 진행했다. 그동안 온라인으로 스터디했지만, 오프라인으로 진행한 스터디는 처음이었다. 스터디를 통해 React-Native책을 완독할 수 있었고, 재밌고 좋은 사람들과 대면으로 스터디하다보니 면접에 대한 부담이 많이 줄었다. 스터디의 메인이었던 React-Native.. 2023. 12. 24. 컴포넌트 상태 변이 흐름에 대한 고찰 목차 도대체 어디서 상태 변이시키는거야? 상태 변이 흐름 개선하기 상태 변이 일원화 상태 돌려놓기 부적절한 UX 마무리 도대체 어디서 상태 변이시키는거야? 컴포넌트 상태가 복잡해져서 예상치 못한 변이 흐름이 생기지 않을까 고민하셨나요? 아니면 의도하지 않은 상태로 변이되어서 당황하신 적이 있으신가요? 컴포넌트에 기능이 많아지고 비즈니스 로직이 복잡해질 수록 더 많은 상태가 생기게 됩니다. 특히 api 호출에 의존되는 경우 예외처리까지 고려해야합니다. 생각만해도 사이드 이펙트로 화면에 이상한 값이 보여질까 걱정되는데 여러분들은 어떻게 상태 변이 흐름을 관리하시나요? 상태 변이 흐름 개선하기 먼저 상황을 가정해보겠습니다. 화면은 필터링, 상품의 목록과 페이지네이션으로 이루어져있습니다. 첫 화면이 렌더링이 완.. 2023. 12. 9. 리액트의 렌더링이란? 목차 우리가 말하는 렌더링 리액트가 말하는 렌더링 Trigger Render Commit 리액트의 화면 그리기 렌더링을 알면 보이는 것들 우리가 말하는 렌더링 프론트 공부를 하다보면 렌더링이라는 어휘를 자주 접하게 됩니다. 이러한 렌더링은 화면을 그리는 작업을 의미합니다. 그 중 브라우저에서 렌더링은 브라우저 렌더링 엔진이 렌더 트리를 만들어 paint하는 것을 의미합니다. 하지만 많은 인기를 얻고 있는 React는 조금 다른 의미로 렌더링을 소개합니다. 리액트가 말하는 렌더링 리액트에서 렌더링은 컴포넌트를 호출하는 것입니다. 하지만 컴포넌트를 호출한다고 무조건 화면을 그린다는 것은 아닙니다. 리액트가 화면을 그리는 과정의 일부가 렌더링이라고 생각하는 것이 이해하기 쉬울 것이라고 생각합니다. 왜냐하면 공.. 2023. 2. 28. 이전 1 2 3 4 5 ··· 51 다음 728x90
