스프링에서 웹 개발을 할 수 있는 방법은 크게 3가지가 있다.
1. 정적 컨텐츠
2. MVC와 템플릿 엔진
3. API
이 3가지 방식 중 정적 컨텐츠 제외하고 실무에서 나머지 2, 3번이 많이 쓰인다고 한다!
1. 정적 컨텐츠
정적 컨텐츠는 html 파일을 그대로 읽어와 웹에 뿌려주는 컨텐츠이다.
예시 방법은 다음과 같다.
hello-spring(프로젝트 이름) -> src -> main -> resources -> static 경로에 들어가 hello-static.html 파일을 생성해 준다.
생성해 준 후 다음 코드를 삽입해 준다.
<!DOCTYPE HTML>
<html>
<head>
<title>static content</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
정적 컨텐츠 입니다.
</body>
</html>
그런 후 build를 해주게 되면
http://localhost:8080/hello-static.html 를 주소 창에 검색하게 되면 위에 코드로 작성한 html 파일이 그대로 띄워지게 된다.
만약 매핑이 된 hello-static 관련 컨트롤러가 있으면 그것이 우선순위로 접근하게 되고, 없는 경우에 html 파일을 그대로 가져와서 읽는 것이라고 한다.
hello-spring -> src -> main -> java -> hello.hellospring -> controller -> HelloController 에서 코드로 @GetMapping()을 해주면 그것이 우선순위 첫 번째가 되는 것 같다.(이것이 나머지 방식인 거 같다)
실행 결과이다.
2. MVC와 템플릿 엔진
MVC는 Model View Controller의 약자이다.
가장 많이 하는 방식으로, html을 서버에서 프로그래밍을 해서(동적으로 바꿔서) 웹에 뿌려지는 템플릿 엔진 방식이다.
hello-spring -> src -> main -> java -> hello.hellospring -> controller -> HelloController에 들어가 다음 코드를 넣어준다.
@GetMapping("hello-mvc")
public String helloMvc(@RequestParam("name") String name, Model model) {
model.addAttribute("name", name);
return "hello-template";
}
http://localhost:8080/hello-mvc 에서 "name"의 키를 name으로 바꿔주는데, hello-template에서 반영하라는 말인 거 같다.
그러면 hello-template를 만들어야 하는데,
hello-spring(프로젝트 이름) -> src -> main -> resources -> static 에서 hello-template.html 파일을 작성하고 내용을 다음과 같이 채워준다
<html xmlns:th="http://www.thymeleaf.org">
<body>
<p th:text="'hello ' + ${name}">hello! empty</p>
</body>
</html>
강의에서 내가 첫 번째 스프링부트 포스팅에서 추측했던 th에 대해서 설명해주셨던 내용을 짚어주었다.
직접경로로 들어가면 껍데기로 보이게된다. 그리고 템플릿 엔진으로 접속하게 되면 th에 있는 내용을 출력하게 하는 것이다.
그리고 빌드 후 실행하게 되면...
이렇게 에러 페이지가 뜨게 된다.
그 이유는 키(name) 값이 지정이 안 되었기 때문인데 이는 주소 창에서 설정이 가능하다.
localhost:8080/hello-mvc?name=spring!!!!!!를 주소 창에 입력하게 되면 정상적으로
정상적으로 뜨는 것을 확인할 수 있다.
템플릿 엔진을 통해 html이 변환되어 웹을 보여주는 원리라고 할 수 있다.
3. API
API는 JSON이라는 데이터 포맷으로 client에게 데이터를 전달하는 방식이다.
hello-spring -> src -> main -> java -> hello.hellospring -> controller -> HelloController에서 다음 코드를 작성한다.
@GetMapping("hello-string")
@ResponseBody
public String helloString(@RequestParam("name") String name) {
return "hello " + name; // "hello spring"
}
여기서 ResponseBody는 return 값을 직접 html 값으로 넣는다 라는 뜻으로 이해할 수 있다.
그렇게 되면
언뜻 보기에 템플릿 엔진과 같은데? 라고 생각할 수 있지만
API 방식으로는 html 파일을 작성하지 않았다.
return 값 그대로 html 파일을 작성한 것이라고 생각하면 된다.
다음 코드도 작성해보자
@GetMapping("hello-api")
@ResponseBody
public Hello helloApi(@RequestParam("name") String name) {
Hello hello = new Hello();
hello.setName(name);
return hello;
}
static class Hello {
private String name;
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}
이것은 Hello라는 클래스를 만들고 name을 설정하고 불러오는 setName(), getName() 함수를 작성하였다.
그리고 객체를 만들어 name을 설정하고 그 객체의 값을 넘겨주었다.
그렇게 되면
위와 같은 화면이 뜨게 된다.
객체가 반환이 되었을 때 JSON 방식으로 데이터를 만들어서 html 화면을 띄워주겠다 라는 규칙이 있는 듯하다.
실무에서 api 객체 내용을 바꾸지 않고 이 방식 그대로 쓴다고 한다.
다양한 방법으로 웹 페이지를 작성해 보았다.
다양한 방법들이 있지만 api를 사용해서 html 값을 리턴하거나 객체를 리턴하는게 사용하기에 편리해 보였다.
앞으로 더 열심히 공부해야겠다!
'Spring Boot(스프링 부트)' 카테고리의 다른 글
| 자바 기초 문법 및 웹 이해 (10) | 2024.11.05 |
|---|---|
| Spring Boot(스프링 부트) > 회원 서비스 개발 2 - 전 포스팅에 이어서... (4) | 2024.05.28 |
| Spring Boot > 세션과 쿠키 (0) | 2024.05.28 |
| Spring Boot(스프링 부트) > 백엔드 개발(회원 관리 예제) (5) | 2024.05.28 |
| Spring Boot(스프링 부트) > 간단한 View 환경설정과 빌드하고 실행하 (4) | 2024.05.16 |
