박주니 개발 정리

힌트를 얻게 해준 유튜브 영상 https://www.youtube.com/watch?v=V27XkmVPqYQ 설명전) 노마드코더 20억명 감당한는 법 보면서 api 호출해서 캐싱을 하게되면 먼저 캐싱에 데이터가 있는지 확인하고 있으면 캐싱에서 가져오고 없으면 api 호출하는 방법을 알게되었습니다. 저는 주로 redux에서 해당 유저 정보 데이터 및 관련 데이터만 관리하고 cookie에서는 로그인 상태 확인하는 정도로만 했는데 고민이였던 부분이 중복 api 호출할 경우 서버 부하로도 이어질 수 있기 때문에 어떻게 하면 프론트에서 효율적으로 api 호출 제어할 수 있을 지 찾아보게 되었습니다. 찾아보는 과정에서 react-query가 지금 과정과 동일한 방법으로 진행한다는 것을 알게되었습니다. 1. reac..

설명전) react 소스보기 숨기기는 개발자도구>Sources>Page에서 현재 본인이 작성한 코드가 노출된 것을 가린다는 의미입니다. 노출이 되었을 때 개발이 어떻게 되었고 어떤 api를 이용해서 진행되었는지 다 확인이 되기 때문에 보안상으로 숨겨야합니다. 저는 window 환경에서 작업을 기준으로 설명한 것이니 혹시 맥북으로 진행하셨으면 현재 내용은 참고하는 정도로만 진행해주시길 바랍니다. 1. package.json에서 scripts 안에 있는 build내용을 GENERATE_SOURCEMP=false를 추가합니다. "scripts": { "start": "react-scripts start", "build": "set \"GENERATE_SOURCEMAP=false\" && react-script..

설명 이유) 보통 엑셀 업로드 기능을 관리자페이지에서 데이터를 시각적으로 필요한 데이터를 출력하기 위해 엑셀 업로드 기능을 만드는데 예를 들어서 결제 완료, 결제 대기등 색깔 구분을 하지 않으면 구분하기가 어렵습니다. 또한 exceljs 버전 업데이트에 따라서 richText 적용 방식이 달라진 부분도 있어서 공유하기 위해서 설명을 적게 되었습니다. 가운데 정렬이랑 테두리 설정하는 것은 chatgpt에 물어보면 그대로 붙여서 사용하시면 가능하기 때문에 따로 설명은 하지 않았습니다. 참조 : 엑셀 업로드시 데이터 셋팅하는 방법 참고 (rowData) richText 사용하실 때는 별도 설치하실 것은 없습니다. rowData에서 특정값에 richText를 사용해서 색깔 구분을 합니다. const rowDat..

설명 이유) 마켓을 운영하다보면 리스트를 확인할 때 해당 상품에 이미지도 엑셀에 필요할 때가 있습니다. 저는 이미지를 ipfs형식으로 전환해서 불러오기 때문에 에 src로 url 넣으면 이미지가 나오지만 엑셀 적용은 다른 방식이기 때문에 공유하게 되었습니다. 먼저 이 설명을 듣기 전에 엑셀 업로드시 데이터 적용 방법 참고하시기 바랍니다. 엑셀 업로드해서 데이터 적용하는 방법은 동일합니다. 그부분에서 rowData에 image_url을 추가해서 삽입하는 과정이라고 생각하시면 됩니다. 1. ipfs url 을 따로 데이터를 rowData에서 제외해서 진행합니다. const assetKeys = Object.keys(asset); assetKeys.forEach((id, i) => { console.log("..