개발 흔적 남기기

Mysql DB를 사용하면서 스케줄러를 통해 특정 테이블에서 데이터를 긁어와 insert를 해주는 로직을 작성하였다.

문제는 insert 해주었던 바라보는 기존 테이블이 수정이 일어나면 수정날짜부분을 확인하여 똑같이 수정을 해줘야 하는데, 그때마다 PK값을 가져와서 전부 DELETE하고 다시 INSERT하고 이렇게 자바단에서 처리를 해야하나 골치아픈 상황을 경험하였는데 검색을 통해 INSERT를하면서 PK값이 존재하면 UPDATE를 해주는 ON DUPLICATE KEY UPDATE를 찾았다.

해당 방식은 INSERT를 하다가 PK값이 존재하면 UPDATE를 한다는 조건이 있는데 이 조건을 만족하기 위해 테이블에 무조건 PK값이 지정이 되어있어야 정상적으로 동작한다.

Mysql 쿼리 사용법

INSERT INTO TABLENAME
(
	PKColumn,
	Column1,					
	Column2,
	Column3,
	Column4,
	Column5,
	...
)
VALUES
(
	pkData,
	Data1,
	Data2,
	Data3,
	Data4,
	Data5,
	...
)
ON DUPLICATE KEY UPDATE
	Column1 = Data1,
	Column2 = Dat2,
	Column3 = Data3,
	Column5 = Data5

특정 테이블에 Insert하는부분은 동일하다

values 처리하는부분이 끝나고 ON DUPLICATE KEY UPDATE

처리후 넣고자 하는 컬럼에 데이터값을 입력해주면 된다.

해당 예시 쿼리는 Column1~5까지 insert를 하지만 pk값이 겹칠경우 column4는 제외하고 업데이트가 일어난다.

Mybatis에서 forEach내 사용법

INSERT INTO TABLENAME
(
	PKColumn,
	Column1,					
	Column2,
	Column3,
	Column4,
	Column5,
	...
)
VALUES
<if test="list != null and list.size > 0">
	<foreach collection="list" item="item" index="index" separator=" , ">
	(
		#{item.pkData},
		#{item.Data1},
		#{item.Data2},
		#{item.Data3},
		#{item.Data4},
		#{item.Data5},
		...
	)
	</foreach>
	ON DUPLICATE KEY UPDATE
		Column1 = values(Column1),
		Column2 = values(Column2),
		Column3 = values(Column3),
		Column5 = values(Column5)
</if>

mybatis에서 insert처리시 여러개를 처리할때 파라미터로 LIST 데이터를 담아서 넘기고 해당 값을 쪼개서 동시에 처리하는 경우가 있는데 이때도 동일하게 사용할 수 있다.

UPDATE구문에선 values(컬럼명)으로 변경해줘야 정상적으로 UPDATE가 동작한다.

종종 데이터베이스 서버를 확인하다보면 어디서 접근중인지 확인하거나

정상적으로 접근이 종료되었는지 등등 확인해야하는 경우가 있는데 이럴때는 아래의 쿼리를 날리면

접근중인 세션의 정보들이 나온다.

접근중인 database명, IP정보 상태 등등

SHOW PROCESSLIST;

자바에서는 클래스를 사용해서 직접 메소드를 참조시켜 메소드를 사용할 수 있는데, 이때 "::" 기호를 사용합니다.

주로 List데이터를 출력할때 System.out.println을 통해 확인하는데

참조 연산자를 사용하면 쉽게 데이터를 확인해볼 수 있습니다.

클래스의 메소드 참조

단순 반복문 출력

import java.util.ArrayList;
import java.util.List;

public class MethodRef {

	public static void main(String[] args) {
		List<String> names = new ArrayList<String>();
		names.add("Matilda");
		names.add("Leon");
		names.add("Naples");
		names.add("Harry Potter");
		names.add("Iron Man");
		
		for(int i=0; i<names.size(); i++) {
			System.out.println(names.get(i));
		}
	}

}

보통 반복문 for문을 활용하여 데이터를 확인하였을텐데,

forEach문을 사용하면 int i와 같은 변수 선언도 필요없이 바로 확인 할 수 있습니다.

names.forEach(d->
	System.out.println(d)
);

여기에 메소드 참조(::)를 사용하면 더욱 간단하게 확인 할 수 있습니다.

names.forEach(System.out::println);

간단한 예제라 사실 큰 의미는 없지만 개발하면서 빠르게 데이터를 확인해볼때, 메소드 참조를 통해 콘솔에 쉽게 찍을 수 있었습니다.

System.out 클래스의 println메소드 사용

아래는 forEach와 메소드참조로 변경한 전체 소스입니다.

import java.util.ArrayList;
import java.util.List;

public class MethodRef {

	public static void main(String[] args) {
		List<String> names = new ArrayList<String>();
		names.add("Matilda");
		names.add("Leon");
		names.add("Naples");
		names.add("Harry Potter");
		names.add("Iron Man");
		
		names.forEach(System.out::println);
	}

}

클래스의 메소드 사용

처음 더블콜론(::)을 설명할 때 클래스를 직접 사용하고 메소드를 참조시킨다고 하였는데, 관련된 예제를 보겠습니다.

import java.util.ArrayList;
import java.util.List;

public class RamdaT {
	
	private void someFunction(String str) {
		System.out.println(str);
	}

	public static void main(String[] args) {
		List<String> list = new ArrayList<String>();
		list.add("Apple");
		list.add("Banana");
		list.add("Cherry");
		
		list.forEach(System.out::println);
		
		System.out.println();System.out.println();System.out.println();
		
		list.forEach((new RamdaT())::someFunction);
	}

}

RamdaT라는 클래스에서 someFunction()이라는 함수를 작성하고 파라미터로 전달받은 str변수를 sysout을 통해 출력해주는 예제입니다.

List 컬랙션에 3개의 과일 리스트를 추가하고 출력하는데 처음 forEach부분은 System.out클래스의 println메소드를 통해 출력시킨 부분이고, 두번째는 이번 예제 클래스에서 정의한 RamdaT클래스를 사용하고 someFunction이라는 메소드를 직접 사용하였습니다. 람다에 의해 사용된 변수는 자연스럽게 someFunction함수의 파라미터로 처리되어 아래와 같은 출력을 확인 할 수 있습니다.

Rest properties

ES6문법으로 객체나 배열에 값을 할당할 때 사용한다.

const info={
    id: 0,
    name: "홍길동",
    phone: "010-1234-1234"
}

const {id, ...newInfo} = info;
//const id에는 0이 들어가고 나머지는 newInfo 객체에 할당된다.
id; //0
newInfo //{name: "홍길동", phone: "010-1234-1234"}

Spread properties

ES6문법으로 새로운 객체에 자체적으로 열거한 속성을 할당한다.

let n = {id, ...newInfo};
n; //{id: 0, name: "홍길동", phone: "010-1234-1234"}

활용 예시)

배열 특정 데이터 삭제하기 - 1~5까지 존재하는 배열에서 3만 삭제하기

const arr = [1,2,3,4,5];

const newArr = arr.slice(0,2).concat(arr.slice(3,5));

slice 메소드를 활용하여 잘라내고, concat 메소드를 통해 잘라낸 부분을 다시 합치는 방법입니다.

하지만 Spread properties 방식을 사용하면 아래처럼 구현이 가능합니다.

const newArr2 = [...arr.slice(0,2), ...arr.slice(3,5)]

값 추가도 굉장히 쉽게 할 수 있습니다.

const numberArr = [...arr, 6, 7, 8, 9, 10];
numberArr; //1, 2, 3, 4, 5, 6, 7, 8, 9, 10

let temp = [5, 6, 7, 8, 9, 10];
const numberArr2 = [...arr, ...temp];

numberArr2 //1, 2, 3, 4, 5, 5, 6, 7, 8, 9, 10

폴더를 삭제하려는 도중 관리자권한이 필요하다 하여 권한을 변경하였지만 위와 같은 에러가 발생하였다.

보안탭 - 고급 - 소유자 부분 - 편집 - 사용하는 계정으로 변경하고 다시 권한을 설정한다.

공백이 들어가지 않게 존재하는 보안주체(계정)으로 입력하고 확인을 합니다.

바뀐것을 볼 수 있습니다.

자동으로 모든 권한이 생긴것을 볼 수 있습니다.

* mysql 기준으로 작성하였습니다. 타 DB는 조금씩 사용법이 다를 수 있습니다.

where절 조건문

<where>
    <if test="param1 != null and param1 !=''">
    	column1 = #{param1}
    </if>
    <if test="param2 != null and param2 !=''">
    	and column2 = #{param2}
    </if>
    <if test="param3 != null and param3 !=''">
    	and column3 = #{param3}
    </if>
</where>

where절에서 if문이 무조건 들어가지 않는 경우 1=1과 같은 편법으로 대처하는 경우가 보이는데

<where></where>을 사용하시면 조건 안에서 조건문이 있는 경우에만 검색해줍니다.

맨 위 param1의 값이 없고 param2의 값이 있는 경우 앞에 있는 and를 자연스럽게 지우고 쿼리를 작성하게되어

쿼리 문법에 문제가 되지 않도록 해줍니다.

즉, 아래와 같이 변경해줍니다.

where
    column2 = 'hello'
    and column3 = 100

자연스럽게 column2 앞에 텍스트로 박아놓은 AND문이 사라진걸 볼 수 있습니다.

IN절 검색하기

where column1 IN
  <if test="param1 != null and param1.size > 0">
    <foreach collection="param1" item="item"  open="(" close=")" separator=",">
    	#{item}
    </foreach>
  </if>

IN절의 검색은 해당 컬럼에 포함된 모든 데이터를 검색할때 보통 사용하는데,

(column1='1' or column2='2'...길게 나열하지 않기 위해)

$문법의 경우에는 배열을 넘겨주면 아주 쉽게 해결되지만, 취약점에 노출될 수 있으므로 #{}처리하는 방법으로

LIST형태로 param1값을 넘겨주고 해당값의 널체크와 사이즈체크를 한 후 ( ) 구분자, 처리를 통해

자연스럽게 IN (1, 2, 3)의 형태를 만들어 줄 수 있습니다.

ex 자바단)

String codeList = request.getParameter("codeList"); //파라미터값을 받고 //codeList = "1,2,3,4"
if(codeList != null && !codeList.equals("")){ //널 체크후
    String[] arr = codeList.split(",");  // ,으로 split처리
    param.put("codeList", Arrays.asList(arr)); //LIST에 파싱하여 파라미터값을 넘긴다.
    int res = service.func(param); //서비스 함수에 사용한다.
}

1,2,3 와 같은 형태로 넘어오는 파라미터 자체를 ,로 스플릿하고 LIST에 파싱하는 예제입니다.

like절 검색하기

$ 표기법

where
	column like '% ${검색값} %'

# 표기법 - mysql, maria db

where
	column like concat('%', #{검색값} ,'%')

$방식은 sql Injection 취약점에 노출되므로 #방식을 추천합니다.

jQuery를 통해 select박스 제어를 알아보겠습니다.

/********** value **********/
$(선택자).val(); //value값 가져오기
$("#id").val(); //id로 접근하여 value가져오기
$("select[속성='속성명']").val(); //속성으로 접근하여 value가져오기

/********** text **********/
$(선택자 option:selected).text(); //text값 가져오기
$("#id option:selected").text();
$("select[속성='속성명'] option:selected").text();

text값은 가져올때 해당자식인 option의 선택된 개체를 가져와야합니다. option:selected

해당 옵션이 없으면 select 자식으로 들어간 option값 전부를 가져오게 됩니다.

change이벤트에 따른 val값 및 text값을 가져오는 예제

name속성이 location인 select박스의 값이 변경됨에 따른 선택값 처리를 알아보겠습니다.

HTML

<div>
  <select name="location">
  <option value="1">one</option>
  <option value="2">two</option>
  <option value="3">three</option>
  </select>
</div>
<div id="output">
</div>

jQuery

$("select[name=location]").change(function(){
  console.log($(this).val()); //value값 가져오기
  console.log($("select[name=location] option:selected").text()); //text값 가져오기
});

select박스 값이 바뀔때마다 console.log가 출력되는걸 볼 수 있습니다.

추가적으로 SELECT - OPTION 태그 내부에 VALUE값을 지정을 안하는 경우가 있는데, 이런 경우에는 jQuery .val() 이나 바닐라 .value로 값을 가져올 경우 text값을 가져오게 되니 유의하시기 바랍니다.

리액트에서 조건문 사용하는방법을 알아보겠습니다.

리액트에서는 클래스로 만들어진 컴포넌트에 꼭 render함수가 있어야하며 JSX로 return을 해줘야하는데,

JSX에서는 자바스크립트 조건문처럼 if나 switch문으로 처리가 불가능합니다.

틀린 문법 - IF문

import React from 'react';

function App() {
  const test = 12345;
  return (
    if(test === 12345){
      <div>맞아요</div>
    }else{
      <div>틀려요</div>
    }
  );
}

export default App;

해당방식으로 완성하게되면, 구문에러를 확인 할 수 있습니다.

리액트 JSX에서는 삼항연사자 또는 AND(&&) 연산자를 통해 조건문을 구성합니다.

삼항연사자로 조건확인하기

import React from 'react';

function App() {
  const test = 12345;
  return (
    test === 12345 ? <div>맞아요</div> : <div>틀려요</div>
  );
}

export default App;

이와 같이 if else처리를 삼항연산자를 통해 만드시면 됩니다.

AND연산자를 통한 처리

import React from 'react';

function App() {
  const test = 12345;
  return (
    test === 12345 && <div>맞아요 (AND연산)</div>
  );
}

export default App;

AND연산은 조건문이 true일때만 동작하는 else문이 없는 조건문이라고 생각하면 됩니다.

간단한 조건문의 경우 위의 삼항연산자나 AND연산자를 통해 완성시킬 수 있지만 복잡한 경우 어떻게 해야할까요?

삼항에 삼항에 삼항은 가독성도 떨어지고 만들기도 힘든데 이때는 즉시발동함수를 사용하시면 됩니다.

즉시발동함수를 통한 조건문 처리

import React from 'react';

function App() {
  const word = 'react';
  return (
    <div>
    {
      (function(){
        if(word == 'react'){
          return ("리액트!")
        }else if(word == 'hello'){
          return ("헬로우!")
        }else if(word == 'world'){
          return ("월드!")
        }
      })()
    }
    </div>
  );
}

export default App;

사실 조건에 해당하면 바로 return처리되기 때문에 else if도 필요없긴 합니다...

화살표함수 형태로 표현도 가능합니다. 화살표함수는 자바 1.8이상에서 보는 list-> 와 비슷한 함수로

es6 문법에서 나온 함수로 function()부분을 대체합니다.

즉시발동함수(화살표함수)를 통한 조건문 처리

return (
    <div>
    {
      (()=>{
        if(word == 'react'){
          return ("리액트!")

function()부분을 ()=> 변경하여도 동일하게 동작합니다.

이상으로 리액트 조건문 사용방법을 알아봤습니다.