Today I learned...
Spring Boot로 웹서비스를 공부한 지 4일 차가 되었다! 어느 정도 눈에 익기 시작한 것도, 아직은 많은 부분이 가려져 있다고도 느낀다. 일단은 오늘 배운 내용을 간단히 정리해보려고 한다.
템플릿 엔진
지정된 템플릿 양식과 데이터가 합쳐져 HTML 문서를 출력하는 소프트웨어
여기서 서버 템플릿 엔진과 클라이언트 템플릿 엔진으로 갈리게 되는데, 렌더링을 서버 측에서 하냐, 혹은 클라이언트 측에서 하냐의 차이가 된다. 흔히들 사용하는 React.js, Vue.js같은 SPA는 클라이언트에서 렌더링을 수행한다. Mustache(머스테치)는 자바에서 사용될 때는 서버 템플릿, 자바스크립트에서 사용될 때는 클라이언트 템플릿 엔진으로 모두 사용될 수 있다.
다른 템플릿 엔진으로는 어떤 것이 있을까?
JSP, Velocity: 스프링 부트에서 비권장하는 엔진들
Thymeleaf: 얼마전 우테코 강의 영상에서 봤는데 문법이 많이 어렵다고 한다. Vue.js 같은 태그 속성 방식에 익숙하면 괜찮아진다는 데 아마 외워야 하는 태그가 상당히 많은 모양이다
여기서 사용되는 Mustache는 스프링에서 공식적으로 지원하기에 의존성 추가도 매우 쉽게 할 수 있다.
mustache 의존성 추가
compile('org.springframework.boot:spring-boot-starter-mustache') // Mustache 템플릿 엔진Dependencies에 추가하면 완성이다.
기본적인 mustache 파일 작성
기본적인 스프링 부트에서 사용되는 파일 위치는 /src/main/resources/templates 하에 위치해야 한다. 해당 루트에 이런 형태로 코드를 작성할 수 있다.
<!DOCTYPE HTML>
<html>
<head>
<title>스프링 부트</title>
<meta content = "text/html; charset=UTF-8" />
</head>
<body>
<h1>본문</h1>
</body>
</html>보면 알 수 있지만, 그냥 HTML과 큰 차이가 없다. 문법에서의 차이는 동적인 데이터 추가를 할 때 볼 수 있다.
Controller에서 View 반환
이 부분이 조금 놀라웠다. mustache-starter가 자동으로 templates에서 해당 문자열을 가진 .mustache 파일을 검색, 해당 HTML을 렌더링 후 반환하는 기능을 가지고 있다. 즉, Spring 개발자는 해당 mustache를 반환하기 위해 문자열만 리턴하는 메서드를 작성하면 된다.
@GetMapping("/")
public String index() {
return "index";
}View를 테스트 하기
제목만 봤을 땐 조금 의아했다. mustache가 잘 작동하는지 확인하는 코드를 어떻게 작성할 수 있을까? 파일을 가져와서 1:1로 비교를 하는 것인가? 데이터가 들어간다면 많이 달라질 텐데? 란 생각을 했는데 저자는 HTML이 결국 문자열인 걸 이용해 .contains() 메서드로 mustache 파일 안에 있는 문자열이 반환된 HTML문자열 내에 있는 지를 검사하는 식으로 검증을 했다. 뭔가 예상보단 조금 단순했지만 작동만 잘 된다면 문제없이 검증할 수 있는 방법이긴 했다 :p
@RunWith(SpringRunner.class)
@SpringBootTest(webEnvironment = SpringBootTest.WebEnvironment.RANDOM_PORT)
public class IndexControllerTest {
@Autowired
private TestRestTemplate restTemplate;
@Test
public void fetch_main_page() {
// when
String body = this.restTemplate.getForObject("/", String.class);
//then
assertThat(body).contains("HTML 문서 내에 정적으로 있는 검증용 문자열");
}
}게시글 CRUD
자세하게 적기보단 mustache란 게 어떻게 생겼고 어떻게 사용하는 지만 짚고 넘어갈 생각이라 Spring 관점에서 조금 더 와닿는 것을 적어보겠다. API 호출은 mustache에서 먼저 jQuery를 호출, 이후에 ajax() 기능을 이용해 HTTP호출 및 후처리를 도맡아 진행하게 한다.
여기서 JS는 정적파일로 Spring 서버 내에서 불려지게 되는데 정적 파일은 src/main/resources/static/ 아래에 위치하게 된다. JS는 src/main/resources/static/js/... 아래에 위치하면 mustache에서 <script src"/js/..."></script> 태그로 불러올 수 있게 된다.
SpringDataJpa와 @Query
여기서 신기한 점은 해당 프로젝트에서 생 쿼리를 작성했다는 점이다. @Query어노테이션을 사용하여 쿼리를 입력할 수 있다. JPA 기능만으로도 구현은 가능하지만 복잡도가 올라가 이런 방식으로 작성했다고 한다. JPA를 사용했으면 어떻게 되었는지 서술되어 있었다면 좋았을 거 같다.
규모가 있는 프로젝트에서의 데이터 조회는 FK의 조인, 복잡한 조건 등을 인해 Entity 클래스 만으로 처리가 어려워 조회용 프레임워크를 별도로 사용한다고 한다. 주로 querydsl, jooq, MyBatis 등이 있는데, QueryDSL은 타입 안정성 보장이 되고, 국내 많은 회사가 사용, 그로 인해 레퍼런스가 매우 많다는 장점이 있어 해당 프레임워크를 추천한다고 서술되어 있다.
해당 내용도 DB 입출력을 위해 필수로 알아두면 좋을 것 같다.
What I think is...
오늘은 개발자로서 어떠한 역량이 필요한 지 생각을 조금 더 깊이 가진 시간이 되었던 것 같다. 아침에 피곤하고 머리가 잘 돌아가지 않을 때, 명상을 간단하게 하고 바로 컴퓨터를 열어 하루에 코테 2개씩 꾸준히 풀면 도움이 되지 않을까 한다. 재밌는 문제도 많고 PS는 어디서나 필수 역량이니깐 말이다.
1. 코딩테스트 역량 키우기
2. Spring Boot 서비스 출시 ⇒ Spring 내부적인 공부 이어가기 로드맵
3. Spring에 대한 영어 원서 읽어보기
대충 이 정도로 생각해보고 있다.
Tomorrow, I will learn...
1. 오전 시간에 PS 문제 2개 클리어
2. 오후 시간에 스프링 Ch5 풀고, PS와 스프링 블로그 정리
3. 스프링에 대한 영어 비디오와 원서 1개씩 읽어보기
4. 운동하기
'Programming > Spring(Spring Boot)' 카테고리의 다른 글
| Spring Boot와 React를 위한 개발환경 구축하고 같이 빌드하기 (0) | 2023.06.20 |
|---|---|
| [TIL] Spring Boot - 자바 코드로 직접 스프링 빈 제공하기, 의존성 주입 (0) | 2023.06.20 |
| [TIL] Spring Boot - 스프링 빈, 컴포넌트, Test코드와 JUnit 5 (0) | 2023.06.19 |
| [TIL] Spring Boot - OAuth2, Spring Security, Serializable (0) | 2023.05.26 |
| [TIL] Spring Boot 3일차 (0) | 2023.05.24 |