javascript로 외부 통신을 하다보면 callback 지옥이란 단어를 많이 들었을 것이다. 말그대로 무수한 callback으로인해 유지보수하기 어려운코드가 생성되어 지옥에 갇힌다는 것이다. callback지옥을 개선할 수 있는 Promise 중에서도 Promise.all()을 알아보자. 단어의 뜻을 풀어보자면 Promise. + all() (이행한 약속을 전부 실행한다? 이정도로 해석이 된다.) MDN예제를 보자.(https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Promise/all) Promise.all() 메서드는 순회 가능한 객체에 주어진 모든 프로미스가 이행한 후, 혹은 프로미스가 주어지지 않았을 때 ..

프로젝트를 진행하면서 db의 row들을 string으로 받아올 필요가 있었다. PostgreSQL에서 배열함수(집계)를 제공한다. array_agg, array_to_string [table array] name group 효정 오마이걸 모모 트와이스 보나 우주소녀 row를 array로 출력을 하면 [ row들을 배열로 출력 array_agg() ] select group,array_agg(name) from array group by group; 결과 -> {효정,모모,사나} 결과는 {} 배열로 감싸진 형태로 나오게 된다. java에서 string으로 처리를 하려면 array_to_string 함수를 더해서 사용하면 된다. [ 배열을 string으로 출력 array_to_string() ] select..

리액트를 사용하면 data를 양방향으로 바인딩이 가능하다. 리액트 컴포넌가 하나의 데이터를 바라보기 떄문이다. 그렇다면 리액트 데이터를 변경을 하면 데이터가 자동으로 갱신이된다. const [data, setData] = useState({data : "data"}); 리액트는 useState로 데이터를 생성하고 데이터를 props방식으로 공유한다. 데이터를 변경하려면 앞에서 변수로 선언한 setData 를 이용한다. [리액트 데이터 참조방식] 리액튼는 얋은 참조를 반영하여 스프레트 문법인 ...을 통해 데이터를 갱신한다. 이 부분은 나중에 깊게 정리하려 한다. 지금 보려는 방식은 useState의 setData의 callback 방식을 보려한다. [사용 예( callback 이용 데이터 가져오기)] s..

query를 사용하다보면 존재여부를 판단할 일이 많다. 보통 select count(*) 를 쓰는 경우를 많이 봤는데 기능은 동작하지만 성능면에서 fullsacn을하여 좋지 않다. 존재여부를 알 수 있는 EXITS연산자를 알아보자. 단어의 의미를 파악하면 EXITS : 동사로 존재하다.(v) =>단어 그대로 받아 들이면 될 것 같다. 조건으로 주어 존재여부를 판단하는 연산식이다. 존재 여부만 판단하고 break를 하여 연산 시 부하가 줄어든다고 한다. [문법] EXITS(subquery) NOT EXITS (subquery) [사용법] SELECT * FROM zzang9iu m WHERE EXISTS ( SELECT 1 FROM zzang9iu r WHERE r.z_id = m.z_id AND z.re..

vue.js는 공식홈페이지에 너무 정리가 잘 되어있어 블로그에는 따로 정리를 하지 않는 편인데 가끔 사용법이 헷갈리는경우가 있어 스스로 정리하려고 한다. https://kr.vuejs.org/v2/guide/computed.html computed와 watch — Vue.js Vue.js - 프로그레시브 자바스크립트 프레임워크 kr.vuejs.org 일단 공식홈페이지에 가면 정리는 잘 되어있다. 나는 정리를 할때 단어의 어원부터 찾아본다. computed : 계산이 되었다. -> 유추하면 이미 계산된 데이터를 처리하는 것 같다. watch : 동사로 보다의 뜻이다. -> 아마 어떤 데이터를 감시하는 역할일 거 같다. 예제를 통해 알아보자. [computed] 원본 메시지: "{{ message }}" 역..

SCRIPT문법을 사용하면서 배열에서 MAP, FILTER, FIND는 정말 많이사용하는 문법이다. 그런데도 가끔 차이점이 뭔지 물어보면 바로바로 대답이 안나오는 경우가 많아 정리를 해보려한다. 일단 단어의 의미를 먼저 알아보겠다. MAP : 맵은 다들알고있지만 명사의뜻은 지도이다. SCRIPT에서는 아마 동사의 뜻인 지도로 그리다. 정도로 쓰는 것 같다. => 배열을 한바퀴 돌린다 정도로 기억하면 좋을것 같다. FILTER : 말그대로 필터. 거르다라는 의미이다. => 배열에서 내가 필요한 조건을 거른다는 의미인 것 같다. FIND : 동사의 의미로 찾다이다. => 배열에서 내가 필요한 조건대로 찾는다는 의미인데. FILTER랑 의미가 비슷한것같다. 차이점은 FIND는 필요한 조건이 걸리면 그상태로 B..

PostgreSQL에서는 데이터의 트리구조를 표현하기 위해서는 RECURSIVE 키워드를 사용하여 재귀적인 쿼리를 사용할 수있다고 한다. 일단 RECURSIVE 의 사전적인 의미를 알아보면 재귀라는 의미이다. 재귀란 어떠한 것을 정의할 떄 자기 자신을 참조한다는 뜻이다. 즉 자기자신을 참조하여 데이터 트리구조를 표현한다고 보면 된다. 샘플 데이터를 통해 예제를 알아보겠다. 예제 블로그 : http://happy1week.blogspot.com/2012/07/postgresql_19.html SQL> CREATE TABLE BOM( ITEM_ID INTEGER NOT NULL, PARENT_ID INTEGER, ITEM_NAME CHARACTER VARYING(20) NOT NULL, ITEM_QTY IN..

useEffect 함수는 컴포넌트가 랜더링 될때마다 실행되는 HOOK 싸이클이다. 컴포넌트가 MOUNT, UNMOUNT, UPDATE 가 되었을 경우에 따라서 싸이클을 실행할 수 있다. 함수 사용법은 useEffect ( function , deps) 이다. function은 콜백함수이고, deps는 배열형태이다. 배열 형태에 따라서 hook 사이클을 조절할 수있다. 1.deps -> [] 빈 배열 설정 useEffect ( ()=>{ console.log('마운트가 될 경우') } , []) 2.deps -> 생략 설정 useEffect ( ()=>{ console.log('컴포넌트가 랜더링 될때마다 ') } ) 3.deps -> 특정 props, stat가 갱신될때 마다. useEffect ( ()=..