여러가지 질문과 제가 이해한것이 맞는지 확인하고 싶어요

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요.

1. 강의 내용과 관련된 질문을 남겨주세요.
2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요.
(자주 하는 질문 링크: https://bit.ly/3fX6ygx)
3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요.
(질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG)

질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요.
=========================================
[질문 템플릿]
1. 강의 내용과 관련된 질문인가요? (예/아니오)
2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오)
3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오)

[질문 내용]

질문 1.

href="../css/bootstrap.min.css" rel="stylesheet">

Items.html에서 위 코드를 보았을 때

th가 경로를 치환하는 역할이면 굳이 치환하지 않고

href="@{/css/bootstrap.min.css}

바로 사용해주어도 상관이 없을것 같은데 굳이 치환을 하는 이유가 있나요?

질문 2.

모델이라는것이 아직 이해를 못했었는데 나름대로 이해를 해보았습니다.

@RequestMapping(“경로“) 처럼 매핑경로로 결정된 클래스가 실행이 되고 동작하면서 반환되는,

예를들면 BasicItemController클래스의 리턴인

“basic/items” 뷰에 데이터가 담긴 모델을 넘겨주고

(아직 addAttribute(“items”, items)의 첫번째파라미터 두번째 파라미터는 무엇인지 잘 모르겠어요)

뷰는 전달받은 모델에서 데이터를 꺼내와 동적인 기능을 수핸하는 것인지

예를들어보면 모델을 물건이 담긴 박스, 데이터가 박스에 담긴 물건, 뷰를 물건을 꺼내어 사용하는 사람이라고 할때 박스(모델)에 담긴 물건(데이터)을 꺼내어 보여주는(뷰 템플릿) 것으로 예시를 들 수 있나요?

질문 3.

프론트앤드 개발자 분이 html마크업을 끝낸 파일을 주어도 결국 백엔드 개발자가 타임리프에 맞는 형식으로 타임리프 임포트를 하고 th문법을 사용해야 하는건가요? 그리고 th가 thymeleaf의 th인가요?

안녕하세요. 양치잘하기님

질문 1에 대한 답변

th:href="@{/css/bootstrap.min.css}"를 사용하는 이유는 Thymeleaf 템플릿 엔진에서 경로를 동적으로 처리하기 위함입니다. Thymeleaf는 th: 속성을 통해 서버 측에서 경로를 동적으로 생성하고 치환할 수 있습니다.

href="@{/css/bootstrap.min.css}"와 같이 직접 경로를 지정하는 것도 가능하지만, 이 경우 애플리케이션의 컨텍스트 경로가 변경되거나 서버 환경에 따라 경로가 달라질 수 있습니다. 반면에 th:href를 사용하면 Thymeleaf가 애플리케이션의 컨텍스트 경로를 자동으로 처리하므로 경로 변경에 유연하게 대응할 수 있습니다.

또한 th:href를 사용하면 Thymeleaf의 URL 표현식을 활용할 수 있어 파라미터 전달이나 동적 경로 생성 등 다양한 기능을 활용할 수 있습니다.

관련해서 자세한 내용은 다음을 참고해주세요.

https://www.inflearn.com/questions/193822

질문 2에 대한 답변

모델(Model)은 컨트롤러에서 뷰로 데이터를 전달하기 위한 객체입니다. 컨트롤러에서 모델에 데이터를 담아 뷰에 전달하면, 뷰는 전달받은 모델에서 데이터를 꺼내와 동적으로 화면을 구성합니다.

addAttribute("items", items)에서 첫 번째 파라미터는 모델에 담을 속성의 이름이고, 두 번째 파라미터는 실제 데이터입니다. 위 코드에서는 "items"라는 이름으로 items 데이터를 모델에 담고 있습니다.

적어주신 예시와 같이 모델을 물건이 담긴 박스, 데이터를 박스에 담긴 물건, 뷰를 물건을 꺼내어 사용하는 사람으로 비유할 수 있습니다. 컨트롤러에서 모델(박스)에 데이터(물건)을 담아 뷰(사람)에게 전달하면, 뷰는 모델에서 데이터를 꺼내와 화면을 동적으로 구성하는 것으로 이해할 수 있습니다.

질문 3에 대한 답변

프론트엔드 개발자가 작성한 HTML 마크업 파일을 백엔드 개발자가 Thymeleaf 템플릿으로 변환해야 합니다. 백엔드 개발자는 Thymeleaf 문법을 사용하여 동적인 부분을 처리하고, 필요한 데이터를 모델에 담아 뷰로 전달합니다.

th는 Thymeleaf의 약어로, Thymeleaf 템플릿 엔진에서 사용되는 속성입니다. th:text, th:each, th:if 등 다양한 th 속성을 통해 동적인 처리를 수행할 수 있습니다.

따라서 프론트엔드 개발자와 백엔드 개발자 간의 협업이 필요합니다. 프론트엔드 개발자는 HTML 마크업을 작성하고, 백엔드 개발자는 해당 마크업을 Thymeleaf 템플릿으로 변환하여 서버 측 로직과 연동하는 작업을 수행합니다.

감사합니다.

인프런 커뮤니티 질문&답변