주니어에서 시니어로

개발을 하면서 기존 pagination으로 관리되던 리스트 목록을 페이지 넘기지 않고 한 스크롤에서 보기 편하게 됐으면 좋겠다는 요청이 들어왔다. 리스트 목록이 적으면 상관이 없으나, 몇백 개의 리스트를 한 스크롤에 한 번에 불러오면 렌더링 시의 속도 면이나 자원 면에서도 좋지 않다고 판단됐다. 그래서 무한 스크롤로 구현하되, 현재 보고 있는 페이지만 점차 렌더링되도록 하기로 했다. chatGPT에 물어본 결과 현재 사용중인 react 에서는 react-virtualized와 react-window를 많이 사용하고 있는 듯 했다. 그 중 react-window가 용량이 작아 비교적 간단한 구현에서는 유리하다고 생각되어 사용하려고 했다. 하지만 고정 높이를 사용해야 하는 단점이 있었다. 높이의 경우 유동적..

이번에 파일 다운로드 기능을 구현하다가 엄청난 삽질을 하게 돼서 기록 삼아 글을 쓴다. 엑셀 파일이 서버 측에 저장되어 있고, api를 호출하면 서버에서 response로 파일을 보내주고 해당 파일을 다운로드 구현하는 일이었다. 서버 응답은 이런 식으로 샬라샬라 내려옴 구글링을 해보니 responseType을 추가해줘야 한다고 한다. const options = { responseType: "blob", }; 이리저리 검색해보니 responseType: "arraybuffer"로 넣는 사람도 있고 "blob"을 넣는 사람도 있던데 쓰기/수정 기능을 써야 하는 게 아니라면 불변성이 있는 blob을 권장한다고 한다. 읽기 전용이므로 blob으로 넣었다 그리고 불러온 데이터를 new Blob으로 생성해 준다 ..

업무 중 엑셀 파일을 pdf로 작업 변환할 일이 생겼는데, 이걸 코드를 짜서 자동화하면 어떨까 하는 생각이 들었다. 모종의 이유로 그럴 필요가 없어졌지만, 평소 코드로 엑셀파일은 다뤄본 적이 없던지라 알아보면서 알게 된 것들을 한번 정리를 해두려고 한다. 테스트는 리액트로 작성했다. exceljs vs sheetjs 주로 엑셀 관련해서 많이 쓰는 라이브러리는 exceljs와 sheetjs 두 가지가 있었다. 다운로드 수가 sheetjs가 더 많았고, xlsx, csv, txt, html, json 등 지원하는 파일 포맷이 다양해서 sheetjs로 알아보게 되었다. border style을 설정하려면 pro를 구매해야 된다는 말이 있었지만 어차피 파일 변환만 하면 되는 거 아니야? 간단할 것 같은데~ 하는..