동적 : 주로 실행 중에 변하거나 결정되는 것
파이썬이나 JS는 동적 타이핑 언어이다.
(수업내용 참고)
Thymeleaf
Spring Tool에서의 Servlet/JSP의 경험과 다르게
현재는 IntelliJ IDEA에서 Thymeleaf를 사용한다.
타임리프로 넘어가게 된 이유)
- 솔직히 Spring Tool 개인적으로 불편하다,
강의 내용에서 벗어나게 될 수도 있지만 그냥 넘어가기로 결정했다 - 타임리프는 내추럴 템플릿(Natural Templates)으로
HTML 구조를 그대로 사용하기 때문에 UX쪽의 피드백을 받기 편리 - IntelliJ+Spring Boot+Thymeleaf의 조합이 API 중심 개발에 적합한 환경을 제공한다고 함
(Node.js와 같은 다른 스택과의 연동 향상) - openAI를 활용하기 위해 필요한 파이썬과 같은 동적 언어와의 연계
(동적 언어 <> 웹에서의 동적인 처리 방식)
Thymeleaf는 Spring Boot 프로젝트에서 파일을 동적으로 만들어주는 도구이다.
타임리프는 자바 기반의 현대적인 서버사이드 템플릿 엔진이라고 하는데,
여기에서 서버 사이드란 서버 사이드 렌더링 (SSR: Server-Side Rendering)을 말하는 것이다.
- 서버 사이드 렌더링 (SSR: Server-Side Rendering)을 웹 페이지의 모든 내용을 서버에서 완성해서 사용자에게 보내주는 방식
- 클라이언트 사이드 렌더링(CSR: Client-Side Rendering)
JS 코드를 사용자에게 보내주고 사용자의 클라이언트에서 실행하여 HTML을 완성하는 방식
전자는 초기 로딩이 빠르고 SEO에 유리하다(블로그, 뉴스)
후자는 페이지 전환이 빠르고 UX가 부드럽다(인스타, 지도)
SEO(Search Engine Optimization) : 검색 엔진 최적화
특정 키워드를 검색했을 때
검색 결과의 높은 순위에 나타나도록 만드는 작업과 전략
(SSR이 SEO에 유리한 이유 :
완성된 HTML을 브라우저로 보내는 특징을 가지기 때문)UX(User Experience) :
사용자가 다양한 것들을 사용하면서 가지게 되는 모든 경험
(UI를 포함한 사용 과정을 포함) (UI : 시각적인 요소)HTML 코드 작성 방식의 변화
기존 방식 : 스코어릿(scriptlet)이나 표현식(<%= %>)처럼 HTML 안에 직접 자바 코드를 넣는 방식
스코어릿 : JSP에서 자바 코드를 HTML에 삽입하는 방식
주로 JSP scriptlet으로 불린다.
<% %> 태그로 감싸서 자바 코드를 삽입
이제는?
HTML안에 자바 코드를 직접 삽입 X
(개인적으로 일종의 리팩토링이라고 봐도 될 듯 하다)
th로 시작하는 속성을 사용하여 Controller에서 넘어온 데이터를 HTML에 동적으로 표시한다.
