Front-end8 XLSX 변환하기 XLSX 적용하게 된 이유!현재 회사에 csv로 적용되어 있고, 왜 csv로 했냐고 한다면, 그때 상황이 극박했고심지어 파일의 비밀번호 설 정까지 필요했다.. 백엔드 상황은 여의치 않아서, api로 내려주면 프론트엔드에서 가공해서 내려줘야하는 상황이라,가장 빠르게 적용할 수 있는 선택이 csv를 zip으로 압축시켜 zip에다 암호화 시키는 것! xlsx 파일 암호화를 검토하기엔 시간이 너무 짧아서, 빠른 시간 내에 적용할 수 있는 방법이 이 방법이였다.XLSXCSV통합 문서의 모든 워크 시트에 대한 정보가 들어 있는 이진파일값이 쉼표(,)로 구분된 일반 텍스트 형식.xls 또는 .xlsx 파일을 읽을 수 있는 프로그램에서만 읽을 수 있음여러 텍스트 편집기에서 열 수 있음데이터 가져오는 동안 많은 메모리 .. 2024. 5. 1. 모노레포(pnpm)로 storybook 설치하기 기술 블로그로 시작했지만, 여행블로그 글만 올리고 올해의 첫 기술블로그! 현재 사이드 프로젝트 진행 중인데, 사이드 프로젝트를 진행하면서 몰랐던 부분과 알게된 부분?프로젝트를 어떻게 구성했는가? 하는 부분에 대해 하나하나 천천히 블로그를 써볼 예정이다.현업에서 불편했던 부분을 개선해서 사용해보자 시작한 사이드 프로젝트이기 때문에,현업과 비교를 하는 글이 다수 올라올 수 있다ㅎㅎㅎ 그럼 스타또~😊 현재 현업에서 프로덕트 2개를 관리하고 있는데, 같은 컴포넌트를 2개의 프로덕트 안에서 각각 따로 따로 생성해서 사용하고 있다.사이드 프로젝트는 이러한 어려움을 개선하고자, 성장하고자? ㅎㅎ 시작된 프로젝트이기 때문에, 현업에서 사용하고 싶었는데 사용하지 못했던 것들을 사용해보는 것으로 결정.. 2024. 3. 31. 2023년 기술 블로그 회고 오랜만에 강의를 듣고, 기술 블로그를 써봤는데 기술 블로그 쓰는 건 참 어려운 거 같다... 용어도 모르는 용어가 나오고 하나씩 찾아서 보다 보면, 시간이 금방 간다. 정확히 알지 못하고 글을 쓰게 된다면, 내가 쓴 글을 내가 이해하지 못하는 대참사가 발생한다. 나의 나쁜 습관은 대충 읽기, 대충 쓰기, 대충 이해하긴데 기술블로그를 써야하면 대충 읽기, 쓰기, 이해하기도 고쳐질 수 있을 것 같다. 기술을 이해하고 사용할 수 있는 습관을 들일 수 있는 계기가 되었던 것 같다.. 아직 사실 글을 쓰고도 100프로 이해했다고 자신하지 못하고 있다. 이미 완료되었다고 썼던 내 글을 다시 읽어보니 이해가 가지 않아, 개념에 대해 다시 찾아서 읽어보고 이해하는 시간이 오래 걸렸지만, 기술 블로그를 쓰기 전보다 기술.. 2024. 1. 1. Web Worker 프론트엔드에서 사용할 수 있는 비동기 동작을 찾아보다가, Web Worker를 발견했다. 싱글스레드 기반으로 작동하는 javascript는 싱글스레드의 단점을 보완하기 위해 코드들이 비동기로 실행된다. 그러나 API비동기 실행이 너무 많이 쌓이게 되면 모든 작업의 실행 속도가 느려질 수 있다. 이 문제를 해결하기 위해 나온 것이 바로 워커(Worker) 이다. Web Worker는 Background Thread에서 스크립트를 실행하는 방법이다. UI Thread와는 별개의 Thread를 실행시켜 사용자 인터페이스(UI)를 방해하지 않고 작업을 수행할 수 있다. – Thread란? 어떠한 프로그램 내에서, 특히 프로세스 내에서 실행되는 흐름의 단위를 말한다. 일반적으로 한 프로그램은 하나의 스레드를 가지.. 2024. 1. 1. Redux-saga Redux는 비동기 동작들이 제어하기 어려운데, 비동기 동작을 더 쉽게 만드는 것이 Redux Saga라고 볼 수 있다. Redux Redux에서는 acation을 발생시키면 reducer을 통해 state를 변화시켜 store를 갱신했다. Redux-saga Redux-saga는 action과 reducer사이에서 흐름을 제어하는 미들웨어다. action이 발생하면, reducer가 액션을 처리하기 전에 다양한 작업을 할 수 있다. Redux-saga의 장점 기존 요청을 취소 처리하거나 불필요한 중복 요청을 방지할 수 있다. 비동기 작업을 처리하는데 효과적이다. 특정 액션이 발생했을 때, 다른 액션을 발생시키거나, 리덕스와 관계없는 코드 실행 시 사용한다. 즉, 간편하면서도 깊게 state의 흐름을 제.. 2024. 1. 1. Redux vs Zustand Redux와, Zustand는 React 상태관리 라이브러리로, 두가지 라이브러리 다 Flux 패턴이다. Flux 패턴이란? 단방향 데이터 흐름을 구현하기 위한 클라이언트 사이드 웹 어플리케이션 아키텍쳐 패턴 데이터를 예층 가능하게 하고, 데이터 흐름의 복잡성을 해결하는 장점이 있다. MVC 패턴과, Flux 패턴를 비교를 해보자. MVC 패턴 Flux 패턴 구조 데이터 흐름 양방향 단방향 특징 상태값을 하위 컴포넌트로 전달해주기 위해 불필요한 컴포넌트에 상태값을 선언해야됩니다. 상태값을 store에서 관리하여 필요한 컴포넌트에서만 가져와 사용할 수 있도록 해결합니다. Zustand Redux 복잡한 상태 관리가 필요 없는 작은 규모의 프로젝트에 적합한 가벼운 상태 관리 라이브러리 복잡한 상태 관리를 필.. 2023. 12. 13. 이전 1 2 다음
