조젤리의 개발일기

[JPA] Table 'mysql.hibernate_seq' doesn't exist 오류 해결

jojelly — Mon, 4 Mar 2024 17:55:34 +0900

Entity Table생성시 @Id생성 컬럼에

@GeneratedValue(strategy = GenerationType.Auto)

를

@GeneratedValue(strategy = GenerationType.IDENTITY)

로 변경해준다.

참조

https://mkyong.com/spring-boot/spring-boot-mysql-table-db_name-hibernate_sequence-doesnt-exist/

[intellj]git ignore 넣기 파일 컬러별 설명

jojelly — Thu, 25 Jan 2024 00:45:58 +0900

검색 값에 따라서 자동으로 gitignore 파일에 들어갈 스트링을 생성해주는 사이트이다.

원하는 운영체제나 언어를 넣어 생성하면 된다.

나는 여기에 "intelliJ", "Java", "Gradle" 을 검색해주었다.

https://www.toptal.com/developers/gitignore/

gitignore.io

Create useful .gitignore files for your project

www.toptal.com

인텔리제이에 파일목록을 살펴보면 컬러별로 구분을 할 수 있도록 되어있다.

흰색
저장소에 올라간 후에 어떠한 수정도 없는 상태. (저장소에 올라간 파일과 똑같은 상태)
노란색
.gitignore 파일을 통해 제외한 파일들
빨간색
저장소에 존재하지 않는 파일.
파란색
저장소와 내 컴퓨터에 있는 파일인데 "수정"된 상태. (즉, 저장소에 올라간 파일과 내 컴퓨터에 있는 파일의 내용이 다른 상태)
초록색
Git에 commit만 하고 push는 하지 않은 상태. (push하면 흰색으로 바뀐다.)

[오류해결] To address all issues (including breaking changes), run: npm audit fix --force

jojelly — Fri, 19 Jan 2024 20:28:27 +0900

react를 최신버전으로 업데이트를 하기위해

npm install react@latest react-dom@latest

입력했더니 해당 문제가 발생했다.

설치하려는 폴더에 설치가 되어있어 발생할 가능성이 높다.

폴더에 있는 node_modules, package-lock.json 삭제 후 재설치 하자

[JAVA] CountDownLatch

jojelly — Wed, 1 Nov 2023 13:47:57 +0900

CountDownLatch 는 Thread를 멀티로 병렬처리시 간단하게 관리해줄수있는 기능이다.

1. 사용이유

여러개의 쓰레드를 생성 후 병렬로 작업처리시 각각의 쓰레드들은 다른 쓰레드의 작업을 기다리지 않고 수행하게 된다.
이 때 countDownLatch를 사용하면 일정 개수의 thread가 끝나야만 특정 thread를 실행시켜 통제 해준다.

2.사용방법

[A라는 mainThread에서 B,C Thread가 실행된 후 B,C가 종료되고 난 후에 A Thread에서 남은 작업을
하도록 만들겠다.

1.Main Thread에 CounterDownLatch 초기화시 정수값count를 넣어준다.
2. B,C Thread 마지막에 countDown()를 호출한다.              => count를 1씩 줄인다.
3. MainThread에 어느 시점에 await() 메서드를 넣어준다.
4. CountDown시 1씩 줄어들며  count값이 0이라는 숫자가 되면 Latch(게이트)역할을 하면서  await상태가 열린다.
+await()Time메서드는 만약 B,C등에서 오류가 생기면 await가 무한대기할 수 있기때문에 대기시간을 지정하는 방법이다.

자바스크립트 함수, 타입, 키워드

jojelly — Tue, 26 Sep 2023 01:11:31 +0900

자바스크립트에서 함수란?

함수를 우선 어떤 목적을 가진 작업들을 수행하는 코드들이 모인 블럭으로 이해하면 된다.
함수를 우선 지시사항들의 묶음(과정)으로 이해하면 된다.
함수는 재사용 가능한 영역을 정의하고, 정보영역을 캡슐화하는데 사용되는 구문이다. (여러번 호출 가능)
일반적으로 (입력 – > 함수 – > return – > 출력) 형태를 갖는다.
함수 선언을 위해서는 Keyword, name, paramenter, body 필요하다.

// Keyword    -> function
// Name       -> hello
// Paramenter -> ()
// Body       -> {}
function hello() {
}

함수는 function 키워드로 시작하고, 실제로는 객체이다.
함수는 정의/생성할 수 있으며, 출력할 수도 있다.
객체의 특성 덕분에 함수를 변수나 배열에 배정할 수 있다.
다른 함수를 호출할 때, 인자를 넘겨 줄 수 있다.

– 함수 호출

선언 (매개변수 parameter)
호출 (전달인자 argument)

선언적이고 명시적인 function 키워드 사용
함수를 객체 혹은 리터럴(함수식=함수 표현식)로 사용

1. 명시적 함수의 선언 – 함수 선언식

// 함수 선언식(선언문)이라고 한다.
function hello() {
  return 'hllo!';
}
// 함수 호출
hello();

2. 함수를 객체 혹은 리터럴(함수식=함수 표현식)로 사용된다.

// 함수 리터럴(함수 표현식)이라고 한다.
const hello = function() {
  return 'hllo!';
}
// 변수 hello는 함수 리터럴로 변수를 함수처럼 실행할 수 있다.
hello();

자바스크립트에서 타입이란?

자바스크립트의 기본 타입은 크게 원시 타입과 객체 타입으로 구분할 수 있습니다.

원시 타입(primitive type)은 다음과 같습니다.

1. 숫자(number)

2. 문자열(string)

3. 불리언(boolean)

4. 심볼(symbol) : ECMAScript 6부터 제공됨

5. undefined

객체 타입(object type)은 다음과 같습니다.

6. 객체(object)

1. 숫자(number)

자바스크립트는 다른 언어와는 달리 정수와 실수를 따로 구분하지 않고, 모든 수를 실수 하나로만 표현

2. 문자열(string)

자바스크립트에서 문자열은 큰따옴표("")나 작은따옴표('')로 둘러싸인 문자의 집합을 의미합니다.

3. 불리언(boolean)

불리언 값은 참(true)과 거짓(false)을 표현합니다.

4. 심볼(symbol) : ECMAScript 6부터 제공됨

심볼은 유일하고 변경할 수 없는 타입으로, 객체의 프로퍼티를 위한 식별자로 사용할 수 있습니다.

5. undefined

자바스크립트에서 null이란 object 타입이며, 아직 '값'이 정해지지 않은 것을 의미합니다.

또한, undefined란 null과는 달리 '타입'이 정해지지 않은 것을 의미합니다.

따라서 자바스크립트에서 undefined는 초기화되지 않은 변수나 존재하지 않는 값에 접근할 때 반환됩니다.

6. 객체(object)

자바스크립트의 기본 타입은 객체(object)입니다.

객체(object)란 실생활에서 우리가 인식할 수 있는 사물로 이해할 수 있습니다.

객체는 여러 프로퍼티(property)나 메소드(method)를 같은 이름으로 묶어놓은 일종의 집합체입니다.

키워드

자바스크립트에서 특정한 목적을 위해 사용하는 단어이다.

역할을 하는 단어들이라고 생각하면 된다.

break
case
catch
continue
** default : 사용자가 특별히 명령을 내리지 않으면 시스템이 자동으로 적용하는 미리 정해진 값이나 조건.
** delete : 피연산자로 지정된 객체 프로퍼티, 배열원소, 변수의 삭제를 시도하는 단항연산자이다.
** do : while의 변형인 do~while 문을 의미한다. 내용을 먼저 실행한 후에 조건을 비교한다.
else
** finally : catch절 다음에 finally 블록이 이어지는데, 앞서 try 블록에서 일어난 일에 관계없이 항상 실행이 보장되어야 할 뒷정리용 코드가 포함된다.
for
function
if
in
** instanceof : A instanceof B의 형식으로 사용하며, A가 B의 인스턴스가 맞는지 판단한다.
new
return
switch
** this : 함수 내에서 함수 호출 맥락(context)를 의미한다. 함수를 어떻게 호출하냐에 따라서 대상이 달라진다.
throw
try
typeof
var
void
while
** with : 객체를 제어하는 명령어로, 특정 객체를 여러번 사용할 경우 생략할 수 있도록 해준다.

with(document){
  	write("document.write에서 document 생략")
}

JPA - 복합키와 식별 관계 맵핑

jojelly — Mon, 29 May 2023 22:12:56 +0900

JPA 는 영속성 컨텍스트에 보관할 때 식별자를 키로 사용한다고 했다. 식별자 구분시에는 equals 와 hashCode 를 사용하므로 식별자 필드가 2 개 이상이면 별도의 식별자 클래스를 만들어서 equals 와 hashCode 를 구현해야 한다.

JPA 에는 복합 키 지원을 위해 @IdClass 와 @EmbeddedId 를 지원한다.

복합키를 사용하는 Characters클래스

복합키 사용시 @IdClass 를 이용하여 식별자 클래스로 맵핑하였다. 식별자 클래스의 특징을 다시한번 살펴보자면 Serializable 을 구현해야 하고, hashCode 와 equals 를 오버라이드 해야한다. 또한 식별자 클래스의 속성명과 엔티티의 속성명이 같아야 한다.

위의Collection 엔티티는 Character 엔티티를 외래키로 참조한다. 다중성은 Character : Collection= 1 : N 이므로 @ManyToOne 을 사용한다. 그리고 조인 컬럼이 2 개 이상이기 때문에 @JoinColumn 이 아닌 @JoinColumns 를 사용한다.

public static void save(EntityManager em) {
	
	EntityTransaction tx = em.getTransaction();
	tx.begin();
	
	Characters characters = new Characters();
	characters.setCharacId("character_id#1");
	characters.setCharacStage("charac_stage#2");
	em.persist(characters);
	
	tx.commit();
	em.close();
}

................

public static void find(EntityManager em) {
	
	EntityTransaction tx = em.getTransaction();
	tx.begin();
	
	CharacterPK characterPK = new CharacterPK("character_id#1", "charac_stage#2");
	Characters characters = em.find(characters.class, characterPKcharacterPK);
	System.out.println("characters: " + characters);
	
	tx.commit();
	em.close();
}

복합키 엔티티를 저장할 때에는 식별자 클래스를 이용하여 저장하지 않아도 된다. 영속성 컨텍스트에 등록하기 전 내부에서 CharacterPK를 생성하여 키로 사용한다.

조회코드에서는 식별자 클래스인 CharacterPK 를 이용하여 조회한다. 이때 복합키를 생성자인자로 받는 생성자를 별도로 생성했는데, 필요 생성자를 별도로 구현시 기본생성자도 구현해주어야 한다.

[jquery] 여러 요소 한번에 동일하게 이벤트 생성

jojelly — Mon, 22 Aug 2022 15:55:10 +0900

$('.class1').click(function() {
   some_function();
});

$('.class2').click(function() {
   some_function();
});

==>

$('.class1, .class2').on('click', some_function);

또는

$('.class1').add('.class2').on('click', some_function);

또는

$(document).on("click touchend", ".class1, .class2, .class3", function () {
     some_function();
});

[JQuery] closest(), parant(), siblings(), children()

jojelly — Fri, 19 Aug 2022 15:44:55 +0900

JQuery에는 선택함수가 여러개 있다. closest(), parant(), siblings(), children()가 사용되는 방법에 대해 알아볼것이다.

$(this)는 #me를 기준으로 하겠다.

<div id="grandmom">
	<div id="mom">
    	<div id="me">
        	<div id="son">
            	<div id="grandson"></div>
            </div>
        </div>    
            <input type="text" id="brother"/>
            <a id="sister"/>
    </div>
</div>

1.parent()

$(document).on("click","#me", function(){
	$(this).parent().css("background-color", "red");
 });

==> grandmom, mom 의 div 색이 red로 변경

부모들을 호출한다. 만약 grandmom만 호출하고자 한다면 $(this).parent().parent()로 호출하는 방법이 있다.

2.closest()

$(document).on("click","#me",function(){
	$(this).closest().css("background","red");
    });

==>mom의 div 색이 red로 변경됨

가장 가까운 부모를 선택한다.

3.1 siblings()

$(document).on("click",function(){
	$(this).sibling();
    
});

==>brother, sister이 선택된다.

형제 요소들을 호출한다.

만약 바로 옆 형제만 선택하고 싶다면 next()함수를 사용한다.

$(this).next("input")

==> brother

3.2 siblings()

$(document).on("click", "#me", function(){
	$(this).siblings(#sister).after('<button type="button" id="sister_2"> 시스터2</button>')
});

==>a태그 sister 다음에 버튼 태그가 생긴다.

4.children()

$(document).on("click",function(){
	$(this).children();
    
});

==>son

직계자식을 선택한다. son아래 grandson도 있지만 이 요소는 선택되지 않는다.

grandson까지 찾고자 할때는 find()함수를 사용하면 된다 .

( 아래 참고 )

2022.08.18 - [Front/JQuery] - find/ td:eq(0)/ not /closest/ toFixed 요소 찾기

find는 depth에 상관없이 하위 자손들을 모두 선택하며 jQuery에서는 자손과 자식은 다른의미로 쓰이고 있다.

자손: depth 하위의 자식들도 포관

자식: 직계자식만을 의미한다.

find/ td:eq(0)/ not /closest/ toFixed 요소 찾기

jojelly — Thu, 18 Aug 2022 14:21:08 +0900

find= 요소를 찾는다.

not=요소를 제외한다.

val=값을 넣거나 찾기

closest= 가장 가까운 요소를 찾기(해당 라인 또는 같은 라인에 있는 정보를 찾고 싶을때 사용한다.)

find("td:wq(0)")

-0번째 <td>요소를 찾는다.

not("td:wq(0)")

-0번째 <td>요소를 제외한다.

find("input")val("벨류추가");

-input태그의 value값을 "벨류추가"로 바꾼다.

.toFixed(1)

Number 인스턴스의 소수 부분 자릿수를 전달받은 값으로 고정한 후 , 그 값을 문자열로 반환한다.

-소수점 첫자리까지 나타낸다.

$('#parent li:last-child').closest('ul').find('li').length;

id가 parent인곳에서 마지막 li인 요소의 상위 ul을 찾아 ul안의li의 갯수를 구한다.

EX.)

$(#trld1).find("td:eq(0)").find("input").val("ID추가);

-id 값이 "trd1"을 찾고 , 첫번째 <td>요소를 찾고 ,<input>태그의 value값을 "ID추가"로 바꾼다.

<tr id="trd1" class="trClass1">

<th>ID>

<td>

<input type="text" id="trinput1" value="" readonly="true">

</td>

<td>

<input type="button">

</td>

</tr>





<tr id="trd2" class="trClass2">

<th>ID>

<td>

<input type="text" id="trinput2" value="" readonly="true">

</td>

<td>

<input type="button">

</td>

</tr>

EX2.)

td 의 두번째에 있는 텍스트를 수정하기

   <table>
        <tr>
            <td>1번</td>
            <td>노랭이</td>
            <td><button class='edit'>수정</button></td>
        </tr>
        <tr>
            <td>2번</td>
            <td>파랭이</td>
            <td><button class='edit'>수정</button></td>
        </tr>
        <tr>
            <td>3번</td>
            <td>초랭이</td>
            <td><button class='edit'>수정</button></td>
        </tr>
        <tr>
            <td>4번</td>
            <td>검둥이</td>
            <td><button class='edit'>수정</button></td>
        </tr>
    </table>

<script>
    $(function(){
        var _td,first_v;
        var btn = '<button class="edit">수정</button>'
    
        $(document).on('click','.edit',function(e){
        
            _td = $(this).closest('tr').find('td');
            
            // 취소시 리턴값
            first_v = _td[1].innerText; 
            
            var editform = "<input type='text' value='"+_td[1].innerText+"' size='10' />";
            var editbtn = "<button class='editDo'>완료</button>"+
                          "<button class='cancel'>취소</button>"+
                          "<button class='delDo'>삭제</button>";
                          
            $(_td[1]).html(editform);
            $(_td[2]).html(editbtn);
        })
        
        $(document).on('click','.editDo',function(){
            var el = $(_td[1]).find('input').val();
            $(_td[1]).text(el);
            $(_td[2]).html(btn);
        })
        
        $(document).on('click','.cancel',function(){
            $(_td[1]).text(first_v);
            $(_td[2]).html(btn);
        })
        
        $(document).on('click','.delDo',function(){
            $(_td).remove();
        })
    })
</script>

@RequestParam과 @PathVariable

jojelly — Thu, 11 Aug 2022 14:30:06 +0900

Spring을 사용하다 보면 Controller 단에서 클라이언트에서 URL에 파라메터를 같이 전달하는 경우가 있습니다.
주로 사용하는 형태는 아래의 두 가지가 대표적인 케이스가 있습니다.

Type 1 => http://127.0.0.1?index=1&page=2
Type 2 => http://127.0.0.1/index/1

Type 1의 경우 파라메터의 값과 이름을 함께 전달하는 방식으로 게시판 등에서 페이지 및 검색 정보를 함께 전달하는 방식을 사용할 때 많이 사용합니다.

Type 2의 경우 Rest api에서 값을 호출할 때 주로 많이 사용합니다.

Spring에서는 이러한 전달인자를 처리하는데 두 가지 방법을 제공합니다.

@RequestParam 사용하기

Type 1의 URL을 처리할 때 @RequestParam을 사용하게 됩니다.
아래의 예제와 같이 Controller 단에서 사용합니다.

@GetMapping(/"read")
public ModelAndView getFactoryRead( int factroyId, SearchCriteria criteria) 
{
  //...    
}

위의 경우 /read ?no=1와 같이 url이 전달될 때 no 파라메터를 받아오게 됩니다.
@RequestParam 어노테이션의 괄호 안의 경우 전달인자 이름(실제 값을 표시)입니다.
이렇게 @RequestParam의 경우 url 뒤에 붙는 파라메터의 값을 가져올 때 사용을 합니다.

@PathVariable 사용하기

Type 2의 URL을 처리할 때는 @PathVariable을 사용하게 됩니다.

@PostMapping("/delete/{idx}")
@ResponsBody
public JsonResultVo postDeleteFactory( int factoryIdx) {
	return factoryService.deleteFacotryData(factoryIdx);
}

위에 예제 코드처럼 PathVariable의 경우 url에서 각 구분자에 들어오는 값을 처리해야 할 때 사용합니다.

실제로 사용은?

물론 @RequestParam 또는 @PathVariable 하나만 사용하는 것이 아닌 복합적으로 사용을 하기도 합니다.

@GetMapping/{userIdx}/invoices
public List<Invoice> listUsersInvoices(
	 int user,
	 Date dateOrNull
)	
{ }