'분류 전체보기' 카테고리의 글 목록 (9 Page)

2022. 9. 5. 11:30 Spring/Annotation

직접 기본키를 생성하는 방법 @Id 어노테이션 만을 사용하여 기본키를 직접 할당해주는 방법이 있다. 기본키를 자동으로 생성하는 방법 4가지 기본키를 자동으로 생성할 때에는 @Id와 @GenerratedValue 어노테이션이 함께 사용되어야 한다. IDENTITY - @GeneratedValue(strategy = GenerationType.IDENTITY) 기본키 생성을 데이터베이스에게 위임하는 방식으로 id값을 따로 할당하지 않아도 데이터베이스가 자동으로 AUTO_INCREMENT를 하여 기본키를 생성해준다. JPA는 보통 영속성 컨텍스트에서 객체를 관리하다가 commit이 호출되는 시점에 쿼리문을 실행하게 된다. 하지만 IDENTITY 전략에서는 EntityManager.persist()를 하는 시점..

V2 - 게시판 만들기(초기 설정)#1

2022. 9. 5. 10:54 프로젝트/게시판

회원 가입, 로그인, 게시판 CRUD를 구현 해보자 구성 환경 SpringBoot, Gradle, Thymeleaf, Jpa(JPQL), jar, H2 Type Gradle Project Language Java Packaging Jar Java Version 11 Group com.board Artifact 프로젝트명, board Version Spring Boot 2.7.3 Package Name com.board Developer Tools Lombok SQL H2Driver Template Engines Thymeleaf Web Spring Web https://start.spring.io/ 사용 Spring 을 사용할 예정이기에 Spring Web 추가 , 사용의 편리를 위한 Lombok DB ..

V1 - 수정, 삭제 구현하기

2022. 9. 5. 09:24 프로젝트/게시판

Controller 상세화면 수정, 상세화면 내에서 삭제, 목록에서 삭제에 대한 서비스 호출 처리 package com.board.study.web; import com.board.study.dto.board.BoardRequestDto; import com.board.study.service.BoardService; import lombok.RequiredArgsConstructor; import org.springframework.stereotype.Controller; import org.springframework.ui.Model; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bin..

Thymeleaf - 템플릿 레이아웃2

2022. 9. 5. 05:32 Spring/Thymeleaf

레이아웃 H1 레이아웃 컨텐츠 레이아웃 푸터 /resources/templates/template/layoutExtend/layoutExtendMain.html 메인 페이지 컨텐츠 메인 페이지 포함 내용 생성 결과 레이아웃 H1 메인 페이지 컨텐츠 메인 페이지 포함 내용 레이아웃 푸터 layoutFile.html 을 보면 기본 레이아웃을 가지고 있는데, 에 th:fragment 속성이 정의되어 있다. 이 레이아웃 파일을 기본으로 하고 여기에 필요한 내용을 전달해서 부분부분 변경하는 것으로 이해하면 된다. layoutExtendMain.html 는 현재 페이지인데, 자체를 th:replace 를 사용해서 변경하는 것을 확인할 수 있다. 결국 layoutFile.html 에 필요한 내용을 전달하면서 자체를 ..

HTML - label for

2022. 9. 5. 05:15 HTML

태그 정리 태그사이에 위치한 text, checkbox, radio 등은 클릭 가능 영역이 텍스트로 확장됩니다. 와 값은 서로 그룹을 형성합니다. HTML label 태그 태그는 태그를 도와주는 역할입니다. 태그가 디자인 하기 힘들 때 태그로 연결해서 쉽게 디자인하거나 클릭 편의성을 높일 수 있습니다. 예시를 보면 태그는 단순히 태그와 같은 단어 입력처럼 보일 수 있습니다. 그런데 아래 예제에서 글자 부분을 클릭해보면 키보드 커서가 우측의 text 창에 표시됩니다. 여기를 클릭하세요. 가장 좋은 예시는 radio나 checkbox 속성값을 사용할 때 입니다. 보통 이런 버튼은 너무 작아서 클릭할 때 비효율적입니다. 태그의 for 값을 nunu로 주고, 의 id 값을 nunu로 작성합니다. 이럴 경우 누누..

MySQL - 문법 에러

2022. 9. 5. 04:28 MYSQL/오류

Error 1136(21501) : Colum count doesn't match value count at row 1 첫 번째 줄에서 열의 수와 값의 수가 일치하지 않다. 2022-09-04 18:42:55.090 ERROR 27416 --- [nio-8080-exec-5] o.h.engine.jdbc.spi.SqlExceptionHelper : You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near '' at line 1 SQL 문법에러 MySQL에 해당하는 서버 버젼 메뉴얼을 확인한 뒤 올바른 문법을 line 1 ' ..

jQuery - .attr() 함수

2022. 9. 4. 15:04 JavaScript/jQuery

함수 사용법 .attr(attributeName) // 속성값 가져오기 .attr(attributeName, val) // 속성값 제어하기 // 속성값 가져오기 //div 요소의 id 속성의 값을 가져옴 $('div').attr('id'); //id 요소가 "test" 인 placeholder 속성 값을 가져옴 $('#test').attr('placeholder'); //body 요소의 class 속성의 값을 가져옴 $('body').attr('class'); //id 요소가 "test1" 인 value 속성 값을 가져옴 $('#test1').attr('value'); //속성값 제어하기 //div 요소의 id 속성의 값을 'Tistory'로 변경하기 $('div').attr('id', 'Tistory'..

jQuery - 양식 제출

2022. 9. 4. 14:55 JavaScript/jQuery

$('form#myForm').submit(); 해당 form 에 action url을 선언 후 .submit() 를 실행하면, 위 소스에서처럼 main/search 라는 컨트롤러를 찾아서 검색을 실행하게 연동할 수 있습니다. url은 언제든 원하는대로 변경해서 호출하면 form을 넘겨서 처리할 수 있습니다!

jQuery - 함수

2022. 9. 4. 14:51 JavaScript/jQuery

$(선택자).동작함수1().동작함수2() 달러($) 기호는 제이쿼리를 의미하고, 제이쿼리에 접근할 수 있게 해주는 식별자이다. - 선택자를 이용하여 원하는 HTML 요소를 선택하고, - 동작 함수를 정의하여 선택된 요소에 원하는 동작을 설정한다. jQuery를 사용하기 위해서는 먼저 jQuery 객체를 생성하여야 한다. 생성된 jQuery 객체는 다양한 메소드를 가지는데, jQuery를 학습한다고 하는 것은 대체로 이 메소드를 사용하는 방법을 익히는 것이다. $() // jQuery() 함수의 축약형 jQuery() 함수는 전달되는 인수의 종류에 따라 다른 움직임을 하지만 결국 jQuery 객체를 반환한다. 인수의 종류에 따라 jQuery() 함수가 어떻게 동작하는지 살펴보도록 하자. CSS 스타일의 ..

Javascript - confirm

2022. 9. 4. 14:44 JavaScript

confirm("표시할 문구"); confirm() 예제 - 확인창 띄우기 클릭 confirm() 정의 확인 취소 버튼 달린 확인메세지창 띄우기 1. 과도하게 사용 시 사용자에게 불편 초래하니 주의 ! 2. (확인・취소) 버튼만 가능. (예・아니오) 버튼으로 커스텀 불가. 대신, 모달 또는 팝업 플러그인 이용. 3. 주요 브라우저가 모두 지원. confirm() 구문 confirm(message) [매개변수] message 필수. 메세지 내용 [반환값] 확인 (OK) 클릭 시, TRUE 반환. 취소 (Cancel) 클릭 시, FALSE 반환.

Javascript, Jquery - 변수와 상수(var, let, const)

2022. 9. 4. 13:58 JavaScript

자바스크립트에서 값을 선언할 떄는 크게 2가지 종류가 있다. 1. 변수 2. 상수 let a = 1; console.log(a); a = 2; let b = 'devilcute'; console.log(a); 위의 코드처럼 let 이라는 키워드를 이용해서 변수를 설정해 줄 수 있고 첫번쨰 a값과 두번쨰 a의 값이 다른 것을 보면 값이 바뀐 것을 확인 할수 있다. 하지만 동일한 이름으로 선언해주지는 못하는데 let a = 1; let a = 3; 이런 식으로 해주게 되면 a라는 변수가 이미존재하기 때문에 에러가 난다. 변수가 변하는 값을 넣을 수 있는 것이면 상수는 "변하지 않는 값"이다. java를 조금 다뤄보신 분들은 상수라는 단어를 들으면 final static ~~이 떠오르실텐데 비슷한 개념입니다...

jQuery - radio, checkBox

2022. 9. 4. 13:31 JavaScript/jQuery

radio 제어 스마트폰 통신사 : SKT KT LGT 브랜드 : 삼성 Apple LG 선택된 값 가져오기 $("input[name='radio의 name값']:checked").val(); //ex)$("input[name='telecom']:checked").val(); 값 강제로 선택시키기 $("input[name='radio의 name'][value='선택할 값']").prop("checked", true); //$("input[name='telecom'][value='skt']").prop("checked", true); checkbox 제어 좋아하는 브랜드를 선택하세요 아크네 스튜디오 버버리 루이비통 구찌 지방시 오프화이트 체크박스 선택된 개수 가져오기 $("input[name='checkBo..

jQuery - .click() 선택한 요소를 클릭했을 때 특정 작업을 하는 메서드

2022. 9. 4. 13:22 JavaScript/jQuery

.click() .click()은 선택한 요소를 클릭했을 때 특정 작업을 수행할 수 있게 하는 속성입니다. 문법 .click( handler ) 예를 들어 button 요소를 클릭했을 때 함수를 실행시키고 싶으면 다음과 같이 합니다. $( 'button' ).click( function() { // function } ); 예제 저장 $(document).ready(function () { $("button[name='save']").click(function () { $("body").append("click!!! "); }); }); name속성이 save인 button요소를 클릭하면 click()이벤트 처리로 body태그에 click!!!을 찍어냅니다. on() 이번엔 on() 메소드입니다. on(..

Thymeleaf - 템플릿 레이아웃1

2022. 9. 4. 12:20 Spring/Thymeleaf

이전에는 일부 코드 조각을 가지고와서 사용했다면, 이번에는 개념을 더 확장해서 코드 조각을 레이아웃에 넘겨서 사용하는 방법에 대해서 알아보자. 예를 들어서 /resources/templates/template/layout/layoutMain.html 메인 컨텐츠 결과 메인 컨텐츠 ● common_header(~{::title},~{::link}) 이 부분이 핵심이다. ● ::title 은 현재 페이지의 title 태그들을 전달한다. ● ::link 는 현재 페이지의 link 태그들을 전달한다. 결과를 보자. ● 메인 타이틀이 전달한 부분으로 교체되었다. ● 공통 부분은 그대로 유지되고, 추가 부분에 전달한 들이 포함된 것을 확인할 수 있다. 이 방식은 사실 앞서 배운 코드 조각을 조금 더 적극적으로 사용..

Thymeleaf - 템플릿 조각

2022. 9. 4. 11:58 Spring/Thymeleaf

웹 페이지를 개발할 때는 공통 영역이 많이 있다. 예를 들어서 상단 영역이나 하단 영역, 좌측 카테고리 등등 여러 페이지에서 함께 사용하는 영역들이 있다. 이런 부분을 코드를 복사해서 사용한다면 변경시 여러 페이지를 다 수정해야 하므로 상당히 비효율 적이다. 타임리프는 이런 문제를 해결하기 위해 템플릿 조각과 레이아웃 기능을 지원한다. package hello.thymeleaf.basic; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.RequestMapping; @Contr..

Thymeleaf - 자바스크립트 인라인

2022. 9. 4. 11:27 Spring/Thymeleaf

타임리프는 자바스크립트에서 타임리프를 편리하게 사용할 수 있는 자바스크립트 인라인 기능을 제공한다. 자바스크립트 인라인 기능은 다음과 같이 적용하면 된다. 자바스크립트 인라인 사용 전 - 결과 자바스크립트 인라인 사용 후 - 결과 자바스크립트 인라인 사용 후 자바스크립트 인라인을 사용하지 않은 경우 어떤 문제들이 있는지 알아보고, 인라인을 사용하면 해당 문제들이 어떻게 해결되는지 확인해보자. 텍스트 렌더링 ● var username = [[${user.username}]]; ● 인라인 사용 전 ▶ var username = userA; ● 인라인 사용 후 ▶ var username = "userA"; ● 인라인 사용 전 렌더링 결과를 보면 userA 라는 변수 이름이 그대로 남아있다. 타임리프 입장에서는..

Thymeleaf - 블록

2022. 9. 4. 11:08 Spring/Thymeleaf

은 HTML 태그가 아닌 타임리프의 유일한 자체 태그다. BasicController 추가 @GetMapping("/block") public String block(Model model) { addUsers(model); return "basic/block"; } /resources/templates/basic/block.html 사용자 이름1 사용자 나이1 요약 실행 결과 사용자 이름1 userA 사용자 나이1 10 요약 userA / 10 사용자 이름1 userB 사용자 나이1 20 요약 userB / 20 사용자 이름1 userC 사용자 나이1 30 요약 userC / 30 타임리프의 특성상 HTML 태그안에 속성으로 기능을 정의해서 사용하는데, 위 예처럼 이렇게 사용하기 애매한 경우에 사용하면 ..

Thymeleaf - 주석

2022. 9. 4. 11:02 Spring/Thymeleaf

BasicController 추가 @GetMapping("/comments") public String comments(Model model) { model.addAttribute("data", "Spring!"); return "basic/comments"; } /resources/templates/basic/comments.html 예시 html data 1. 표준 HTML 주석 2. 타임리프 파서 주석 html data 3. 타임리프 프로토타입 주석 결과 예시 Spring! 1. 표준 HTML 주석 2. 타임리프 파서 주석 3. 타임리프 프로토타입 주석 Spring! 표준 HTML 주석 자바스크립트의 표준 HTML 주석은 타임리프가 렌더링 하지 않고, 그대로 남겨둔다. 타임리프 파서 주석 타임리프 ..

Thymeleaf - 조건부 평가

2022. 9. 4. 10:35 Spring/Thymeleaf

타임리프의 조건식 if , unless ( if 의 반대) BasicController 추가 @GetMapping("/condition") public String condition(Model model) { addUsers(model); return "basic/condition"; } /resources/templates/basic/condition.html if, unless count username age 1 username 0 switch count username age 1 username 10살 20살 기타 if, unless 타임리프는 해당 조건이 맞지 않으면 태그 자체를 렌더링하지 않는다. 만약 다음 조건이 false 인 경우 ... 부분 자체가 렌더링 되지 않고 사라진다. switch..

Thymeleaf - 반복

2022. 9. 4. 10:28 Spring/Thymeleaf

타임리프에서 반복은 th:each 를 사용한다. 추가로 반복에서 사용할 수 있는 여러 상태 값을 지원한다. BasicController 추가 @GetMapping("/each") public String each(Model model) { addUsers(model); return "basic/each"; } private void addUsers(Model model) { List list = new ArrayList(); list.add(new User("userA", 10)); list.add(new User("userB", 20)); list.add(new User("userC", 30)); model.addAttribute("users", list); } /resources/templates/b..

티스토리툴바