현재는 localhost:8080 을 치면 에러페이지만 나오고 있다. 이제 한번 다른 페이지를 띄워보자!!
위와 같이 main -> java -> resources -> static 폴더에 index.html 이라는 파일을 하나 만들어주자.
그 후, index.html 에 위의 간단한 html 코드를 쳐보자.
코드를 친 후 서버를 다시 재시작 해보면
위와 같은 새 창이 보이는 것을 확인할 수 있다.
Spring Boot 는 Welcome Page 기능을 제공한다. static 안에 있는 index.html 파일을 가장 먼저 찾아서 이를 Welcome Page로 띄우게 된다.
우리가 추가했던 Thymeleaf 는 템플릿 엔진의 일종으로, 템플릿 엔진은 템플릿 양식과 특정 데이터 모델에 따른 입력 자료를 합성하여 결과 문서를 출력하는 소프트웨어 또는 소프트웨어 컴포넌트를 말한다.
이제 한번 동적인 화면을 만들어보도록 하자.
위와 같이 main -> java -> com.example.hellospringboot 에 controller 라는 package를 하나 만들어주자. 그리고 이 package에 HelloController 라는 Class를 하나 만들어주었다.
그러면 위와 같은 코드가 뜨는 것을 확인할 수 있다.
이 Class에 위와 같은 코드를 쳐보자.
그 후 main -> resources -> templates 에 가서 hello.html 파일을 하나 만들어준다.
hello.html 에는 위와 같은 코드를 한번 써보자.
<html xmlns:th="http://www.thymeleaf.org">
위 코드 문장을 써주면 Thymeleaf 템플릿 엔진의 문법을 쓸 수 있게 된다.
<p th:text="'안녕하세요. ' + ${data}" >안녕하세요. 손님</p>
그 후 위 코드의 ${data} 를 봐보자.
model.addAttribute(attributeName: "data", attributeValue: "hello!");
HelloController 에서 위와 같은 코드를 쓴 것을 기억할 것이다.
${data} 에서 data 는 attributeName 을 뜻하고, ${data} 자체는 attributeValue 에 담겨있는 "hello!" 로 치환되게 된다.
한번 서버를 다시 재시작 한 뒤, localhost:8080/hello 로 들어가보면
위와 같은 창이 뜨는 것을 확인할 수 있을 것이다!
위의 그림을 보며 Spring Boot 의 동작 원리를 이해해보도록 하자.
아까처럼 웹 브라우저에서 localhost:8080/hello 를 던졌다고 가정해보자.
Spring Boot 가 내장하고 있는 Tomcat 서버는 이 신호를 받은 뒤 Spring 으로 넘기게 된다.
그러면 우리가 만들어준 Controller 코드 중
@GetMapping("hello")
public String hello(Model model){
model.addAttribute("data","hello!");
return "hello";
}
에서 @GetMapping 안에 있는 URL 과 매칭이 되면 이 메소드를 실행하게 된다.
그 후 Spring 이 Model 을 만들어주게 되고, Model의 Key 와 Value 값을 입력해주면 저장된다.
마지막으로 Controller에서 return 해주면 viewResolver가 return 해주는 이름의 파일을 찾아서 rendering, 즉 화면에 띄워주게 된다.(Thymeleaf 템플릿 엔진 처리)
그러면 hello.html 의 ${data} 에서 data 는 우리가 Model의 Key 값에 넣어주었던 값이고 ${data} 전체는 우리가 Model의 Value 로 넣어주었던 것으로 치환되게 된다!
● Spring boot 템플릿 엔진 기본 viewName 매핑
-> 'resources:templates/' + (viewName) + '.html'
'BackEnd > Spring Boot' 카테고리의 다른 글
| API 란? (4) | 2022.10.03 |
|---|---|
| MVC 와 템플릿 엔진 (0) | 2022.10.01 |
| 정적 컨텐츠 (0) | 2022.10.01 |
| 콘솔에서 Build 하고 실행하기 (0) | 2022.09.30 |
| Project 생성하기 (2) | 2022.09.25 |
