질문있습니다. const modelListData = ['model1', 'model2', 'model3'] const [rowData, setRowData] = useState([]) useEffect(() => { setRowData(modelListData) }, [modelListData]) 위 처럼 작성을 한 후에 테스트를 돌리면 그냥 터미널이 멈춰 버립니다... 그런데 setRowData(modelListData)이걸 주석처리 하거나 배열이 아닌 타입의 값을 넣을 경우에는 테스트가 제대로 동작합니다. 혹시 test코드에 뭔가를 작성을 해주어야 할까요? ㅠㅠ 테스트 코드는 아래처럼 작성하고 돌려보았습니다. describe('모델리스트 컴포넌트 및 기능 테스트', () => { test('테스트 왜 안됨?', () => { render(<ModelList />) }) }) 그런데 터미널은 여기서 아무리 기다려도 다음으로 넘어가지 않습니다. 단 setRowData에 배열이 아닌 타입의 값을 넣을 경우에는 무리없이 잘돌아갑니다 ㅜㅜ RERUN src/modelManager/components/ModelList.tsx x2 · src/__test__/modelList.test.tsx (1) · 모델리스트 컴포넌트 및 기능 테스트 (1) · 테스트 왜 안됨?
안녕하세요. 강의 재밌게 듣고 있습니다! App.jsx에서 import ProductPage from "./pages/ProductPage" 부분에서 실제 코드는 index.jsx에 작성되어 있는데 디렉터리명인 ProductPage로 경로를 지정해도 동작하는 이유가 궁금합니다.
안녕하세요. 정환님 드디어 강의도 마무리되어가는데 살짝 이해가 안된 부분이 있습니다. URLSearchPrarms 를 통해 query param를 파싱하는 부분을 캐싱하는 부분에서 window.location.search 는 딱 한번만 바뀌고 거의 바뀌지않을 것 이라고 이야기하셨는데 같은 페이지에서 navigate가 흔히 있는 요구사항이 아닌가요? 저희가 사용하는 Router의 useNavigate를 통해 화면간에 이동할 때마다 변하는 값으로 알아서 넣어두는게 더 이상적이라고 생각하고 실습을 진행했습니다. 저희 예제에서는 cart 페이지에서 cart 로 이동할 비지니스 요구사항은 없어서 괜찮지만 예를들어 다른 상품이 담겨있는 장바구니로 이동하는 요구사항이 있다면 /cart?productId=CACDA421 => /cart?productId=CACDA423 deps에 window.location.search 를 넣어두는게 안전해보이는데 최적화가 필요한 부분이었을까요?
안녕하세요. Reducer는 ReactJS에서 제공하는것을 거의 잘 안써왔었는데 한번 활용해봐야겠다는 마음이들었던 강의였습니다. 이번 4.3장(리듀서 훅) 수강하고 궁금한 부분은 Validate처리가 일반적으로 dispatch만으로 해소가 안되는 부분을 직접 reducer를 호출해줘서 처리하는 부분을 봤습니다. 직접 리듀서를 호출하는 형태가 조금 리듀서를 만든 의도와 다른 방향같기도한데. 이전상태를 이용해서 앞으로의 상태를 업데이트하고 싶을때 dispatch를 사용해야한다면 어떻게 처리되야 조금 더 이상적인 방향이라고 생각하시나요?
Context 내부 원리를 알 수 있어서 도움이 많이 되었습니다. 궁금한건 Context가 이렇게 동작하구나하고 이해해도 되겠죠? " EventEmitter 패턴이 Context의 원리이다 " 라고 이해하고 넘어가고 싶은데 정환님은 이러한 정보를 어떻게 알 수 있었을까요? 리액트 공식 홈페이지에 이러한 내용이 있을까요?
안녕하세요. 리액트 테스트 관련 좋은 강의를 제공해주셔서 감사합니다. 수업 듣고 테스트 코드를 작성 시에 console.error로 wrapped in act 오류가 표시되어 문의드리게 되었습니다. 여러 질문들도 찾아보고... 구글링도 해보며 방안을 찾아서 테스트코드가 성공하는 것 까지는 봤으나, 로그에 첨부드리는 이미지와 같이 표시되어지고 있습니다... useEffect에서 state변경시에 발생되는 것 같은데.. 이부분은 어떻게 처리해야할가요..?ㅠ 며칠을 찾아보고.. 제공해주신 소스코드도 확인해봤지만... 다른 부분이 없어 문의드립니다. (추가로.. 첨부 주신 코드의 리액트버전을 제가 구성하는 버전으로 구성 후 테스트 진행 시에 저와 동일한 결과가 나오는 것을 확인했습니다.) 감사합니다.
안녕하세요 다름이 아니라 공유해 주신 소스를 기반으로 코드 리포지토리: https://github.com/things-not-learn-from-bootcamp/form-practice/tree/use-reducer-fancy-typing 의 소스를 실행 시켜 보았는데요 위 와 같은 에러가 계속 발생해서요 아무리 구글 검색을 해도 해결이 안되어 문의 드립니다. 또 한가지 더 문의 부탁드립니다 위 동일한 레파지토리 소스를 실행시켰을 빌드해서 실행시켰을 때 위 처럼 빨간줄이 생겨서요 좀처럼 이해가 안되어서 같이 문의 드립니다. 바쁘신데 죄송하면 문의 부탁드립니다. 감사합니다.
안녕하세요 저는 리액트만 4년차 개발자인데요.. 기존에 리액트 강좌를 무지 많이 수강했음에도 아직도 많이 부족하다 싶어서 강사님의 강좌를 듣게 되었는데 많은 도움이 되고 있어서 너무 감사합니다. 참고로 아래와 같은 과정을 수상신청을 아래와 같이 했습니다. 부트캠프에서 알려주지 않는 것들 (리액트 렌더링 최적화 편) 2편 부트캠프에서 알려주지 않는 것들 (리액트) 1편 클론코딩에서 알려주지 않는 것들 (시스템 이론과 DB) 1편 실전 연습으로 익히는 고급 타입스크립트 기술 다만 부탁이 있어서요 다름이 아니라 좀더 세심하게 코드를 보구 싶어서요 혹시 강좌중 부트캠프에서 알려주지 않는 것들 (리액트) 1편 에서 섹션 3. Form 컴포넌트로 배우는 실전 기술 강좌의 소스를 과정별로 브랜치로 구분한 레파지토리는 없는지 해서요.. 강좌별로 들으면서 분석하면 많은 도움이 될거 같아서 문의 드립니다. 정 안되면 최종 소스라도 부탁드립니다. 위에 강좌 신청을 좋게 봐 주셔서 부탁드립니다. 공개가 힘드시면 메일이라도 부탁드리면 안될런지요? manhattansky73@gmail.com 입니다. 감사합니다.
안녕하세요 이번에 '따라하며 배우는 React Testing' 강의를 수강중인 박동준이라고 합니다. 이번 강의에서 여행상품 앱 만들기 파트에서 진행하는 방법들을 정리하여 개인 포트폴리오로서 활용하고 싶습니다. 모든 소스코드를 올리는것이 아니라, 방법적인 부분들을 정리하고 회원가입 또는 게시글 작성 및 댓글 등 간단한 CRUD 로직으로 배운 개념을 적용하여 코드 및 방법들에 대해서 올리고자 합니다. 혹시 이런 방법으로 제 개인 github에 업로드 해도 되는지 궁금합니다!
안녕하세요. TDD의 Green, Red, Refactor 파트(9:40)에서 리팩터링을 진행하시면서 onPageNumberClick 함수를 useCallback으로 감싸서 렌더링이 다시 될때 이 함수가 두번 생성되지 않도록 한다고 하셨는데 이 부분이 잘 이해가 가지 않아서요. 설명해주신걸로 유추해보면 useCallback으로 감싸면 함수가 한번만 생성되는 것 같은데 useCallback을 사용했을때와 사용하지 않았을 때 차이에 대해서 조금 더 설명해주실 수 있을까요?
