편리한 문법을 이용해서 css를 작성하고 추후에 다시 순수 css로 변환해 주는 것다시 말하면 프레임워크의 문법에 맞게 css를 작성하면 사용자에게 배포할 브라우저가 이해할 수 있는 css로 변환이 됨.기본적인 CSS만으로는 중복적으로 작성해야됨브라우저 호환성 위해 필

개인적으로 프로젝트를 하다가 배포하고 싶거나 해야할 일이있다. 이때 내가 해본 방법은 GitHub와 Netlify를 이용한 방법이다.생성한 repository의 Settings에서 GitHub Pages로 이동한다.master Branch로 변경하면 배포하면 얻게될 주

Spread Operator라고 해서 ...을 이용하며 스프레드 오퍼레이터, 스프레드 연산자라고 불린다. ES^에서 새롭게 추가된 내용으로 연결, 복사 등에 활용도가 높다. 기존에서는 배열을 결합하는데 있어 concat 메서드를 많이 사용했다. spread 연산자를 이

오브젝트는 key와 value의 집합체이다.new class 키워드 사용자바스크립트는 동적으로 타입이 runtime(프로그램이 동작하고 있을 때)결정되므로 오브젝트 생성 후 property를 후에 추가 및 삭제 할 수 있다. 변수에 원시형 데이터 (문자열, 숫자)를 할

render() 안에 로그를 확인하여 Component에 이 render 함수가 언제 호출되는지 확인할 수 있다. 코드에 console.log()를 찍고 화면을 refresh 해주면 로그들이 두번씩 찍힌다. index.js에서 StrictMode를 사용하여서이다.St

HTML을 작성할 때, DOM 요소에 이름을 붙일 경우 <div id ="testId"> 와 같이 id 값을 준다. 이렇게 하면 해당 id가 있는 DOM 요소에만 스타일을 따로 적용할 수 있다. 마찬가지로 리액트에서도 DOM을 선택해 직접 접근하기위해 ref를 사

대량의 데이터를 db에 insert할 때 엑셀로 보통 자료를 받는다고 한다.하는 방법은 아래와 같다 😲아래의 사진과 같이 data가 있다고 가정해보자.데이터가 들어있는 첫번째 행에 쿼리를 작성해준다.이때 number" 셀번호 "varchar는'" 셀번호 "'첫번째 셀

프로젝트마다 다른 node 버전이 필요해서 버전 관리가 필요했다.A 프로젝트 - node v10.24.1B 프로젝트 - node v13.14.0Node Version Manager노드 버전을 업데이트하기 위한 패키지로 쉽게 Node.js 버전을 관리할 수 있다. nvm

git을 사용하면 이런 error을 보게 되는 경우가 있다.이는 mac 또는 linux를 쓰는 개발자와 window 개발자가 Git으로 협업할 때 발생하는 whitespace 에러이다.나또한 macOS를 사용하는 분의 코드를 clone 시키고 나의 windowOS에서

Spring 프레임워크를 통해서 개발자들의 겨울이 끝났다. The fact that Spring represented a fresh start after the "winter" of traditional J2EE하지만!!! 설정의 어려움이 크다! Spring을 봄이라고

카프카란? 카프카를 개발 후 링크드인의 데이터 처리 시스템 카프카를 적용함으로서 모든 이벤트/데이터의 흐름을 중앙에서 관리할 수 있게 되었고 서비스 아키텍처가 기존에 비해 관리하기 심플해졌다. Publish/Subscribe 시스템 카프카는 Publish-Subscribe모델을 구현한 분산 메시징 시스템이다. Publish-Subscribe모델은 데이터...

Document.createElementNS() 공식 문서에 따르면 Document.createElementNS() 는 지정된 네임스페이스 URL과 적합한 이름으로 element를 만든다 한다. 좀 더 쉽게 설명하자면 네임스페이스를 사용하여 새 Element 노드를 생

Moment.js는 자바스크립트에서 dates를 다루기 깔끔하고 간결한 API이다. 이를 사용하여 날짜와 시간을 분석, 검증, 조작 표시할 수 있다.Moment.js 홈페이지에 들어가면 아래 사진과 같이 친절히 나와있다. Node와 함께 사용하려면 아래 명령어로 모듈을

https://es6console.com/

https://www.samsungsds.com/kr/insights/TypeScript.html

DataTable을 사용하던 중 가로로 data가 늘어날 시 스크롤을 넣어야했다.하지만 아래의 코드를 사용 할 시 header가 엉망이 되는 문제가 생겼다. 아래의 세가지 방법은 모두 나에게 해결을 해주지 않았다.1\.scrollX 또는 scrollY 매개변수를 사용하

DataTables라이브러리를 이용하여 테이블을 만들었을 때 처음에는 한줄에 모든 데이터가 들어갔다.내가 원하는 것은 숫자 마다 엔터가 되는 것이다.엑셀에서도 물론 엉망으로 뜨고, 글씨 굵게 설정한 설정도 같이 보인다😐만약 테이블에서만 줄바꿈이 필요하다면 아래와 같

예를 들어 string에서 name, age, city 단어를 찾으면 공백으로 하고 싶을 때 아래와 같이 사용해주면 된다.각각의 문자에는 굳이 따옴표를 할 필요는 없다 :ㅇReferencehttps://m.blog.naver.com/PostView.naver?

테이블에 입력된 데이터들을 tfoot에 생성시켜주는 방법을 포스해볼 예정이다.데이터가 db에 매일 저장되는 형식이다. 첫번째는 당일의 데이터만 컬럼별로 sum하는 방식이다.두번째는 컬럼별 첫날부터 당일까지 sum하는 방식이다.그렇기 때문에 tfoot을 두행에 나누어 생

이제까지는 하나의 DataTable을 excel에 export하는 방식을 사용해왔다.따라서 직접 여러개의 테이블들을 하나의 excel에 export하기 위해 사용한 방법을 공유해볼 예정이다.아래의 그림에서 실제 데이터가 들어가는 테이블은 table 1, table 2이