BackEnd263 [Thymeleaf] 자바스크립트 인라인 인프런 김영한님의 Spring강의에서 공부한것을 올리며, Thymeleaf의 경우 unit 단위로 공부후 각각 정리하는 글을 작성하겠습니다. 자바스크립트 인라인 " data-ke-type="html"> HTML 삽입 미리보기할 수 없는 소스 타임리프는 자바스크립트에서 타임리프를 편리하게 사용할 수 있는 자바스크립트 인라인 기능을 제공한다. 자바스크립트 인라인 기능은 다음과 같이 적용하면 된다. 결과는 다음과 같습니다. ● 텍스트 렌더링 결과 창에서 F12 를 눌러 개발자도구를 열어보면 다음과 같은 경고를 확인할 수 있습니다. UserA가 정의되지 않았다는 경고를 보여주고 있습니다. 이는 var username = UserA; 부분에서 오류가 있기 때문입니다. 문법이 오류이기 때문이죠! var userna.. BackEnd/Thymeleaf 2022. 1. 28. [HTTP] HTTP 메서드 내가 공부한것을 올리며, 중요한 단원은 저 자신도 곱씹어 볼겸 상세히 기록하고 얕은부분들은 가겹게 포스팅 하겠습니다. 1. HTTP API를 만들어보자 " data-ke-type="html"> HTML 삽입 미리보기할 수 없는 소스 우리에게 회원 목록 조회, 단일 회원 조회, 회원 등록, 회원 수정, 회원 삭제 기능을 갖는 API를 만들라고하면 URI를 어떻게 설계 해야할까? 아직 사전지식이 없다면 다음과 같은 형태를 생각할수 있다. - 회원 목록 조회 /read-member-list - 회원 조회 /read-member-by-id - 회원 등록 /create-member - 회원 수정 /update-member - 회원 삭제 /delete-member 과연 좋은 설계라고 할수있을까? 설계의 핵심은 리소.. BackEnd/WEB 2022. 1. 28. [Thymeleaf] 블록 인프런 김영한님의 Spring강의에서 공부한것을 올리며, Thymeleaf의 경우 unit 단위로 공부후 각각 정리하는 글을 작성하겠습니다. 블록 " data-ke-type="html"> HTML 삽입 미리보기할 수 없는 소스 블록은 HTML 태그가 아닌, 타임리프의 유일한 자체 태그이다. 블록은 each 문에서의 불편한점을 보완하는데, 어떤 부분을 보완하는지는 다음 코드를 살펴보자. 컨트롤러와 뷰 코드는 다음과 같다. @GetMapping("/block") public String block(Model model){ List list = new ArrayList(); list.add(new User("UserA", 10)); list.add(new User("UserB", 20)); list.add(n.. BackEnd/Thymeleaf 2022. 1. 28. [Thymeleaf] 주석 인프런 김영한님의 Spring강의에서 공부한것을 올리며, Thymeleaf의 경우 unit 단위로 공부후 각각 정리하는 글을 작성하겠습니다. 주석 " data-ke-type="html"> HTML 삽입 미리보기할 수 없는 소스 원래 주석은 너무 간단한 내용이라 정리하지 않으려다가... 또 타임리프 주석중에 신박한 주석이 있어 이를 위해 글을 작성한다. 간단한 컨트롤러와 뷰 코드를 작성해보자! @GetMapping("/comments") public String comments(Model model){ model.addAttribute("data", "zbqmgldjfh"); return "basic/comments"; } 예시 html data 1. 표준 HTML 주석 2. 타임리프 파서 주석 html .. BackEnd/Thymeleaf 2022. 1. 28. [Thymeleaf] 조건부 평가 인프런 김영한님의 Spring강의에서 공부한것을 올리며, Thymeleaf의 경우 unit 단위로 공부후 각각 정리하는 글을 작성하겠습니다. 조건부 평가 " data-ke-type="html"> HTML 삽입 미리보기할 수 없는 소스 조건부 평가는 말 그대로 if 문과 같이 어떤 문장이 참일경우 실행하는 것 이다. if, unless(if의 반대) 2가지 가 있다. 간단한 컨트롤러는 다음과 같다. @GetMapping("/condition") public String condition(Model model){ List list = new ArrayList(); list.add(new User("UserA", 10)); list.add(new User("UserB", 20)); list.add(new Us.. BackEnd/Thymeleaf 2022. 1. 27. [Thymeleaf] 반복 인프런 김영한님의 Spring강의에서 공부한것을 올리며, Thymeleaf의 경우 unit 단위로 공부후 각각 정리하는 글을 작성하겠습니다. 반복 " data-ke-type="html"> HTML 삽입 미리보기할 수 없는 소스 타임리프에서 반복은 th:each 를 사용한다. 추가로 반복에서 사용할 수 있는 여러 상태 값을 지원한다. 우선 컨트롤러에서 여러 User의 정보를 담아서 model로 반환해 봅시다. @GetMapping("/each") public String each(Model model){ List list = new ArrayList(); list.add(new User("UserA", 10)); list.add(new User("UserB", 20)); list.add(new User(".. BackEnd/Thymeleaf 2022. 1. 27. [HTTP] HTTP 기본 내가 공부한것을 올리며, 중요한 단원은 저 자신도 곱씹어 볼겸 상세히 기록하고 얕은부분들은 가겹게 포스팅 하겠습니다. 1. 모든 것이 HTTP " data-ke-type="html"> HTML 삽입 미리보기할 수 없는 소스 ● HTTP (HyperText Transfer Protocol) 원래 HTTP는 html 파일을 주고받기 위한 프로토콜이였지만, 현재는 거의 모든것을 전송하는 프로토콜이 되었다. - HTML, TEXT - IMAGE, 음성, 영상, 파일 - JSON, XML (API) - 거의 모든 형태의 데이터 전송 가능 - 서버간에 데이터를 주고 받을 때도 대부분 HTTP 사용 ● HTTP 역사 크게 3가지 HTTP가 주로 사용된다. - HTTP/1.1 1997년도에 나왔으며, 가장 많이 사용하.. BackEnd/WEB 2022. 1. 27. [Thymeleaf] 속성 값 설정 인프런 김영한님의 Spring강의에서 공부한것을 올리며, Thymeleaf의 경우 unit 단위로 공부후 각각 정리하는 글을 작성하겠습니다. 속성 값 설정 " data-ke-type="html"> HTML 삽입 미리보기할 수 없는 소스 타임리프에서 속성값을 지정할때는 th:* 와 같이 속성을 적용하면 기존 속성을 대체한다. 만약 기존 속성이 없다면 새로 만든다. 우선 컨트롤러부터 하나 만들어 봅시다. @GetMapping("/attribute") public String attribute() { return "basic/attribute"; } 아주 간단한 컨트롤러 입니다. 이제 이를 처리할 뷰는 다음과 같습니다. 속성 설정 속성 추가 - th:attrappend = - th:attrprepend = -.. BackEnd/Thymeleaf 2022. 1. 27. [Thymeleaf] 연산 인프런 김영한님의 Spring강의에서 공부한것을 올리며, Thymeleaf의 경우 unit 단위로 공부후 각각 정리하는 글을 작성하겠습니다. 연산 " data-ke-type="html"> HTML 삽입 미리보기할 수 없는 소스 연산은 HTML의 엔티티를 사용하는 부분만 주의하면 됩니다. 이번 연산 글은 우선 코드로 살펴본후 설명을 이어 나가겠습니다. 우선 다음 컨트롤러를 확인해 봅시다. @GetMapping("/operation") public String operation(Model model) { model.addAttribute("nullData", null); model.addAttribute("data", "zbqmgldjfh"); return "basic/operation"; } 이를 처리하는.. BackEnd/Thymeleaf 2022. 1. 26. [Thymeleaf] Literals 인프런 김영한님의 Spring강의에서 공부한것을 올리며, Thymeleaf의 경우 unit 단위로 공부후 각각 정리하는 글을 작성하겠습니다. 리터럴 " data-ke-type="html"> HTML 삽입 미리보기할 수 없는 소스 타임리프에는 대표적으로 다음과 같은 리터럴들이 있습니다. 리터럴은 일반적으로 소스 코드상에 고정된 값을 말하죠! 문자: 'hello' 숫자: 10 불린: true, false null: null 타임리프에서는 문자 리터럴의 경우 항상 '(작은 따옴표) 로 감싸줘야 합니다. 문제는... 이게 항상 ' 로 감싸는게 귀찮다는 점 이죠. 따라서 타임리프에서는 공백없이 쭉 이어진 경우 의미있는 토큰으로 인식하여 다음과 같이 따옴표를 생략할수도 있습니다. 하지만 다음과 같이 공백이 있는경우.. BackEnd/Thymeleaf 2022. 1. 26. [Thymeleaf] URL 링크 인프런 김영한님의 Spring강의에서 공부한것을 올리며, Thymeleaf의 경우 unit 단위로 공부후 각각 정리하는 글을 작성하겠습니다. URL 링크 " data-ke-type="html"> HTML 삽입 미리보기할 수 없는 소스 타임리프에서 URL을 생성할 때는 @{...} 문법을 사용하면 된다. 우선 간단한 컨트롤러부터 하나 만들어 봅시다! @GetMapping("link") public String link(Model model){ model.addAttribute("param1", "data1"); model.addAttribute("param2", "data2"); return "basic/link"; } 이를 처리할 뷰 또한 다음과 같습니다. URL 링크 basic url hello que.. BackEnd/Thymeleaf 2022. 1. 26. [Thymeleaf] 유틸리티 객체와 날짜 인프런 김영한님의 Spring강의에서 공부한것을 올리며, Thymeleaf의 경우 unit 단위로 공부후 각각 정리하는 글을 작성하겠습니다. 유틸리티 객체와 날짜 " data-ke-type="html"> HTML 삽입 미리보기할 수 없는 소스 타임리프는 문자, 숫자, 날짜, URI등을 편리하게 다루기 위한 유틸리티 객체들을 제공한다. ● 타임리프 유틸리티 객체들 #message : 메시지, 국제화 처리 #uris : URI 이스케이프 지원 #dates : java.util.Date 서식 지원 #calendars : java.util.Calendar 서식 지원 #temporals : 자바8 날짜 서식 지원 #numbers : 숫자 서식 지원 #strings : 문자 관련 편의 기능 #objects : 객체.. BackEnd/Thymeleaf 2022. 1. 26. 이전 1 ··· 16 17 18 19 20 21 22 다음
