본문 바로가기

웹 개발/HTML

[Web_HTML] 01

● 서버와 클라이언트

1. 클라이언트

- 서버에게 요청하는 대상

 

2. 서버

- 요청받은 서비스를 응답해주는 대상

 

 

 

● 웹(Web)

- 요청과 응답이 일어나는 장소

 

 

 

● 웹 브라우저(Web Browser)

- 사용자의 요청에 맞는 주소로 찾아가서 인터넷의 컨텐츠(문서와 그림, 멀티미디어 파일 등)를 검색 및 열람 후

   사용자에게 응답하기 위한 응용 프로그램의 총칭이다.

- 주요 웹 브라우저 : 모질라 파이어폭스, 구글 크롬, 인터넷 익스플로러, 마이크로소프트 엣지, 오페라, 사파리 등

 

 

 

● 프로토콜(protocol)

- 사람끼리 소통할 때 서로 이해할 수 있는 공용어를 사용해야 하듯이 컴퓨터끼리도 공용어를 사용해야 한다.

- 이러한 공용어를 원활하게 통신하기 위해서 필요한 규약을 프로토콜이라고 한다.

- 사용자의 요청에 반드시 응답하도록 약속한다.

 

 

 

● 프로토콜 종류

1. http:// : (Hypertext Transfer Protocol)

- 클라이언트와 서버 간의 웹 페이지 등의 자원을 통신하는 규약

- 텍스트로 통신하기 때문에 가로채어 본다면 누구든 내용을 볼 수 있다.

 

2. https:// : (Hypertext Transfer Protocol Secure Socket)

- SSL(Secure Socket Layer) 프로토콜을 이용하여 자원을 공개키 암호화 방식으로 암호화해서 통신하는 규약

 

 

 

● IP(Internet Protocol)

- 사람이 태어나면 출생신고를 하고 교유번호인 주민번호를 발급받는다.

- IP 주소 : 서로를 구분하듯 네트워크 상에서 인터넷에 접속할 때 다른 컴퓨터와 구별될 수 있도록 하는 고유번호

 

 

 

● 도메인(Domain)

- IP 주소는 기억하고 이해하기 힘들기 때문에 이를 위해서 이름을 부여할 수 있도록 한 것.

- 도메인을 통해 IP 주소를 검색할 수 있다.

- 아이피 주소로 직접 접근하면 연산이 필요한 부분이 제외되거나 프로토콜이 적용되지 않을 수 있기 때문에

   반드시 도메인을 통해 사이트에 접근하기로 한다.

> nslookup 도메인

 

(ex)

> nslookup mustit.co.kr

   서버: kns.kornet.net

   Address: 168.126.63.1

 

   권한 없는 응답:

   이름: mustit.co.kr

   Addresses: 3.38.79.228

           52.79.207.238

 

 

 

● WWW(World Wide Web)

- 인터넷에 연결된 전 세계 컴퓨터들을 통해 사람들이 정보를 공유할 수 있는 정보 공간

 

 

 

● W3C

- WWW를 위한 표준을 제정하고 관리하는 중립적인 기관이다.

 

 

 

● 웹 접근성

- 모든 사용자가 신체적, 환경적 조건에 관계 없이 웹에 접근하여 이용할 수 있도록 보장하는 것을 의미한다.

- 마우스가 없는 환경 or 키보드만을 조작해야 할 경우, 신체적 장애로 인해 특수한 환경 하에 접속 해야되는 경우,

   브라우저별, 모바일 환경에서 접속해야 되는 경우 등 다양한 플랫폼에서도 정보 제공이 다름이 없어야 한다는 것.

 

 

 

● 웹 표준(Web Standard)

- 웹에서 표준으로 사용되는 기술이나 규칙을 의미한다.

- 특정 브라우저에서만 사용되는 비표준화된 기술을 배제하고 W3C의 토론을 통해 나온 권고안을 사용하는 것을 말한다.

- 웹 문서의 구조와 표현, 그리고 동작을 구분해서 사용하는 것을 뜻한다.

 

1. HTML(Hypertext Markup Language)

- 웹 페이지에서 다른 페이지로 이동할 수 있도록 하는 마크업 언어이다.

- 마크업 언어 : 태그 방법 체계를 의미하며, 태그 등을 이용하여 문서나 데이터의 구조를 기술하는 언어이다.

 

2. CSS(Cascading Style Sheets)

- 구체적으로 어떤 스타일로 요소가 표시되는 지를 정하는 규격이다.

- HTML은 문서를 구조화(레이아웃)하는 것 뿐만 아니라 꾸미기도 할 수 있지만,

   동일한 디자인을 사용한 문서가 여러 개 있다면, 변경 시 모두 하나씩 수정해야 하기 때문에 불편하다.

- CSS는 이런 문제를 해결함과 동시에 웹 페이지에서 내용과 스타일을 분리하고 역할도 분리해준다.

 

3. JS(Javascript)

- 화면 쪽에서 연산이 가능한 스크립트 언어이다.

- 사용자의 다양한 이벤트 처리, 비동기 통신 등을 자유롭게 사용할 수 있다.

- HTML 안에서 태그 형태로 JS를 사용할 수도 있으며, 외부 파일로 제작 후 포함시켜 사용할 수도 있다.

- 유효성 검사, 통신 등을 담당한다.

 

4. XHTML(Extensible HTML)

- 기존에 사용되던 HTML 규격이 가진 문제점을 극복하고,

   보다 다양한 분야에 응용될 수 있도록 해주는 여러가지 확장된 기능을 포함한다.

- 하지만 XML 기반으로 만들어졌기 때문에 지원되지 않는 브라우저도 있다.

- 따라서 HTML과 XHTML은 사실상 큰 차이 없이 사용된다.

 

5. XML(Extensible Markup Language)

- 어떠한 데이터를 설명하기 위해서 임의로 지은 태그로 데이터를 감싼다.

- 태그로 데이터를 설명하며, 이것이 데이터의 표시(Markup)가 된다.

- 추가적인 데이터가 생기면 태그 추가와 태그 내부 내용 추가를 할 수 있다.

- 따라서 전달에 목적이 있다.

 

(ex)

<? xml1 version="1.0"?>

<user>

<userId>hds1234</userId>

<name>한동석</name>

</user>

 

 


 

● Tomcat 9.0 서버 무설치 버전 다운로드

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

> Tomcat9 클릭 > 64-bit Windows zip 클릭

> C 드라이브에 압축 풀기

 

1. C:\apache-tomcat-9.0.56\bin\startup.bat 실행

1) startup.bat가 실행되지 않는 경우

환경변수 > JAVA_HOME 변수에 jdk경로 선언 > Path에 JAVA_HOME\bin 등록

 

2) 그래도 실행되지 않는 경우

환경변수 > CATALINA_HOME 변수에 tomcat경로 선언 > Path에 CATALINA_HOME\bin 등록

 

3) localhost:포트번호 입력 시 고양이가 안나오는 경우

C:\apache-tomcat-9.0.56\config\server.xml에서 주석이 해제되어 있는 Connection태그에

port번호를 다른 번호로 변경 8081~9999

 

 

 

● eclipse와 톰캣 연동

※ Perspective는 JAVAEE(default)로 설정

1. Window > Preferences 클릭 후 Server 검색

2. 좌측 카테고리에서 Server and Runtime 클릭 후 Tomcat v9.0 Server 선택 > Apply

3. 좌측 카테고리에서 Runtime Environments 클릭

4. Add 클릭 > Apache Tomcat 9.0 선택 후 Next 클릭

5. Tomcat installation directory > C:\apache-tomcat-9.0.56 설정 후 Apply and Close

6. 하단의 Server 탭에서 "No .... " 링크 클릭 

7. Tomcat 9.0으로 선택 후 Finish

8. 등록한 Tomcat 서버 클릭 후 우측 재생 버튼 클릭

 

 


 

실습(html)

1. body에서 text를 입력하여 출력하기

- 코드

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	안녕하세요. Hello
</body>
</html>

 

 

- 결과

 

 

 

 

 

 

'웹 개발 > HTML' 카테고리의 다른 글

[Web_HTML] 06  (0) 2022.04.18
[Web_HTML] 05  (0) 2022.04.17
[Web_HTML] 04  (0) 2022.04.16
[Web_HTML] 03  (0) 2022.04.15
[Web_HTML] 02  (0) 2022.04.14