-
테이블 활용하여 게시판 만들기, 이클립스 연결(톰캣)웹 Web/JSP & Servlet 2022. 1. 13. 11:07
아주 간단한 기본 테이블
table>tr*3
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>board</title> </head> <body> <table border = 2 cellspacing = 0> <tr> <td>과목</td> <td>요일</td> <td>시간</td> </tr> <tr> <td>css</td> <td>월</td> <td>9시-13시</td> </tr> <tr> <td>jsp</td> <td>금</td> <td>9시-11시</td> </tr> </table> </body> </html>
약간의 디자인 넣기
th:
caption: table 태그 안에서 제목으로 사용되며, 가운데 정렬
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>board</title> <style> th{ background-color: aqua } </style> </head> <body> <h1> 게시판</h1> <table border = 2 cellspacing = 0> <tr> <th>번호</th> <th>제목</th> <th>내용</th> </tr> <tr> <td>css</td> <td>월</td> <td>9시-13시</td> </tr> <tr> <td>jsp</td> <td>금</td> <td>9시-11시</td> </tr> </table> <button value = "글쓰기">글쓰기</button> </body> </html>
위의 코드를 이클립스로 가져오기 - 톰캣 설치
1. 톰캣 다운로드 및 설치
2. 이클립스 워크스페이스 재설정 - 인코딩, 톰캣 연결
2-1. 프로젝트 설치 - 톰캣 등록
3. 테스트 웹페이지 작성
4. 테스트 웹페이지 서버로 업로드
5. 서버 실행
6. 브라우저에서 해당 웹페이지 접근
https://tomcat.apache.org/download-80.cgi -> tomcat9 -> 32-bit/64-bit Windows Service Installer (pgp, sha512)
이클립스 서버창에서 오른쪽 클릭 new -> server -> apache -> 톰캣 9.0버전 -> browse에서 톰캣9버전 선택 후 finish
컴퓨터 제어판의 서비스 -> 오른쪽 마우스 클릭하여 apache 중지 -> 이클립스에서 dynamic web project 생성 -> jsp file 하나 만들어 body에 아무 문자나 입력 -> 서버창의 톰캣 스타트 -> 만약 오류가 나면 서버창의 톰캣을 더블클릭 해주고 포트번호 수정 및 publish module contexts 어쩌고에 체크 -> 다시 톰캣 실행하고 crtl+s -> jsp파일 실행 -> body에 작성한 문자가 새 페이지로 생성되면 성공
window -> preference -> workspace -> text file encoding 에서 utf-8로 변경하고 -> web -> jsp files -> encoding에서 utf-8로 변경 하고 general ->web browser -> use internal web browser 선택
<%@ page language="java" contentType="text/html; charset=EUC-KR" pageEncoding="EUC-KR"%> <!-- 지시자 --> <!DOCTYPE html> <html> <head> <meta charset="EUC-KR"> <title>Insert title here</title> <style> body{background:skyblue} </style> </head> <body> asd </body> </html>
위의 코드로 잘 실행이 되는 시험을 해보고
<%@ page language="java" contentType="text/html; charset=EUC-KR" pageEncoding="EUC-KR"%> <!-- 지시자 --> <!DOCTYPE html> <html> <head> <meta charset="EUC-KR"> <title>Insert title here</title> <style> body{background:skyblue} hr{width: 500; border: 3;} div{font-size: 18px; color:blue; font-weight:900} </style> </head> <body> <div> 게시판</div> <hr> <table border = 2 cellspacing = 0> <tr> <th>번호</th> <th>제목</th> <th>내용</th> </tr> <tr> <td>css</td> <td>월</td> <td>9시-13시</td> </tr> <tr> <td>jsp</td> <td>금</td> <td>9시-11시</td> </tr> </table> <button value = "글쓰기">글쓰기</button> </body> </html>
브라캣에 작성한 body부분을 이클립스의 body에 복붙 후 일부 수정하였다
'웹 Web > JSP & Servlet' 카테고리의 다른 글
JSP 내장객체 (0) - JSP로 설문조사폼 (0) 2022.01.17 JSP 기본 다루기 - 기본태그, 지시자 (0) 2022.01.16 doPost()와 URL Mapping과 쿼리 스트링 (0) 2022.01.16 doGet(), request를 이용한 정보 넘기기 (1) - 사용자로부터 데이터 입력받기 (0) 2022.01.14 서블릿과 JSP (0) 2022.01.13