react
-
Parcel로 React 프로젝트 빌드 후 실행 시 src 디렉터리를 참조하지 못하는 문제 해결 과정Today I Learned 2023. 1. 2. 09:26
문제 상황 프로젝트를 배포한 이후로 경로에 '/'가 2개 이상 들어가는 경로를 주소창에 입력할 경우 응답이 200으로 정상임에도 Now Loading 화면에서 화면이 넘어가지 않는 오류가 발생했다. 배포한 이후로 로컬 환경에서도 API 요청 주소만 로컬 백엔드 서버로 바꿔서 build한 뒤 실행하고 있는데, 로컬에서도 똑같은 문제가 발생하는 것이 확인되고 있고, package.json에 프로젝트를 빌드하기 위한 build 명령어를 추가한 뒤부터 해당 오류가 발생한 것을 봤을 때 build와 관련된 문제인 것 같아 추가한 build 명령어를 중심으로 문제를 추적해보기로 했다. 해결 과정 먼저 어느 상황에서 정상적인 화면 출력이 되지 않고 Now Loading이 나타나는지 확인했다. 주소창에 경로를 직접 입..
-
마카오 기프트에서는 되던 게 왜 프로젝트에서는 안돼? - useEffect, Guard ClauseToday I Learned 2022. 11. 9. 15:48
풀리지 않는 문제가 있다면 문제의 범위를 좁혀보자 다음의 소스코드를 보자. 사용자가 게시물 리스트에서 특정 썸네일을 클릭하거나 URI와 path variable로 게시글의 id를 직접 입력할 경우 게시물을 상세 정보를 화면에 출력하는 동작을 수행하는 로 innu3368.tistory.com 지난 주에 UI 컴포넌트에서 fetch해온 상태가 왜 정상적으로 값을 갖고 있지 않고 undefined 상태를 가졌었는지 오전에 있었던 이슈를 통해 알 수 있었다. 이슈를 살펴보기 전에 먼저. React에서는 데이터 가져오기, 구독 설정하기, 수동으로 React 컴포넌트의 DOM을 수정하는 등의 부수 효과들을 Effect Hook 내부에서 수행하도록 하게 할 수 있다. 이때 Effect Hook은 컴포넌트들이 먼저 렌..
-
2년 전에 해보고 싶었던 도전에 발을 내딛다카테고리 없음 2022. 9. 16. 21:05
이번 주 퀘스트 과제 중 주요 컨텐츠 중 하나에는 '나만의 메뉴 만들기'가 있었다. 말 그대로 내가 직접 추가해보고 싶은 콘텐츠를 직접 구상해 React 퀘스트 과제의 컴포넌트 중 하나로 작성하는 것이다. 예전에 카카오 개발자 홈페이지에 들어가서 계정을 생성해본 적이 있었다. 지도는 좋아하고, API라는 걸 직접 써보는 경험이 중요하다고 말로만 듣던 시절에 카카오맵 홈페이지를 둘러보던 중 웹 지도 API를 제공한다는 것을 보았다. '일단 들어가면 이렇게든 저렇게든 쓸 수 있는 방법이 어떻게든 있지 않을까? 싶어 일단 들어가 계정을 생성했었다. 물론 그 시절에는 JavaScript의 J자나 HTTP의 H자도 모르던 시절이었기 때문에 설명서의 내용을 읽어도 도저히 이해를 할 수가 없었다. 동료분이 이번에 외..