본문 바로가기

전체 글

(204)
blob/json 형태로 리턴받은 데이터를 엑셀 파일로 추출하기(Get 방식 /Post 방식) 목적 : 테이블 데이터를 엑셀로 Export 방법1) 프론트에서 처리 -> UI 상 보여지는 테이블 데이터를 그대로 엑셀 추출 방법2) 백엔드에서 처리 -> 프론트에서 가공되지 않은 원본 데이터를 추출 1. 프론트 처리 엑셀 처리를 위한 라이브러리 사용 https://www.npmjs.com/package/xlsx xlsx SheetJS Spreadsheet data parser and writer. Latest version: 0.18.5, last published: 2 years ago. Start using xlsx in your project by running `npm i xlsx`. There are 4148 other projects in the npm registry using xlsx...
Next font 실전의 모든것 (local font 적용(Pretendard)/ google-font 적용/ i18n 으로 global font 변경 / 특정 element 만 font 변경) About next/font를 활용한 웹폰트 성능 최적화 ▶️ next/font 의 핵심 기능 1. 폰트 로딩시간 단축 cdn 폰트 사용하는 경우(ex. Google-font) 빌드 타임에 폰트를 다운로드 브라우저단에서 폰트 cdn 으로 요청하지 않음 로컬 폰트 사용하는 경우 자동으로 self-host on Our Next.js server https://localhost:3000/_next/static/media/1asdfisdfjsdflsdji.p.woff2 2. Fallback 폰트가 layout shift 를 발생시키지 않도록 함 Layout shift 폰트 변경에 의해 레이아웃이 변경되는 경우(UX 불편) CSS size-adjust 속성을 사용하면 layout shift 없이 로드가능 adju..
axios GET array params [] 없이 날리기 (axios paramsSerializer 세팅), nullish data 인 경우 날리지 않기(null, undefined 처리) [AS-IS] GET 요청에 params로 array 를 보냈더니 이렇게 갔다 Network payload 탭 Request URL http://myapi.com/order?status[]=Confirmed&status[]=ReqShipping&status[]=Allocation&status[]=Packed [TO-BE] API 서버에서 원하는 형식은 다음과 같다 http://myapi.com/order?status=Confirmed&status=ReqShipping&status=Allocation&status=Packed [TO-DO] 1. qs 라이브러리 설치 query string 관련 형식 맞추기 편리하게 함수 제공하는 라이브러리임 https://www.npmjs.com/package/qs npm..