밍경송의 E.B
SPRING 2 - VIEW 환경설정, Controller 본문
**이 글은 인프런의 <스프링 입문-코드로 배우는 스프링부트, 웹 MVC, DB접근 기술>의 내용을 바탕으로 작성하였습니다.
지난 시간에 HelloSpringapplication의 메인 메소드의 실행을 통해 개발을 위한 환경설정을 모두 마쳤는데요.
아직까지는 localhost:8080에 접속하여도 Error page라는 문구밖에 뜨질 않습니다.
두둥 그래서 이번에는 html을 이용하여 hello라는 글자가 출력되는 Welcome page를 만들어보도록 하겠습니다!
프론트를 다루는 강의였으면 좀 더 디테일하고도 예쁘게 만들어보려는 시도를 했겠지만,,
이 강의 백엔드 강의이므로 기존에 작성된 코드만을 복붙하여 사용했습니다. 스껄
static->index.html을 생성해주시고, 아래 코드를 따라치면 됩니다.
<!DOCTYPE HTML>
<html>
<head>
<title>Hello</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
Hello
<a href="/hello">hello</a>
</body>
</html>
다음으로 Controller 패키지를 하나 생성해볼 건데요.
Controller에 대해 알려면, 스프링 프레임워크가 MVC 패턴을 사용하고 있다는 점을 알아야 합니다.
여기서 MVC(Model - View - Controller)란 사용자의 인터페이스/로직을 구현 및 제어하는 것을 말합니다.
그렇다면 Controller란?
-> 사용자가 화면(view)단에서 입력과 같은 이벤트를 행했을 때, 그 이벤트에 맞는 화면(view)나 로직(model)을 실행할 수 있도록 해주는 역할을 하는 친구로, View와 Model을 연결시켜주는 역할을 하는 친구입니다.
저도 controller에 무지하므로 강의에서 시키는 대로 따라쳐보도록 했습니다..
@Controller을 쳐서 springframework라고 뜨는 것을 누르면 자동으로 색깔이 바뀌면서 적용됩니다.
Controller파일을 모두 만들면, templates 아래에 hello.html 파일을 생성해서 아래와 같은 내용을 넣어줍니다.
두 파일 간 어떤 연결점과 변화가 생길까요?
<html xmlns:th="http://www.thymeleaf.org">
ㄴ일단 이것은 thymeleaf 문법을 사용할 수 있는 코드입니다.
일전에 startspring.io로 프로젝트를 생성할 때 thymeleaf 라이브러리를 추가했던 것 기억하시죠?
<p th:text="'안녕하세요. ' + ${data}" >안녕하세요. 손님</p>
->이부분이 중요한데요. 여기서 data부분이, 앞서 작성한 HelloController 파일의
model.addAttribute("data", "hello!!");
->model 부분에 의해서 hello!! 로 바뀐다는 점 이해가시나요?
결과물은 이렇습니다. Key값인 data에 부여했던 Value hello!가 나왔네요.
*참고로 꼭 run을 중단하고 다시 실행해줘야 보입니다.!
하 여러분은 지금 컴퓨터 진짜 똥망느려서 갑자기 열이 확 받은 여성의 블로그를 보고 계십니다.
그림으로 보면 조금 더 이해가 편합니다. 그러니까 model의 return값이 hello라서,
spring이 자체적으로 resources-> templates-> hello라는 이름의 .html 파일을 찾아 이를 처리한다는 말인데요..
어렵죠?
네 저도 그래요..
그럼 다음 시간에는 springboot를 이용해 빌드하고 실행하는 방법 +a 의 내용과 함께 찾아오겠습니다. 뿅
'lang. > SPRING' 카테고리의 다른 글
SPRING 4- 스프링 웹 개발 (정적 컨텐츠, MVC와 템플릿 엔진, API) (0) | 2023.03.17 |
---|---|
SPRING 3- CMD로 SPRING BUILD하기(윈도우) (0) | 2023.03.15 |
SPRING 1- 프로젝트 환경 설정 및 라이브러리 탐색 (2) | 2023.03.13 |