react (3) 썸네일형 리스트형 (상태 관리) useReducer로 상태관리 최적화 5월부터 참여하고 있는 프로젝트는 S 보험사에 납품되는 C/S Application의 커스터마이징 작업을 수행하는 프로젝트입니다. 그러나 어제 대상포진 발생으로 인해 긴급 휴가를 내야 했습니다. 오늘은 휴가를 내고 병원에 가서 치료를 받으며, 일보의 후퇴의 마음으로 이번 기회에 '계약서 관리 시스템' 프로젝트 코드를 회고하는 시간을 가지려고 합니다. 저는 지금까지의 저의 블로그를 통해 '계약서 관리 시스템' 의 프론트엔드 개발자로서 사용성 관점에서 UI 개선 작업에 대한 회고를 작성했습니다. 이번에는 코드적인 리뷰를 통해 개선해본 사항들을 정리하고자 합니다. 특히, 이번 주제에서는 useReducer를 활용한 깔끔한 상태 관리 방법에 대해 다루어 보려고 합니다. 이는 계속해서 하게 될 프로젝트의 효율성을.. [React] 화살표 함수와 return 문 소괄호 처리 JSX 문법에서 return문을 사용할 때 그 뒤에 소괄호를 사용해야 하는 규칙이 있다. (리액트 공식 문서에서는 해당 내용을 확인하지 못하였으나 공식문서에 나오는 예제 코드나 다른 검색 내용들이 그러한 규칙이 있다고 명시한다.) const Features = () => { return ( ); }; 위의 코드에서 return 문 뒤에 소괄호를 적어 주었다. return 문 뒤에 소괄호를 넣는 이유는 어떤 요소를 반환하는지에 대한 가독성을 높이기 위함이라고 한다. 그리고 JSX에서 return 문 뒤에 소괄호를 넣는 용법이 있다. (참고 James Nelson, 2016년 8월 11일, “왜 자바스크립트의 return 문에 괄호를 사용하는가?(Why Use Parenthesis [sic] on JavaS.. (React 오류) Assign array to a variable before exporting as module default HA(Hire Assesment) 1차 리액트로 간단한 썸네일 뷰와 라우터 기능을 구현하는 것이다. 결과는 사실 좋지 않다. 1. 정상적인 작동 기능을 구현하였어도 컴포넌트를 통해서 썸네일 이미지를 map함수를 사용 해서 보여줘야 하는데 자바스크립트와 html 지식이 혼재되고 props으로 무엇을 받아야 하는지 감을 잡지 못해서 그냥 바로 return 안에서 썸네일 이미지를 map함수로 표시해 주었다. 2. 자정을 40분 넘긴 지금. 여전히 테스트 결과는 100%로 나오지 않지만 테스트 기준에 어느정도 부합하게 컴포넌트도 사용했다. =========== 리액트 에러메세지가 많이 나와서 그 부분을 정리해 두려고 한다. Assign array to a variable before exporting as mo.. 이전 1 다음
