728x90 728x90 react42 netlify Build script returned non-zero exit code 2 오류 netlify Build script returned non-zero exit code 2 오류 문제 상황 ⚠️Build script returned non-zero exit code 2 기존에 netlify 배포중인 프로젝트의 main branch에 push했고 변경사항이 반영되지 않아서 netlify에 접속해서 확인해보니 위와 같은 오류가 발생했다. 코드 자체에서는 오류가 없었고 검색해보니까 빌드 디렉토리 설정의 오류라고 한다. 그래서 Build setting에서 Build Command도 CI = npm run build로 변경해보고 publish directory도 변경해봤지만 오류는 그대로 발생했다. 잘못된 코드 Build setting을 변경하고 여러번 빌드를 해보니 기존 오류가 아닌 새로운 .. 2023. 6. 6. 리액트 결측치 처리 리액트 결측치 처리 문제 상황 react에서 무한 스크롤 구현 후 테스트 중 특정 포켓몬 번호에서 api호출을 계속 요청하고 응답을 받지 못해 스크롤이 내려가지 않았다. 크롬의 네트워크 탭에 요청 결과를 확인해보았다. 테오시스라는 포켓몬에 대한 요청을 처리하지 못해서 나머지 item들도 불러올 수 없었다. 잘못된 코드 api를 보면 포켓몬 이름 목록을 불러온 후 이름들로 포켓몬 상세 정보를 요청하는 구조이다. 포켓몬 사진과 타입을 활용하기 위해서 pokemon, species라는 api resource 2개를 사용한다. 테오시스라는 포켓몬에 대해서 pokemon resource를 요청할 때는 'https://pokeapi.co/api/v2/pokemon/deoxys-normal'로 요청하고 species.. 2023. 6. 2. 리액트 Encountered two children with the same key 리액트 Encountered two children with the same key 문제 상황 react에서 무한 스크롤 구현 후 api 호출 마다 리스트에 아이템을 추가하는 과정에서 다음과 같은 오류가 발생하였다. list의 item들이 렌더링은 정상적으로 되었으나 콘솔에서 오류가 발생하였다. ⚠️Warning: Encountered two children with the same key, 잘못된 코드 key가 중복되서 생기는 문제라는 것을 직관적으로 파악할 수 있었는데 key관련 코드들을 모두 수정해보았지만 해결하지 못했다. item의 key인 서버로 부터 받아온 id값을 출력해보니 한번 렌더링할 때 중복되는 것은 아니고 api를 다시 호출 할때 기존 key와 중복되는 것 같다. 스크롤의 길이를 보니.. 2023. 6. 1. [2023.05.15 개발 일지] 리액트 skeleton UI 구현하기 [2023.05.15 개발 일지] 리액트 skeleton UI 구현하기 주요 업무 내용 skeleton UI 구현 자바 책 읽기 skeleton UI 구현 포켓몬 리스트를 불러올 때 로딩상태에서 gif를 사용했었다. 이것도 나쁘지는 않지만 허전한 느낌을 지울 수 없고 화면전환이 매끄럽지 않다. 그래서 프론트엔드가 잘 구현된 사이트에서 볼 수 있는 skeleton UI를 구현해보려고 한다. skeleton UI는 사용자에게 로딩중임을 알리고 로딩중에 레이아웃을 유지하여 부드러운 화면전환이 가능하다. 실제 데이터의 형태와 유사한 형태라 어떤 종류의 데이터가 로딩될 것인지 예상하고 다양한 로딩 영역에서 일관된 로딩 표시를 제공하여 일관된 사용자 경험을 제공한다. 처음에는 많이 사용되는 react-loading.. 2023. 5. 15. 이전 1 2 3 4 ··· 11 다음 728x90 728x90
