게시판 화면으로 이동하기 전 로그인을 해야합니다.
사용자의 아이디와 비밀번호를 입력받을 화면을 html코드로 작성해보겠습니다.
생성한 다이나믹 웹 프로젝트에서 진행합니다.
1. WebContent - WEB-INF - html 우클릭 - New - HTML File 선택
2. 파일명을 Login.html으로 설정 후 Finish
3. 다음과 같이 코드를 작성합니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h1>LOGIN PAGE</h1>
<div>
<table>
<tr>
<td><label>ID</label></td>
<td><input type="text" id="userId" placeholder="아이디를 입력하세요."></td>
<td rowspan="2"><button id="btnLogin">로그인</button></td>
</tr>
<tr>
<td><label>PW</label></td>
<td><input type="password" id="passwd" placeholder="비밀번호를 입력하세요."></td>
</tr>
</table>
</div>
</body>
</html>
4. 이클립스 코드 위에서 Alt+Enter 누르면 프로퍼티로 이동합니다.
아직 서버를 생성하지 않았기 때문에 경로를 복사해 웹브라우저에서 이동!
로그인페이지 생성 완료.
다음시간엔 js파일과 연결하여 페이지에 이벤트를 주고, 서버를 생성하여 실행해보겠습니다.
'이클립스 > 게시판만들기' 카테고리의 다른 글
[java/servlet/oracle/mybatis]이클립스에서 마이바티스를 이용해 디비 연결하기 (0) | 2020.10.25 |
---|---|
[java/html/js]게시판 프로젝트-로그인페이지 이벤트 추가 (0) | 2020.10.24 |
[Java/html/js]게시판 프로젝트-구성하기 (0) | 2020.10.17 |
이클립스 Dynamic Web Project 생성하기 (1) | 2020.10.15 |