본문 바로가기
Backend

08월 22일 목 | JSP 02 - JSP 문법

by 구라미 2019. 8. 22.

Tomcat 웹서버 시작

D:\java0514\tomcat-8.0\bin\startup.bat

실행하기

 

 

 

Tomcat 웹서버 포트번호 확인

xml 문서로 확인한다.

 

 

 

새로운 JSP프로젝트 시작하기

 

 

 

 

jsp 기본적으로 html/css/javascript를 다 포함한 문법

 

 

servlet-api.jar를

 

WEB-INF > lib폴더에 붙여넣기

 

 

jsp의 지시자

jsp에는 지시자라는 개념이 있다.

 

<%@ page language="java" contentType="text/html; charset=EUC-KR" pageEncoding="EUC-KR"%>

<%@ page  %>

<%@ include  %>

<%@ taglib  %>

 

형태가 약간 지킬에서 봤던 모양새같음. 비슷한 기능을 하는 것 같다.

 

<%@ page contentType="text/html; charset=utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=utf-8">
<title>Insert title here</title>
</head>
<body>

</body>
</html>

 

 

 

 

jsp의 주석

jsp주석기호는 html과 좀 다르다.

 

<%@ page contentType="text/html; charset=utf-8"%>
<%-- 
	JSP 코드 주석
	JSP 디렉티브 :
		<%@page  %>
		<%@include %>
		<%@tablib %>
	한글인코딩 : 완성형(MS949) EUC-KR
				 조합형 UTF-8
 --%>
<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=utf-8">
<title>Insert title here</title>
</head>
<body>

</body>
</html>

 

 

 

jsp파일 작성해보기

jsp주석기호는 html과 좀 다르다.

<%@ page contentType="text/html; charset=utf-8"%>
<%@ page import="java.sql.*"%>
<%@ page import="java.util.*"%>
<%@ page import="java.io.*"%>

<%-- 
	JSP 코드 주석
	JSP 디렉티브 :
		<%@page  %>
		<%@include %>
		<%@tablib %>
	한글인코딩 : 완성형(MS949) EUC-KR
				 조합형 UTF-8
	
	2) <%@page  %> 디렉티브
		contentType = ""
		import = ""
		
	3) 스크립트릿(Scriptlet)
	   <% JSP코드 작성영역 %>
	   
	4) .jsp페이지에서 사용가능한 문법
		HTML tag
		CSS <style></style>
		Javascript <script></script>
			 
 --%>
<!DOCTYPE html>
<html>
<head>
<!-- 웹브라우저 한글 인코딩(하나 지정하면 같이 가야함.) -->
<meta content="text/html" charset="utf-8">
<title>Insert title here</title>
</head>
<body>
	<h1>JSP 테스트 01</h1>
	<hr>
	<p id="string"></p>
	<script>
	var a = 1, b= 3;
	alert(a+b);	
	var str = a+b;
	document.getElementById("string").innerHTML=str;
	</script>
	
	<%
		//한줄 주석
		/*여러줄주석*/
		//JSP 코드 작성영역
		/* 
		out.println("무궁화");
		out.println(123);
		out.println(5+7);
		out.println(8.9);
		out.println('x');
		*/
		
		//결과확인
		//http://localhost:8090/BasicWeb/basic/01._jsp기초문법.jsp
		
		//에러
		//WebContent는 외부에서 접근 불가능
		//프로젝트명 BasicWeb으로 접근해야한다.
		
		//HTML태그를 사용해야하는 경우 "" 안에서 작성한다.
		out.print("<h3>나는 로봇이다.</h3>");
		out.print("<img src='../images/robot.png'>");
		out.print("<hr>");
		
		out.print("서울");
		out.print("부산");
		out.print("제주");

		out.println("<br>");
		out.println("개나리");
		out.println("진달래");
		out.println("라일락");
	%>
	
</body>
</html>

<% %> 스크립트릿, 이 안에 jsp코드를 작성하는 것이다.

그렇기 때문에 html을 <% %>안에 작성하려면 jsp코드 규칙에 맞게 작성해야한다.

 

 

 

jsp로 성적프로그램

jsp로 성적프로그램 만들어보는 것이다.

 

1) 성적표 예시

<%@ page contentType="text/html; charset=UTF-8"%>
<!DOCTYPE html">
<html>
<head>
<meta charset="UTF-8">
<title>02_성적프로그램.jsp</title>
</head>
<body>
	<h1>성적프로그램</h1>
	<%
		String name = "김고은";
		int kor = 80;
		int eng = 79;
		int mat = 100;
		int tot =kor+eng+mat;
		int aver = tot/3;
		
		//1) 출력
		out.println(name);
		out.println("<br>");
		out.println("국어:"+kor+"영어:"+eng+"수학:"+mat);
		out.println("<br>");
		out.println("총점:"+tot+"평균:"+aver);
	
	%>
</body>
</html>

2) 테이블을 이용하여 출력

<%@ page contentType="text/html; charset=UTF-8"%>
<!DOCTYPE html">
<html>
<head>
<meta charset="UTF-8">
<title>03_배열.jsp</title>
</head>
<body>
	<h1>성적프로그램(배열)</h1>
	<%		
		String[] name ={"곽윤기","정수정","강슬기","전정국","김연아"};
		int[] kor = {100,20,85,55,95};
		int[] eng = {100,40,80,65,90};
		int[] mat = {100,35,75,70,35};
		int[] avg = new int[5];
		int[] rank = {1,1,1,1,1};
		int size=name.length;
		
		//1) 평균을 구하시오
		for(int idx=0; idx<size; idx++){
			avg[idx]=(kor[idx]+eng[idx]+mat[idx])/3;			
		}
		//2) 등수를 구하시오
		for(int a=0; a<size; a++){
			for(int b=0; b<size; b++){
				if(avg[a] < avg[b]){
					rank[a] = rank[a]+1;
				}
			}
		}
		
		//3) 출력하기
		for(int idx=0; idx<size; idx++){
			out.println("<table border='1'>");
			out.println("<tr>");
			out.println("<th>이름</th>");
			out.println("<td>"+name[idx]+"</td>");
			out.println("<th>국어</th>");
			out.println("<td>"+kor[idx]+"</td>");
			out.println("<th>영어</th>");
			out.println("<td>"+eng[idx]+"</td>");
			out.println("<th>수학</th>");
			out.println("<td>"+mat[idx]+"</td>");
			out.println("<th>평균</th>");
			out.println("<td>"+avg[idx]+"</td>");
			out.println("<th>등수</th>");
			out.println("<td>"+rank[idx]+"</td>");
			out.println("</tr>");
			out.println("</table>");
		}
	%>
	//선생님 방법
	<table border='1'>
	<tr>
		<th>이름</th>
		<th>국어</th>
		<th>영어</th>
		<th>수학</th>
		<th>평균</th>
		<th>등수</th>
	</tr>
	<%
	for(int idx=0; idx<size; idx++){
	%>
	<tr>
		<td><%=name[idx]%></td>
		<td><%=kor[idx]%></td>
		<td><%=eng[idx]%></td>
		<td><%=mat[idx]%></td>
		<td><%=avg[idx]%></td>
		<td><%=rank[idx]%></td>
	</tr>
	
	<%} 
	%>
	</table>
	<style>
	td {
		width: 50px;
	}
</style>
</body>
</html>

 

3) 그 밖의 설정 추가하기

<%@ page contentType="text/html; charset=UTF-8"%>
<!DOCTYPE html">
<html>
<head>
<meta charset="UTF-8">
<title>03_배열.jsp</title>
</head>
<body>
	<h1>성적프로그램(배열)</h1>
	<%		
		String[] name ={"곽윤기","정수정","강슬기","전정국","김연아"};
		int[] kor = {100,20,85,55,95};
		int[] eng = {100,40,80,65,90};
		int[] mat = {100,35,75,70,35};
		int[] avg = new int[5];
		int[] rank = {1,1,1,1,1};
		int size=name.length;
		String[] grade =new String[5];
		String[] result=new String[5];
		String[] star={"","","","",""}; //null이 생기는 이유 빈문자열 "" 을 따로 할당해야한다.
		String[] special=new String[5];
		
		//1) 평균을 구하시오
		for(int idx=0; idx<size; idx++){
			avg[idx]=(kor[idx]+eng[idx]+mat[idx])/3;			
		}
		//2) 등수를 구하시오
		for(int a=0; a<size; a++){
			for(int b=0; b<size; b++){
				if(avg[a] < avg[b]){
					rank[a] = rank[a]+1;
				}
			}
		}
		
		
		for(int idx=0; idx<size; idx++){
			
			if(avg[idx]>=90){
				grade[idx]="A학점";
			}else if (avg[idx]>=80){
				grade[idx]="B학점";
			}else if (avg[idx]>=70){
				grade[idx]="C학점";
			}else if (avg[idx]>=60){
				grade[idx]="D학점";
			}else {
				grade[idx]="F학점";
			}			
			
			if(avg[idx]>=70){
				if(kor[idx]<40 || eng[idx]<40 || mat[idx]<40){
				 result[idx]="재시험";
			    }else{
			    	result[idx]="합격";
			 }
			}else{
				result[idx]="불합격";
			}
			
			for(int i=1; i<=avg[idx]/10; i++){
				star[idx] += "★";
			}			
			
			if(avg[idx]>=95){
				special[idx] = " 장학생";
			} else {
				special[idx] = " 일반 ";
			}
		}
		
		//3) 출력하기
		for(int idx=0; idx<size; idx++){
			out.println("<table border='1'>");
			out.println("<tr>");
			out.println("<th>이름</th>");
			out.println("<td>"+name[idx]+"</td>");
			out.println("<th>국어</th>");
			out.println("<td>"+kor[idx]+"</td>");
			out.println("<th>영어</th>");
			out.println("<td>"+eng[idx]+"</td>");
			out.println("<th>수학</th>");
			out.println("<td>"+mat[idx]+"</td>");
			out.println("<th>평균</th>");
			out.println("<td>"+avg[idx]+"</td>");
			out.println("<th>등수</th>");
			out.println("<td>"+rank[idx]+"</td>");
			
			out.println("</tr>");
			out.println("</table>");
			
		}
		
		out.println("<hr>");

	%>
	
	<table border='1'>
	<tr>
		<th>이름</th>
		<th>국어</th>
		<th>영어</th>
		<th>수학</th>
		<th>평균</th>
		<th>등수</th>
		<th>학점</th>
		<th>과락</th>
		<th>장학생</th>
		<th>별점</th>
	</tr>
	<%
	for(int idx=0; idx<size; idx++){
	%>
	<tr>
		<td><%=name[idx]%></td>
		<td><%=kor[idx]%></td>
		<td><%=eng[idx]%></td>
		<td><%=mat[idx]%></td>
		<td><%=avg[idx]%></td>
		<td><%=rank[idx]%></td>
		<td><%=grade[idx]%></td>
		<td><%=result[idx]%></td>
		<td style="color:orange;"><%=star[idx]%></td>
		<td><%=special[idx]%></td>
	</tr>
	
	<%} %>
	</table>
	<style>
	td {
		width: 50px;
	}
</style>
</body>
</html>

 

4) 메소드

 

<%@ page contentType="text/html; charset=UTF-8"%>
<!DOCTYPE html">
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	<h1>JSP사용자 정의 함수</h1>
	최대값: <%=max(3,5)%>
	<hr>
	두 수 사이의 차이: <%=diff(2,6)%>
	
	<%! 	
		//JSP함수 작성 영역 (많이 사용안함)
	public int max(int a, int b){
		return Math.max(a,b);
	}
	
	public int diff(int a, int b){
		int c = a-b;
		return (c<0) ? c:-c;
	}
	%>

</body>
</html>
저작자표시 비영리

'Backend' 카테고리의 다른 글

08월 26일 월 | JSP 04 - JSP CRUD 게시판 생성, 목록, 상세페이지  (1) 2019.08.26
08월 23일 금 | JSP 03 - JSP 내장객체  (0) 2019.08.23
08월 21일 수 | JSP 01 - 톰캣설치, 개발환경설정  (0) 2019.08.21
08월 07일 수 | 데이터입출력 구현 03 - 백업 및 복원  (2) 2019.08.07
08월 06일 화 | 데이터입출력 구현 02 - SQL 프로시저와 JDBC  (0) 2019.08.06

관련글

댓글

티스토리툴바