타임리프 스프링 통합 타임리프는 크게 2가지 메뉴얼을 제공한다. 기본 메뉴얼 : https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html Tutorial: Using Thymeleaf 1 Introducing Thymeleaf 1.1 What is Thymeleaf? Thymeleaf is a modern server-side Java template engine for both web and standalone environments, capable of processing HTML, XML, JavaScript, CSS and even plain text. The main goal of Thymeleaf is to provide a www.th..

스프링과 파일 업로드 스프링은 MultipartFile 이라는 인터페이스로 멀티파트 파일을 매우 편리하게 지원한다. SpringUploadController @Slf4j @Controller @RequestMapping("/spring") // 이 컨트롤러의 요청 매핑(prefix)을 "/spring"으로 지정합니다. public class SpringUploadController { @Value("${file.dir}") // 스프링의 프로퍼티에서 값을 읽어와서 변수에 주입. private String fileDir; // 파일을 저장할 디렉토리 경로를 저장하는 변수. @GetMapping("/upload") public String newFile() { return "upload-form"; } @P..

서블릿과 파일 업로드2 서블릿이 제공하는 Part 에 대해 알아보고 실제 파일도 서버에 업로드 해보자. 1. 먼저 파일을 업로드를 하려면 실제 파일이 저장되는 경로가 필요하다. - 해당 경로에 실제 폴더를 만들어두자. - 그리고 다음에 만들어진 경로를 입력해두자. 나의 저장 경로 C:\Inflearn_Spring\file application.properties 에 파일 업로드 경로 설정 예시 내 application.properties file.dir=C:/Inflearn_Spring/file 주의 cf. 2번의 경우 요즘은 굳이 안 넣어도 되나봄. 특히 windows는 \\ 로 구분을 했으나, 요즘에는 / 로 써도 스프링이 전부 호환해줌. ServletUploadControllerV2 @Slf4j @..

템플릿 레이아웃 01 템플릿 레이아웃 이전에는 일부 코드 조각을 가지고와서 사용했다면, 이번에는 개념을 더 확장해서 코드 조각을 레이아웃에 넘겨서 사용하는 방법에 대해서 알아보자. 예를 들어서 Thymeleaf 템플릿에서 공통 헤더 부분을 정의하는 템플릿 프래그먼트다. 이 템플릿은 common_header라는 이름을 가지며, title과 links라는 두 개의 파라미터를 받는다. title 파라미터는 웹 페이지의 타이틀을 동적으로 설정한다. 이를 위해 태그를 사용. 공통 CSS 스타일 시트, favicon, JavaScript 스크립트는 모든 웹 페이지에서 공유되며, th:href와 th:src를 사용하여 경로를 지정한다. links 파라미터는 추가적인 링크를 동적으로 삽입한다. th:block과 th:..

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

자바스크립트 인라인 타임리프는 자바스크립트에서 타임리프를 편리하게 사용할 수 있는 자바스크립트 인라인 기능을 제공한다. 자바스크립트 인라인 기능은 다음과 같이 적용하면 된다. 자바스크립트 인라인 사용 전 결과 자바스크립트 인라인 사용 후 결과 자바스크립트 인라인 사용 전 : 자바스크립트 코드 내에서 Thymeleaf 표현식을 사용하려면 주석 내에 변수 할당 및 표현식을 넣어야 한다. 이 경우, 내추럴 템플릿 주석을 사용하여 주석 처리된 부분에서도 주석 내부의 표현식을 활용할 수 있다. 자바스크립트 인라인 사용 후 : th:inline="javascript" 속성을 사용하여 자바스크립트 인라인 모드로 작성하면, Thymeleaf 표현식을 직접 사용할 수 있다. 이 모드에서는 주석 내부의 Thymeleaf ..