1. 이클립스를 실행하고 New - Dynamic Web Project를 클릭합니다.


New - Dynamic Web Project


Project name에 프로젝트이름을 입력하고 Finish를 누릅니다.



저는 Board_Blog라는 프로젝트명을 입력해서 만들었습니다.

WebContent에 jsp파일이 들어가게 됩니다.

src는 자바파일이 들어가는데 이번에는 사용하지 않습니다.


WebContent나 Board_Blog에 우측 클릭을 하셔서 New - Other로 갑니다.


아래쪽에 보면 Web폴더에 JSP File을 선택하고 Next


File name 에 list.jsp로 작성하고 Finish버튼을 누릅니다.



이렇게 list.jsp가 만들어졌습니다.

이제 이곳에 코딩을 하게됩니다.

기본적으로 HTML문서로 이루어져있습니다.

저희는 게시판을 만들예정이니 주로 테이블로 구성되겠습니다.

제가 만든 게시판의 디자인은 

판다의 이상한 블로그(http://ssppmm.tistory.com/) 에서

참고하고 이미지파일도 사용했습니다.


<%@ page language="java" contentType="text/html; charset=EUC-KR" pageEncoding="EUC-KR"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>게시판</title> </head> <body> <table width="100%" cellpadding="0" cellspacing="0" border="0"> <tr height="5"><td width="5"></td></tr> <tr style="background:url('img/table_mid.gif') repeat-x; text-align:center;"> <td width="5"><img src="img/table_left.gif" width="5" height="30" /></td> <td width="73">번호</td> <td width="379">제목</td> <td width="73">작성자</td> <td width="164">작성일</td> <td width="58">조회수</td> <td width="7"><img src="img/table_right.gif" width="5" height="30" /></td> </tr> <tr height="25" align="center"> </tr> <tr height="1" bgcolor="#D2D2D2"><td colspan="6"></td></tr> <tr height="1" bgcolor="#82B5DF"><td colspan="6" width="752"></td></tr> </table> <table width="100%" cellpadding="0" cellspacing="0" border="0"> <tr><td colspan="4" height="5"></td></tr> <tr align="center"> <td><input type=button value="글쓰기"></td> </tr> </table> </body

</html>


저희가 사용할 게시판의 디자인양식입니다. 

중간에 보시면 img/table_mid.gif 이런게 보이실겁니다.

이미지 파일을 사용하기위해 WebContent폴더에 img폴더를 하나 생성합니다.


   <-- table_left.gif 

  <--table_mid.gif

  <--table_right.gif

이 이미지들은 

판다의 이상한 블로그(http://ssppmm.tistory.com/) 에서

참고하고 이미지파일도 사용했습니다.


그리고 이제 실행을 시켜보기 위해

Run을 누릅니다. 


서버(톰캣)을 확인하고 Finish!



실행된 화면입니다.

http://localhost:8080/Board_Blog/list.jsp란 주소도 보이군요



본격적으로 코딩을 하기 전에 DataBase파일을 만들겠습니다. 

Oracle이나 My sql은 Create 테이블로 만들면 되지만 Ms Access는 따로 만들어줘야겠죠?

Access를 실행시킵니다.


새 데이터베이스를 더블클릭


테이블에 항목들을 추가시킵니다.


저는 Num, UserName, Password, Title, Memo, Time, Hit, Ref, Indent, Step을 만들었습니다.

만들고 저장을 하면 테이블명을 저장하라고 합니다. 저희는 게시판이니 board로 하겠습니다.



왼쪽 위에 보면 보기버튼이 있습니다. 클릭합니다.


우측에 보면 저장한 필드들이 있고 데이터형식이 있습니다.

Num은 일련번호 형식입니다. 자동적으로 +1이 되어 생성됩니다.

mysql에서는 auto increment를 해주면 됩니다. 

오라클에서는 Sequence를 해주시면 됩니다. (올닉스님의 지식제공)

또한 기본키를 주게됩니다


날짜에는 기본값을 =Now() 값을 줍니다.

값이 저장될때 현재시간을 입력하게 됩니다.

다른 데이터베이스에서는 SQL문에서 Now()로 넣으시면 됩니다.

그밖에 hit, ref, indent는 기본값 0을 넣겠습니다.

여기까지 데이터베이스 세팅이었습니다.


본격적으로 코딩을 시작하겠습니다.

====================================================================================================


우선 자바(jsp)와 데이터베이스의 연동코드를 보시길 바랍니다.

 - 연동코드 보러가기 <--클릭


====================================================================================================

기본틀을 만들어놨던 위에 코드에 디비연결을 하는 코드를 추가시키겠습니다.


<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<%@ page import="java.sql.*" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
 <title>게시판</title>
 </head>
 <body>
 <%
	Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
	String url = "jdbc:odbc:board2";
	String id = "";
	String pass = "";
	int total = 0;
	
	try {
		Connection conn = DriverManager.getConnection(url,id,pass);
		Statement stmt = conn.createStatement();

		String sqlCount = "SELECT COUNT(*) FROM board";
		ResultSet rs = stmt.executeQuery(sqlCount);
		
		if(rs.next()){
			total = rs.getInt(1);
		}
		rs.close();
		out.print("총 게시물 : " + total + "");
		
		String sqlList = "SELECT NUM, USERNAME, TITLE, TIME, HIT from board order by NUM DESC";
		rs = stmt.executeQuery(sqlList);
		
%>
<table width="100%" cellpadding="0" cellspacing="0" border="0">
  <tr height="5"><td width="5"></td></tr>
 <tr style="background:url('img/table_mid.gif') repeat-x; text-align:center;">
   <td width="5"><img src="img/table_left.gif" width="5" height="30" /></td>
   <td width="73">번호</td>
   <td width="379">제목</td>
   <td width="73">작성자</td>
   <td width="164">작성일</td>
   <td width="58">조회수</td>
   <td width="7"><img src="img/table_right.gif" width="5" height="30" /></td>
  </tr>
<%
	if(total==0) {
%>
	 		<tr align="center" bgcolor="#FFFFFF" height="30">
	 	   <td colspan="6">등록된 글이 없습니다.</td>
	 	  </tr>
<%
	 	} else {
	 		
		while(rs.next()) {
			int idx = rs.getInt(1);
			String name = rs.getString(2);
			String title = rs.getString(3);
			String time = rs.getString(4);
			int hit = rs.getInt(5);
		
%>
<tr height="25" align="center">
	<td>&nbsp;</td>
	<td><%=idx %></td>
	<td align="left"><%=title %></td>
	<td align="center"><%=name %></td>
	<td align="center"><%=time %></td>
	<td align="center"><%=hit %></td>
	<td>&nbsp;</td>
</tr>
  <tr height="1" bgcolor="#D2D2D2"><td colspan="6"></td></tr>
<% 
		}
	} 
	rs.close();
	stmt.close();
	conn.close();
} catch(SQLException e) {
	out.println( e.toString() );
}
%>
 <tr height="1" bgcolor="#82B5DF"><td colspan="6" width="752"></td></tr>
 </table>
 
<table width="100%" cellpadding="0" cellspacing="0" border="0">
  <tr><td colspan="4" height="5"></td></tr>
  <tr align="center">
   <td><input type=button value="글쓰기"></td>
  </tr>
</table>
</body

</html>

코드를 부분부분 설명 하겠습니다.

<%@ page import = "java.sql.*"%// sql문을 사용하기 위해 import시킵니다.  


<% Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); String url = "jdbc:odbc:board2"; String id = ""; String pass = ""; int total = 0; try { Connection conn = DriverManager.getConnection(url,id,pass); //DB연결 Statement stmt = conn.createStatement(); //Statement타입의 객체생성 String sqlCount = "SELECT COUNT(*) FROM board"; // DB내의 자료개수를 찾는 SQL문 ResultSet rs = stmt.executeQuery(sqlCount); // DB실행 if(rs.next()){ // rs.next()의 반환값은 true or false입니다. 찾는결과가 있으면 true total = rs.getInt(1); // SELECT문의 첫번째 필드 여기선 COUNT(*) } out.print("총 게시물 : " + total + ""); // 게시물수 출력 String sqlList = "SELECT NUM, USERNAME, TITLE, TIME, HIT from board order by NUM DESC"; // board 테이블에 있는 Num, UserName, title, time, hit의 값을 가져오되 Num을 기준으로 내림차순정렬 rs = stmt.executeQuery(sqlList); // DB실행

%>


<% if(total==0) { // total 즉, 자료가 없다면 %> <tr align="center" bgcolor="#FFFFFF" height="30"> <td colspan="6">등록된 글이 없습니다.</td> </tr> <% } else { // total이 0이 아닌 즉 자료가 1개이상 있다면 while(rs.next()) { // while이라는 반복문으로 자료를 찾습니다. rs.next()는 다음라인으

로 커서 이동 int idx = rs.getInt(1); // 1은 첫번째 즉 num값을 idx라는 변수에 대입 String name = rs.getString(2); // name String title = rs.getString(3); // title String time = rs.getString(4); // time int hit = rs.getInt(5); // hit %> <tr height="25" align="center"> <td>&nbsp;</td> <td><%=idx %></td> <td align="left"><%=title %></td> <td align="center"><%=name %></td> <td align="center"><%=time %></td> <td align="center"><%=hit %></td> <td>&nbsp;</td> </tr> <tr height="1" bgcolor="#D2D2D2"><td colspan="6"></td></tr> <% } } rs.close(); //rs객체 반환 stmt.close(); // stmt객체 반환 conn.close(); // conn객체 반환 } catch(SQLException e) { out.println( e.toString() ); //에러 날경우 에러출력

%>


이렇게 코딩을 하고 실행을 시켜보면


게시물이 없기 때문에 0개로 뜨고 등록된 글이 없습니다.라고 잘 뜨고있네요.

아직 글쓰기는 구현하지 않은 상태이므로 테스트겸 

수작업으로 데이터베이스에 자료를 추가해보겠습니다.


입력하고 저장하고


실행했더니 게시글도 잘나오네요!


에러가 나시는분은 오타 잘 찾아보세요~

코딩은 에러찾기가 반이상인것 같네요



이미지출처 : 판다의 이상한 블로그(http://ssppmm.tistory.com/)



Posted by 세이나린
,