qordpsem 2024. 7. 3. 10:07

 

https://tomcat.apache.org/download-90.cgi

 

Apache Tomcat® - Apache Tomcat 9 Software Downloads

Welcome to the Apache Tomcat® 9.x software download page. This page provides download links for obtaining the latest version of Tomcat 9.0.x software, as well as links to the archives of older releases. Unsure which version you need? Specification version

tomcat.apache.org

톰캣 버전 9 다운로드

(컴퓨터를 웹서버로 만들기 위해 웹어플리케이션서버 설치)

 

 

+ 추가) 맥북에서 톰캣 다운

위 사이트에서    tar.gz (pgp, sha512)  다운 후 터미널 열어서 아래 명령어 입력

cd 톰캣파일경로/bin/
./startup.sh

 

cmd + opt + c 하면 파일 경로 복사됨

 

 

 

 

https://developer.mozilla.org/ko/docs/Web/HTML

 

HTML: Hypertext Markup Language | MDN

HTML(HyperText Markup Language)은 웹을 이루는 가장 기초적인 구성 요소로, 웹 콘텐츠의 의미와 구조를 정의할 때 사용합니다. HTML 이외의 다른 기술은 일반적으로 웹 페이지의 모양/표현 (CSS), 또는 기

developer.mozilla.org

강사님 추천 사이트

 

 

https://www.w3schools.com/

 

W3Schools.com

W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

www.w3schools.com

강사님 추천 사이트 2

 

 

 


 

 

#웹동작 방식

계속 연결되어있는게 아니라 한번 응답하고 연결 끊기는 구조

 

#서버 프로그램

서버에서 실행되는 프로그램 (백엔드 프로그램)  >>  사용자와 먼 곳에 있음

 

#클라이언트 프로그램

클라이언트에서 실행되는 프로그램 (프론트엔드 프로그램)  >>  사용자와 가까운 곳에 있음

 

 

동일 화면 구성 후 테스트

jsp는 코드 노출 안됨

html은 코드 노출 됨

 

(웹에서 보여지는 문서 작성하려면 html 형식이어야함)

 

 

#javascript 오류 시

ctrl shift i  (개발자도구) 켜서 오류 확인 후 수정

 

 

#html5 기능

멀티미디어 : 플러그인 없이 음악, 동영상 재생할 수 있게 됨

그래픽 : 하드웨어 가속 받아 2, 3차원 그래픽 구현

통신 : 서버소켓과 통신 가능

오프라인 저장 가능

현재 위치 가져올 수 있음

시맨틱 태그 추가됨  (  <header> </header> 이런거  )

 

요소 : html 페이지 구성하는 각 부품 (자바스크립트 개발에서 요소를 객체라고도 함)

태그 : 요소 만들때 사용하는 작성 방법

 

 

 

 

 

<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>
	 오늘 점심은 뭘 먹을지 물어봅시다
	 가 ) 뭐먹지
	 나 ) 육회 비빔밥!
	 <hr>
	 오늘 점심은 뭘 먹을지 물어봅시다<br>  <!-- br:줄바꿈 -->
	 가 ) 뭐먹지<br>
	 나 ) 육회 비빔밥! <br>
	 <br>
	 <p>오늘 점심은 뭘 먹을지 물어봅시다</p>   <!-- p:한문단 -->
	 <p>가 ) 뭐먹지</p>
	 <p>나 ) 육회 비빔밥!</p>
	 <hr>
	 <pre>
	 오늘 점심은 뭘 먹을지 물어봅시다   <!-- pre:그대로 출력 -->
	 가 ) 뭐먹지
	 나 ) 육회 비빔밥!
	 </pre>
</body>
</html>

 

 

 

 

<h1>hello</h1>
<hr>
<h1> KOREA    <!-- 닫는거 생략해도 작동 됨 / 유연한 편-->

 

 

# 공백 주의

<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>
	나는 							html을 배우고 있어요
	<hr>
</body>
</html>

 

 

 

 

 

 

# &nbsp

<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>
	나는&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; html을 배우고 있어요
	<hr>
</body>
</html>

 

 

 

 

 

 

 

 

5>2 = True <br>           <- 동일->           5&gt;2 = True <br>

5<2 = False <br>          <- 동일->           5&lt;2 = False <br>

 

 

 

 

#글자 모양 태그

b   굵은 글자

i   기울어진 글자

small   작은 글자

sub   아래 첨자

sup   위 첨자

 

 

 

#순서 없는 목록

<ul> </ul>

<ul type = ""> 해서 원하는 스타일로 바꿀 수 있음

 

#순서 있는 목록

<ol> </ol>

<ol type = ""> 해서 원하는 스타일로 바꿀 수 있음

 

 

 

#테이블 태그

table 표 삽입

tr 표에 행 삽입

th 표에 열 삽입 (제목)

td 표에 열 삽입 (데이터)

 

 

<h2>시간표</h2>
	<table border = "1" width = 80%"">
		<tr>
			<th></th>
			<th>월</th>
			<th>화</th>
			<th>수</th>
			<th>목</th>
			<th>금</th>
			<th>토</th>
		</tr>
			<tr>
			<td>1교시</td>
			<td>영어</td>
			<td>국어</td>
			<td>과학</td>
			<td>미술</td>
			<td>기술</td>
			<td rowspan="2">프로젝트</td>    <!-- 열 2개 합침 -->
		</tr>
			<tr>
			<td>2교시</td>
			<td>도덕</td>
			<td colspan="3">체육</td>  <!-- 행 3개 합침 -->
			<td>사회</td>
		</tr>
	</table>