반응형 분류 전체보기50 [라이브러리] exceljs를 활용하여 JS데이터를 엑셀 파일로 추출해 보자. [라이브러리] exceljs를 활용하여 JS데이터를 엑셀 파일로 추출해 보자. 서론 사내에서 React 환경에서 CMS 개발 파트 담당하다보니, 드디어 테이블 데이터를 추출하여 엑셀 파일로 다운로드 받을 수 있는 기능을 구현하게 되었다. 넘넘 신나고 재밌서..! 😎 exceljs란? exceljs란 javascript에서 데이터를 엑셀로 추출 및 조작할 수 있는 node 환경 라이브러리로, 특정 셀의 스타일을 커스텀하고 합칠 수 있는 장점이 있는 라이브러리이다. 공식문서 링크 npm exceljs 링크 https://www.npmjs.com/package/exceljs exceljs Excel Workbook Manager - Read and Write xlsx and csv Files.. Latest .. 2023. 6. 28. [React] 리액트 차트 라이브러리 Recharts.js 적용기(React chart library Recharts.js) [React] 리액트 차트 라이브러리 Recharts.js 적용기(React chart libray Recharts.js) Recharts.js란?Recharts.js란 리액트 기반 차트 라이브러리이다. 어쩌다보니 다니는 회사마다 CMS나 어드민 페이지만 주구장창 개발하게 되어서 그런지 그전에는 Chart.js를 사용했었는데 이번 회사에서는 Recharts.js를 사용하게 되었다. 공식문서 링크https://recharts.org/en-US 설치방법$ npm install recharts 적용예제 나의 경우 기간 설정에 따라 차트 데이터가 동적으로 Fetching 되어야 하고, 범례를 클릭할 때마다 차트가 전시/비전시 처리가 되어야 했다. 그리고 X / Y 축, 범례, 툴팁, 그리드 등을 ‘모.두’ 커스.. 2023. 6. 27. [라이브러리] qs 모듈을 이해해 보자. (URL query string) [라이브러리] qs 모듈을 이해해 보자. (URL query string) qs 모듈이란? 보통 우리가 어떠한 조건값으로 데이터를 검색이나 필터링을 할 때, 혹은 API URL에 query string의 값을 전달하거나 히스토리를 관리 할 때 그 query string을 파싱(parsing)하거나, 스트링화 할 수 있는 라이브러리이다. qs 모듈 npm 공식 문서 링크 https://www.npmjs.com/package/qs query string(쿼리 스트링)이란? 쿼리 파라미터(querystring)을 URL endpoint 뒤에 붙여 추가적인 정보 조회를 서버 측에 요청 하는 것이다. 정해진 endpoint 주소 이후에 물음표(?)를 사용하여 쿼리 파라미터(쿼리스트링 혹은 key)의 시작점을 알린.. 2023. 6. 26. [VSCode] 글씨체를 멋지게 바꿔 보자.(Fira-Code) [VSCode] 글씨체를 멋지게 바꿔 보자.(Fira-Code) 1. 설정 방법 Fira-Code 공식문서 https://github.com/tonsky/FiraCode GitHub - tonsky/FiraCode: Free monospaced font with programming ligatures Free monospaced font with programming ligatures. Contribute to tonsky/FiraCode development by creating an account on GitHub. github.com 위 링크로 이동하여 폰트를 다운로드 받은 뒤 폰트를 PC에 설치 후 VSCode setting.json 설정한 뒤 재부팅 할 것 settings.json "editor.. 2023. 5. 15. [JS] 모던 자바스크립트 Deep Dive 스터디 - 07장. 연산자(산술 연산자) 내맘대로 정리하고 공부하는 모던 자바스크립트 Deep Dive 스터디 [JS] 모던 자바스크립트 Deep Dive 스터디 - 07장. 연산자(산술 연산자) 07장. 연산자 // 산술 연산자 5 * 4 // 20 // 문자열 연결 연산자 'My name is ' + 'Lee' // 'My name is Lee' // 할당 연산자 color = 'red' // 'red' // 비교 연산자 3 > 5 // false // 논리 연산자 true && false // false // 타입 연산자 typeof 'Hi' // string 7.1 산술 연산자 산술 연산자는 수학적 계산을 수행해 새로운 숫자 값을 만든다. 산술 연산이 불가할 경우, NaN을 반환한다. 7.1.1 이항 산술 연산자 2개의 피연산자를 산.. 2023. 5. 15. [JS] 모던 자바스크립트 Deep Dive 스터디 - 06장. 데이터 타입 내맘대로 정리하고 공부하는 모던 자바스크립트 Deep Dive 스터디 [JS] 모던 자바스크립트 Deep Dive 스터디 - 06장. 데이터 타입 06장. 데이터 타입 데이터 타입은 값의 종류를 말한다. JS의 모든 값은 데이터 타입을 갖는다. JS는 7개의 데이터 타입을 제공하며 원시타입과 객체타입으로 나뉜다. 원시타입 숫자(Number) : 숫자, 정수, 실수 구분 없이 하나의 숫자 타입 문자열(String) : 문자열 불리언(Boolan) : 논리적 true / false undefined null : 값이 없음을 의도적으로 명시할 때 Symbol 객체타입 객체, 함수, 배열 6.1 숫자 타입 JS는 하나의 숫자 타입만 존재한다. 모든 수를 실수로 처리 > 정수만을 표현하기 위한 데이터 타입이 별도.. 2023. 5. 10. [JS] 모던 자바스크립트 Deep Dive 스터디 - 05장. 표현식과 문 내맘대로 정리하고 공부하는 모던 자바스크립트 Deep Dive 스터디 [JS] 모던 자바스크립트 Deep Dive 스터디 - 05장. 표현식과 문 05장. 표현식과 문 5.1 값 값이란? 표현식이 평가되어 생선된 결과를 말하고 평가란 식을 해석하여 값을 생성하거나 참조하는 것. 모든 값은 데이터 타입을 가진다. 메모리에 저장된 값은 데이터 타입에 따라 다르게 해석된다. 예) 메모리에 저장된 값 0100 0001은 숫자 타입은 65, 문자 타입에선 A로 해석 된다. 변수는 값을 저장하기 위해 확보한 메모리 공간 or 메모리 공간을 식별하기 위해 붙인 이름으로 변수에 할당되는 것은 값이다. // 10 + 20은 평가되어 숫자 값 30을 생성한다. 10 + 20 // 30 const sum = 10 + 20 .. 2023. 5. 9. [JS] 모던 자바스크립트 Deep Dive 스터디 - 04장. 변수 내맘대로 정리하고 공부하는 모던 자바스크립트 Deep Dive 스터디 (언젠가 완독하겠지 ㅎㅅㅎ..) [JS] 모던 자바스크립트 Deep Dive 스터디 - 04장. 변수 4.1 변수란 무엇인가? 왜 필요한가? 변수란 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는, 그 메모리 공간을 식별하기 위해 붙인 이름을 말한다. 프로그래밍 언어에서의 변수는 값을 저장하고 참조하는 메커니즘으로, 값의 위치를 가리키는 상징적인 이름이다. //변수는 하나의 값을 저장하기 위한 수단 var userId = 1; var userName = 'Lee'; //📌 객체나 배열같은 자료구조를 사용하면 여러 개의 값을 그룹화하여 하나의 값처럼 사용할 수 있다. var user = { id: 1, name: 'Lee' };.. 2023. 5. 8. [취업후기] 비전공자 웹퍼블리셔 독학으로 프론트엔드 개발자 준비 2편(공부 방법 / 포트폴리오 / 이력서 / 면접 ) [취업후기] 비전공자 웹퍼블리셔 독학으로 프론트엔드 개발자 준비 2편(공부 방법 / 포트폴리오 / 이력서 / 면접 ) 1. 서론 지난번 비전공자 웹퍼블리셔 독학으로 프론트엔드 개발자 준비 1편에 이어서 2편을 열심히 쪄왔다. 사실 더 일찍 오고싶었으나 너무 바빴다 ㅠㅠㅠ.. 이 이상 늦으면 아예 업로드 자체를 못할 것 같아서 주말에 후다닥 작성🥹 혹시나 1편 강의 추천을 안 보신 분들은 아래 링크로 들어가서 보시면 됩니다! https://heeeming.tistory.com/entry/%EC%B7%A8%EC%97%85%ED%9B%84%EA%B8%B0-%EB%B9%84%EC%A0%84%EA%B3%B5%EC%9E%90-%EC%9B%B9%ED%8D%BC%EB%B8%94%EB%A6%AC%EC%85%94-%EB%.. 2023. 4. 16. 이전 1 2 3 4 5 6 다음 반응형
