keepgoing 2022. 9. 19. 23:15

<제가 오늘 공부한 것을 정리하는 글입니다. 내용이 부정확할 수 있습니다. 혹시 부정확한 내용이 있다면 댓글로 알려주시길 부탁드립니다 ^^ >

 

왜 JSTL을 사용해야 할까요? 

 웹 개발을 하시다보면 MVC 패턴을 한번쯤은 들어보셨을겁니다. 웹개발에서 아주 핵심적인 개념이기 때문이죠 ㅎㅎ 

 

그렇다면 MVC는 무엇이고 중요한걸까요?

 MVC에서 M은 Model을, V는 View를 C는 Controller를 의미합니다. 개발자들이 Model과 View와 Controller를 나눈 이유는 웹 개발에는 각자의 역할을 나눠서 분업을 하는데요 그 역할은 퍼블리셔, 프론트엔드 개발자, 백엔드 개발자, DB 설계자.. 등 꽤나 다양합니다. 이러한 역할의 분업을 더 수월하게 하기 위해 우리는 MVC 패턴을 이용하는 겁니다. 

 

MVC 패턴을 사용하면 분업이 수월해진다.

 MVC 패턴은 프론트엔드 개발자의 역할과 백엔드 개발자의 역할을 분리해줍니다. Java 진영에서는 이럴 때 Servlet 방식을 사용합니다. Servlet은 클라이언트에서 서버에 값을 요청(프론트엔드)을 하면 서버에서 이를 받아 처리를 하고 다시 클라이언트로 넘겨줍니다(백엔드) 하지만, View와 Controller를 분리하는 것 생각만큼 쉬운 일만은 아닙니다. 예를 들어 프론트엔드 개발자가 버튼 하나를 수정한다고 했을 때 이 버튼의 수정이 백엔드 영역에 영향을 주면 안되겠지요? 그런 개발이 최대한 이뤄지도록 하기 위해 생긴 기술이 JSTL과 EL(표현언어)입니다. 

 

EL? JSTL?

 EL(Expression Language)(표현 언어)는 프론트엔드 개발자가 자바언어를 숙지하지 않고 있어도 프론트엔드 개발을 수월하게 개발할 수 있도록 도와주는 언어입니다. 이유는 아래 코드로 간략하게 설명하겠습니다.

// 자바 언어를 이해해야 하는 스크립트릿이 들어간 코드
<input type="text" value="<%=request.getParameter("msg")%">

// EL로 선언된 html 코드
<input type="text" value="${msg}">

보기에도 브라우저 개발 입장에선 확실히 간편해지겠죠? 자바 언어를 숙지하지 않아도 변수명만 가져와서 사용할 수 있으니까요!

 JSTL(JSP Standard Tag Library)(JSP 표준 태그 라이브러리)는 말그래도 JSP의 태그 라이브러리입니다. 이 라이브러리를 이용해서 프론트엔드 개발자가 자바언어를 쓰지 않아도 SQL 쿼리를 작성한든지, core tag를 이용해서 반복문 처리, 제어문, 파라미터 값 가져오기... 등을 원활하게 수월할 수 있게 되는 겁니다.

<sql:update datasource"${db}">
	update tblMember set name=? where id=?
  	<sql:param value="${'원피스 루피'}"/> //첫번째 ?의 값
    <sql:param value="${'idOne'}"/> //두번째 ?의 값
</sql:update>

위 코드가 JSTL SQL 태그의 예시입니다 java 코드였다면 PreparedStatement 객체를 가져와서 setString같은 선언을 해줘야 했겠지만 JSTL은 아주아주 간편하게 코드를 작성하고 이해할 수 있게 만들어줍니다.

 

<c:redirect>

 

<c:redirect url="http://www.oracle.com"/>

 

redirect 코어 태그는 response.sendRedirect() 메소드와 같은 기능을 합니다. 이 기능은 화면을 지정된 url 경로로 전환해주는 역할만을 수행합니다.(forward 처럼 요청한 페이지에 자신의 pageContext(페이지 정보)값을 모두 넘기지 않습니다.)

 

<c:catch>

<c:catch var="e">

catch 태그는 catch-exception과 유사한 기능을 합니다.

 

JSTL의 Core Tag의 종류는 14가지 입니다.

<c:set>, <c:out>, <c:forEach>, <c:forTokens>, <c:if>, <c:when>, <c:otherwise>, <c:url>, <c:param>, <c:choose>, <c:remove>, <c:import>, <c:catch>, <c:redirect>

 

Formatting Tag

포맷팅 태그를 사용하기 위해선 지시자(direct)가 필요합니다.

<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>

위 코드는 Formattion Tag를 JSP에서 사용하기 위한 지시자 선언입니다.

 

<fmt:requestEncode>, <fmt:setLocale>

<fmt:setLocale value="ko_kr"/> // ko는 국가, kr은 언어
<fmt:requestEncoding value="EUC-KR"/> //요청된 문자코드를 한글로 설정해줍니다.

번외) html 또는 JSP 파일에서 form 태그에 action 값이 지정되어 있지 않다면 자신의 페이지로 요청된 값이 넘어옵니다.

 

<fmt:formatNumber>, <fmt:parseNumber>

<c:set var="num" value="123456789"/>
<fmt:formatNumber value="${num}" type="number"/> //num 변수의 타입을 number로 지정해준다.
//이외에도 formatNumber 태그의 속성 값은 다양하니 필요하면 검색해서 찾아보자
<fmt:parseNumber var="i" integerOnly="true" "123.456"/> 
${i} //실수를 제외한 123만 결과로 출력합니다.

<fmt:formatDate>, <fmt:timeZone>, <fmt:setTimeZone/>

<c:set var="dayTime" value="<%=new Date()%>"/> //Date 객체를 선언합니다.

//년,월,일 형식에 맞게 출력해줍니다.
//ex) 2022년 9월 19일과 같이
<fmt:formatDate value="${dayTime}" type="date" dateStyle="full"/> 

// type에는 date 또는 time 또는 both가 있습니다. 
//date는 년/월/일, time은 시/분/초, both는 둘 형식을 모두 출력해줍니다.
<fmt:formatDate value="${dayTime}" type="date" dateStyle="full"/> 
<fmt:timeZone value="Europe/London"> //타임존을 유럽/런던으로 지정해서 날짜와 시간이 런던 기준
	<fmt:formatDate value="${dayTime}" type="both" dateStyle="full" timeStyle="full"/>
</fmt:timeZone>

 

<fmt:setBundle/>, <fmt:message/>

Bundle은 묶음이란 의미를 갖고 있습니다. 여기서 쓰이는 Bundle은 properties 파일 안에 선언된 변수들의 값들을 묶음으로 갖고 있는 태그라고 생각하시면 편할 것 같습니다.

 

<fmt:setBundle var="note" basename="ch18.note"/> //bundle 경로를 지정해주고 note에 담아줍니다.

// properties 파일 안에는 키=값의 형태로 변수가 선언되어 있습니다.
<fmt:message bundle="${note}" key="country"/> //키가 country인 값을 요청(출력)합니다.
<fmt:message bundle="${note}" key="msg">
	<fmt:param value="${note.msg}"/> // 키가 msg인 변수는 {0}을 값을 갖고 있습니다.
    //msg param에 담긴 값이 출력됩니다.
    <fmt:param value="아무 값"/> //{1}을 갖고 있는 값에 채워집니다.
    <fmt:param value="아무 값"/> //{2}을 갖고 있는 값에 채워집니다.
</fmt:message>

 

포맷팅 태그의 종류는 11가지 입니다.

<fmt:requestEncoding>, <fmt:parseLocale>, <fmt:formatDate>, <fmt:parseDate>, <fmt:setTimeZone>, <fmt:timeZone>, <fmt:setBundle>, <fmt:bundle>, <fmt:param>, <fmt:message>, <fmt:formatNumber>

 

JSTL의 SQL 태그

 

<sql:setDataSource>, <sql:query>

//application 저장소에 dataSource 정보를 번수 db에 담고 저장합니다.
<sql:setDataSource
	url="jdbc:mysql://127.0.0.1:3306/mydb"
    driver="org.git.mm.mysql.Driver" user="root" password="1234" var="db" 
    scope="application"/>
    
<sql:query var="lists" dataSource="${db}">
	select id, name from tblMember
</sql:query>

<c:forEach var="member" value="${lists.rows}"> //mysql에서 row라는 키워드를 기본적으로 제공
	${member}
</c:forEach>

 

<sql:update>, <sql:param>

<sql:update dataSource="${db}">
	update tblMember set name=? where id=?
	<sql:param value="${'원피스 루피'}"/>
    <sql:param value="${'idOne'}"/>
</sql:update>

 

이렇게 SQL 태그가 끝이 났습니다. 여기서 소개된 SQL 태그는 4가지 입니다.

<sql:setDataSource>, <sql:query>, <sql:update>, <sql:param>

 

마지막으로 Function 태그가 있습니다. Function Tag는 문자열을 조작하기 위한 기능을 제공합니다 

<c:set var="str" value="JSPStudy :: the whole new world!"/>

${fn:length(str)}
${fn:substring(str,0,8)}
${fn:substringAfter(str,"JSPStudy")}
${fn:substringBefore(str,"the"}
${fn:toUpperCase(str)}
${fn:toLowerCase(str)}
${fn:replace(str,"JSP","Android")}
${fn:indexOf(str,"the")} //"t"가 시작하는 인덱스 위치를 출력 결과:12
${fn:startsWith(str,"JSP")}
${fn:endsWith(str,"Jsp")}
${fn:contains(str,"jspstudy")} //결과 : false
${fn:containsIgnoreCase(str,"jspstudy")} : true
***${fn:trim("  http://JSPStudy.co.kr  ")}*** //공백이 사라져서 출력 ***http://JSPStudy.co.kr***
<c:set var="arr" value="${fn:split(str,' ')}"/>
${fn:join(arr,"&&")} //fn:split으로 str의 공백을 변수 arr에 담아주고 fn:join을 이용해
//공백에 && 값을 담습니다.