리코일 셀렉터를 이용하면서 값이 받아와지기 전에 suspense를 이용하면 로딩 된 후 UI를 표시할 수 있다 하여 Suspense 컴포넌트를 적용했는데 계속 아래와 같은 에러가 떴다. Uncaught Error: Feed suspended while rendering, but no fallback UI was specified. Add a component higher in the tree to provide a loading indicator or placeholder to display. 스택오버플로우에 검색해보니 두 가지 해결책을 주는데 가장 간단한 방법은 해당 오류가 나는 컴포넌트의 상위 컴포넌트에 Suspense를 적용해주는 것. App.js에서 감싸줘도 된다. A React component..

REACT Recoil Selector 공식문서 정의 셀렉터Selector는 아톰atom이나 다른 셀렉터Selector를 입력으로 받아들이는 순수함수다. "A Selector represents a piece of derived state." 셀렉터는 파생된 스테이트derived state의 일부를 저장한다. *순수함수 부수적인 효과가 없는 함수. 즉, 똑같은 입력 값에 대해 항상 똑같은 출력값을 돌려 주는 함수이다. 비동기 통신과 같은 처리는 아톰atom만을 이용해서 하기 어렵다. (별도의 함수에서 비동기 통신으로 data를 받아 atom에 저장해 주어야 한다.) 이런 번거로운 처리를 셀렉터Selector로 한 번에 처리할 수 있다. 셀렉터Selector의 특징 - selector는 read-only ..

카페24 카테고리를 만드려면 아래와 같은 ajax 코드를 사용해야 한다. /** * 카테고리 마우스 오버 이미지 * 카테고리 서브 메뉴 출력 */ $(function(){ var methods = { aCategory : [], aSubCategory : {}, get: function() { $.ajax({ url : '/exec/front/Product/SubCategory', dataType: 'json', success: function(aData) { if (aData == null || aData == 'undefined') return; for (var i=0; i response.json()) .then((data) => { if (data === null || data === 'undef..

카페24 쇼핑몰 쓰면 쓸수록 괴롭기도 하고 진국이라는 생각도 든다. 정말 기능이 많은 어드민을 쓰기 위해 계속 카페24로 작업을 하고 있는데, 개발자 입장에서 소스코드 관리가 안 된다는 점이 너무 괴로웠다. 일단 뭔가 하나 변경하면 별도로 텍스트 파일로 저장해놓고 (주로 노션에) 작업을 해야 했다. 깃허브로 복구를 많이 진행해 본 것은 아니지만 소스코드가 어딘가에 온전히 살아있다는 것이 얼마나 큰 위안을 주는지 개발자들은 알거다. 카페24의 임대형 쇼핑몰은 기본적으로 ftp 를 이용해 배포를 진행한다. 개발자가 아닌 사람들도 쇼핑몰을 쉽게 이용할 수 있도록 만드는 것이 카페24의 특징인데, 모듈-변수 라는 방식으로 각 컴포넌트의 기능들을 이용할 수 있게 해주고 HTML이나 CSS에 지식이 있으면 프로 모..

드디어 리액트 앱을 깃헙 페이지에 배포했다. 배포 과정은 어렵지 않았으나 내부에 http 가 있어 보안 오류 때문에 여러번 수정해야 했다. 그리고 나서 보니 배포는 되었는데 주소로 들어가면 아무것도 보이지 않는 빈 화면이 나온다. 찾아보니 대부분 BrowserRouter 를 쓰는 사람들이다. react github page blank page 로 검색해보니 참고할 만한 스택오버플로우는 다음과 같고 https://stackoverflow.com/questions/54427793/getting-blank-page-after-react-app-publish-in-github Getting blank page after react app publish in github My steps are: npm run b..

api 모듈을 모아둔 컴포넌트에서 export - import 해온 함수를 쓰려고 하니 다음과 같은 에러가 떴다. Attempted import error: '경로' does not contain a default export 이 경우는 export default로 해당 컴포넌트에서 default 로 내보낸 함수가 아닌 다른 함수들을 그냥 쓰려고 하면 나오는 오류로 import axiosLoginAccount from '../../api/apiCommunicate'; 위와 같이 쓰는 것이 아닌 import { axiosLoginAccount } from '../../api/apiCommunicate'; 위와 같이 쓰면 해당 오류가 발생하지 않는다.