본문 바로가기

전체 글32

ag-grid field 이름에 점(.)이 들어간 경우, valueFormatter의 params.value가 undefined가 되는 현상 배경 회사에서 ag-grid로 데이터표를 만드는 작업을 하고 있었다. 그런데 분명히 db에도 값이 있고, column과 rowdata가 제대로 매핑되고 있고, api 응답을 제대로 받고 있음에도 불구하고 화면에 값이 표시되지 않는 현상을 겪었다. 분석 ag-grid를 사용함에 있어서 data의 값을 정제하기 위해 valueFormatter 코드를 썼었는데, 여기서 params를 콘솔로 찍어보니 params.value의 값이 undefined가 되는 것을 확인할 수 있었다. valueFormatter: (params) => { if (params.value === null || params.value === undefined) return params.value; return FormatStringPoin.. 2023. 11. 21.
npm, yarn npm npm 홈페이지에서 설명하는 npm에 대한 정의는 다음과 같다. npm is the world's largest software registry. Open source developers from every continent use npm to share and borrow packages, and many organizations use npm to manage private development as well. 해석하자면 npm은 세계 최대의 소프트웨어 저장소이다. 모든 대륙의 오픈 소스 개발자들은 npm을 사용하여 패키지를 공유하고 대여하며, 많은 기관들이 개인적인 개발을 관리하는데 npm을 사용한다. npm은 자바스크립트/타입스크립트 프로그래밍 언어를 위한 패키지 관리자이고, 자바스크립트 .. 2023. 11. 19.
React & Spring 환경에서 쿠키값 저장 프론트는 react, 백엔드는 spring으로 쿠키를 저장하는 기능을 구현하고 있던 중(백엔드와 프론트엔드 사이의 통신은 axios 사용), 분명히 백엔드로부터 Set-Cookie 값을 전달 받았음에도 불구하고, 쿠키값이 Application 탭의 Cookie에 저장이 되지 않는 일이 있었다. 여러 시행착오 끝에 원인을 파악하여 문제를 해결하였고, 그 과정을 기록으로 남기고자 한다. 스프링 코드 Cookie idCookie = new Cookie("memberId", String.valueOf(member.getUserEmail())); // response에 쿠키 정보를 담는다. // 쿠키의 이름은 memberId이고, 값은 회원의 id를 담아둔다. idCookie.setHttpOnly(true); /.. 2023. 11. 8.
CORS 에러란 무엇인가? 웹개발을 하다보면 아래와 같은 오류를 종종 볼 수 있다. 아래 오류는 CORS 오류에 대한 메시지로, CORS 오류는 보안 상의 이유로 브라우저에서 발생하는 오류이다. CORS 정의 CORS란 Cross-Origin Resource Sharing의 약자로 교차 출처 리소스 공유를 의미한다. HTTP 헤더를 사용하여 한 출처에서 실행 중인 웹 어플리케이션이 다른 출처의 특정 자원에 접근할 수 있는 권한을 부여하도록 브라우저에서 알려주는 메커니즘이다. 보안의 이유로 브라우저는 (자바)스크립트에서 시작한 교차 출처 HTTP 요청을 제한한다. XMLHttpRequest와 FetchAPI는 동일 출처 정책을 따른다. CORS는 서버와 클라이언트 간의 상호 작용에서 중요한 역할을 한다. 즉, 이 API를 사용하는 .. 2023. 10. 8.
728x90