게시판 흐름도
0116 복습
-
/index.html
-> click : a href -
게시판 리스트
/board/list.jsp
-> click : a href (글등록)
-> JS :onclick location.href='url'여기에 값을 넣으면 페이지가 변경된다. (글보기) -
게시판 글보기
/board/view.jsp
->수정삭제버튼 -
게시판 등록 폼
/board/writeForm.jsp
-> click : form button, action -
게시판 등록 처리
/board/write.jsp
-> list로 돌아가기 -
게시판 수정 폼
/board/updateForm.jsp
-> click : form button, action -
게시판 수정 처리
/board/update.jsp
-> view로 돌아가기 -
게시판 삭제 처리
/board/delete.jsp
-> list로 돌아가기 -
자동 JSP :
response.sendRedirect
영역
- ~ML : 영역 표시 -> 태그
<a>
ex) HTML, XML
1.text 영역
2.box 영역<div>
HTML
<!DOCTYPE html> 보통 맨 처음 나온 태그를 DOCTYPE으로 잡으면 된다.
<html> 시작
</html> 끝
구성
<html> 구성 = 요소(Elements) = 태그 = 객체
<head> 설정
<body> 표시
태그
- 태그 -
<태그명>~</태그명> - 단독 태그 -
<br>또는<br/>(줄바꿈),<hr>(한줄 태그)
태그 안에 <태그명 속성 [속성 ...] 이벤트처리 [이벤트처리..]>
속성과 이벤트는 여러개 지정해서 데이터 여러개 넣을 수 있다. -> 객체
-
속성(Attribute)값을 저장
변수 = 멤버변수 = 전역변수 = 속성 = Attribute = property -
Event(메서드 - 처리문:js) js에서 함수와 같다. 호출을 해서 실행을 한다.
: onclick = "처리문; 처리문;" 처리문이 너무 길어지면 메서드(함수, function)를 쓴다.
파비콘
- 만들어지지 않으면 지구모양으로 보인다.
<title>태그에 내용 작성하고 옆에 뜨는 아이콘이다.
text
<!-- 주석 처리 단축키 ctrl+shift+c -->
<!DOCTYPE html> <!-- Document 타입 -->
<html>
<head>
<!-- 설정 하는 부분-->
<meta charset="UTF-8">
<title>문자 태그</title>
</head>
<body>
<!-- 데이터 표시되는 부분 -->
자바 웹 개발자 <br/>
- br 태그 : 줄바꿈(소스 코드내에서의 엔터는 무시당한다.) <br/>
- hr 태그 : 내용을 선을 이용해서 분리 <br/>
<hr/> <!-- 단독태그라서 슬래시를 뒤쪽에 붙인다. 수평선(horizontal)태그 -->
<!-- '<,>'특수문자처리 : 그냥 쓰면 태그로 인식하기 때문에 특수문자 처리를 한다 -->
<h1><H?></h1> <!-- 출력 : <H?> -->
- &amp; - & 출력하는 HTML 특수문자 <br/>
- &lt;(<) - less then('작다' 기호 특수문자 출력) <br/> <!-- & : & 표시 -->
- &gt;(>) - greater then('크다' 기호 특수문자 출력) <br/>
H태그 : 제목 태그. 처음 나오는 것이 제일 크고 점점 줄어든다. H1~H6. 한 줄 태그<hr>
<!-- h태그는 기본적으로 글씨 크기가 진하고 한 줄을 다 써서 자동 줄바꿈이 된다. -->
<h1>제목1</h1>
<h2>제목2</h2>
<h3>제목3</h3> <!-- 보통은 3까지 쓴다. 부제목을 많이 잡지는 않는다. -->
<h4>제목4</h4>
<h5>제목5</h5>
<h6>제목6</h6>
<p> <!-- 문단을 나눠주는 태그. paragraph를 구분 할 때 p태그를 쓴다 -->
자바란?
<br> 컴퓨터 언어 입니다
</p>
<p>
데이터 베이스
<br> 데이터를 저장하는 시스템
</p> <!-- 단독태그가 아닌데도 <p> 하나만 써도 오류가 나지 않지만 계속 닫는 태그가 어딨나 찾기 때문에 느려질 수 있으니 닫아주는게 좋다. -->
</body>
</html>
text2
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h1><b><em><mark></h1>
<hr>
<p>
<b>bold - 두껍게</b><br/>
<em>emphasized - 도드라지다</em><br/> <!-- 기울어져나옴 -->
<mark>mark - 표시하다</mark><br/> <!-- 형광펜(highlight) -->
</p>
<h1><i><pre><address></h1>
<hr>
<p>
<i>italic - 이탤릭</i><br/> <!-- 기울임체 -->
</p>
<pre>prefomatted - 미리 정의된 형식</pre><br/> <!-- 미리 지정된 고정폭 글꼴(fixed-width font)을 사용하여 표현 -->
<!-- 소스코드 내에서의 공백과 엔터를 처리 해 준다. 단점은 폰트가 정해져 있다. -->
<address>address - 주소 : 이메일</address><br/>
<h1><small><sub><sup></h1>
<hr>
<p>
글씨를 사용하기에서 <small>작은 글씨</small>,
<sub>하위 글씨(Subscript)</sub>,
<sup>상위 글씨(Superscript)</sup>로 사용할 수 있습니다.<br/>
2의 2제곱 : 2<sup>2</sup>
<!-- 보통 문장 사이에 사용한다. 제곱 같은 수식을 표현 할 때 사용 할 수 있다. -->
</p>
<p>
공백문자 여러개를 표시하려면 &nbsp;를 여러개 사용한다.
</p>
</body>
</html>
Span
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Span</title>
<style type="text/css"> /* class 쓸 때는 앞에 .을 붙이고 id를 쓸 때는 #을 붙이면 된다. */
.red{
/* 글자색을 빨강 */
color: red; /* 색 이름(text)으로 지정 */
}
.blue{
/* 글자색을 파랑 */
color: #00f; /* # 뒤에 16진수 6자리나 16진수 3자리 색상 번호를 사용할 수 있다. - RGB */
}
#italic{
/* 기울임체로 */
font-style: italic;
}
</style>
</head>
<body>
<h1><span></h1>
<hr/>
글자 사이에 영역을 지정할 때 사용한다. 지정한 후 CSS를 이용해서 폰트, 색상, 크기 등을 설정할 수 있다.<br/>
<!-- 여러개는 class라는 속성 지정, 한개면 id라는 속성 지정(중복이 안됨) -->
<!-- 꾸밀 때 html에서 굳이 속성을 여러개 지정해서 쓸 필요 없고 꾸미는건 css로 넘어가서 span를 사용하면 된다. -->
<span class="red">빨강</span>, <span class="blue">파랑</span>, <span id="italic">이탤릭</span>,
<span>검정</span>, <span class="red">빨강</span>, <span class="red">빨강</span>, <span class="blue">파랑</span>
</body>
</html>
TABLE
- 표형식
- thead(제목줄) ,tbody(아무것도 안써도 생기는 것), tfooter - 탐색 할 때 중요한 역할을 함.
<td>: 일반글자<th>: 제목
SVN
워크시트별 지정 - 아이디와 비번은 그대로
아이디와 비번 변경하기 (원래 있는 데이터 지우고 SVN 연결할 때 아이디와 비번 설정)
내계정 지우기 C:\Users\EZEN\AppData\Roaming\Subversion
