JSP 웹 프로그래밍의 이해
웹의 개요
웹이란 ?
section 1 / 웹의 개요
월드 와이드 웹 (World Wide Web)
= WWW or web
- 웹은 인터넷에서 운영되는 서비스 중 하나임
(웹 자체가 인터넷을 의미하는 것은 아님.)
- 웹의 개발 목적
: 연구자들이 흩어져 있는 정보를 손쉽게 정리하고 공유하기 위함
웹의 특징
- 인터넷은 컴퓨터 네트워크망을 의미하고, 웹은 인터넷 서비스 중 하나를 의미함
- 인터넷상의 정보를 하이퍼텍스트 방식과
멀티미디어 환경에서 검색할 수 있게 해주는 정보 검색 시스템을 의미함
- HTTP 프로토콜을 사용하며, HTML 문서를 연결하여 다양한 콘텐츠를 제공함
- 많은 사람들이 정보를 쉽게 공유하고 접근할 수 있도록 하는 것을 목적으로 함
웹의 동작 구조
- HTML을 중심으로 한 웹의 동작과정.
<웹의 동작 구조>
웹 브라우저 ----url입력----> DNS 서버 ---IP주소로 변환--->
웹 브라우저 ---HTML 페이지 요청---> [80port] 웹 서버 / 요청 내용 분석/index, html파일 읽기
---HTML 파일 전송---> 웹 브라우저 / HTML 태그 분석/ 화면 구성
section 2
네트워크와 인터넷의 개념
네트워크
네트워크 (Network)
- 사전적 의미 : 전선이나 혈관, 통로 등으로 이루어진 망형 조직
- 가장 많이 쓰이는 의미 : 컴퓨터와 컴퓨터를 연결해주는 망
프로토콜(Protocol)
- 네트워크를 구축하기 위한 컴퓨터 간의 연결 규격
- TCP/IP : 여러 프로토콜 중 가장 널리 쓰이며 인터넷에서도 사용되고 있는 프로토콜
TCP/IP(Transmission Control Protocol/Internet Protocal)
- 컴퓨터 간에 통신할 수 있도록 만든 프로토콜의 종류 중 한 가지
- 이 프로토콜에 기반하고 있는 것이 인터넷임
- TCP/IP가 인터넷의 기반 프로토콜로 자리 잡은 이유
: 하드웨어, 운영체제, 접속 매체와 관계없이 동작할 수 있는 개방형 구조이기 때문.
[TCP/IP의 4계층 구조]
응용 계층 - WWW, FTP, Telnet, SMTP와 같은 네트워크 프로그램으로 구성
전송 계층 - 각 시스템을 연결하고 TCP 프로토콜을 이용하여 데이터를 전송
인터넷 계층 - IP 프로토콜을 이용하여 데이터를 정의하고 경로를 배정.
물리 계층 - 실제 네트워크에 접근할 수 있도록 하는 물리적인 부분.
OSI 7계층
- 네트워킹을 위한 물리적 장비에서부터 실제 서비를 제공하기 위한
어플리케이션에 이르는 단계까지를 계층화한 것을 의미함
- 계층화를 통해 상위 레벨에서는 하위 레벨에서 구현한 내용을 모르더라도
표준화된 인터페이스를 통해 내트워크 시스템을 개발, 운영할 수 있음
TCP/IP
- TCP/IP 는 이러한 OSI 7계층을 좀 더 단순화하여 4계층으로 정의한 것임
- TCP : 데이터 흐름 관리, 데이터 정확성 확인 등의 역할을 수행함
- IP : 데이터(패킷)를 목적지까지 전송하는 역할을 담당함
- TCP/IP 는 개방형 구조로, 특정 운영체제나 하드웨어에 영향을 받지 않고
근거리와 원거리 모두 데이터를 전송할 수 있음.
IP주소 (IP Address)
- TCP/IP로 연결된 네트워크에서 각각의 컴퓨터를 구분하기 위해 사용하는 주소
- IP 주소는 숫자로 구성되어 있음
- '123.123.123.123'과 같이 4개로 구분되며, 10진수를 사용함
- 사용할 수 있는 IP 주소 범위
인터넷
Intranet 과 internet의 차이점
- Intranet은 폐쇄적 내부 네트워크를 의미함
- Internet은 전세계가 하나로 연결된 네트워크를 의미함
- 즉 인터넷(Internet) 자체는 네트워크 인프라임
- 우리가 알고 있는 웹, 이메일 등은 인터넷 기반의 서비스인 셈.
인터넷 기반 서비스
- 웹 이외에도 이메일, FTP, Telnet, DNS 등이 있지만 일반적으로 사용하는
인터넷 기반 서비스로는 웹이 절대적임.
: 이메일은 네이버, 다음, 구글과 같은
웹 기반의 메일 서비스를 이용하는 경우가 많음.
프로토콜 (Protocol)
- 네트워크에 연결된 컴퓨터들 간의 통신 규약을 의미함
- 인터넷 기반 서비스는 TCP/IP를 사용하는 4계층 중에서도
응용계층에 해당하는 프로토콜임.
- 즉 물리적인 네트워크 연결은 TCP/IP를 사용하지만,
응용 계층에서는 서비스마타 별도의 규격이 필요함.
포트 (Port)
- 네트워크 서비스를 제공하기 위한 일종의 출입문임
- 하나의 컴퓨터에서 여러 개의 네트워크 서비스를 제공하는 경우
이들을 구분하기 위한 목적으로 사용함
: 예시) 은행에서 입출금, 대출, 신용카드, 보험 등
업무에 따라 창구를 구분해놓기
- 포트와 프로토콜이 일치하지 않는 경우 정상적인 네트워크 서비스를 이용할 수 없음
도메인 네임 시스템(Domain Name System)
- 컴퓨터의 IP 주소는 네트워크에서 컴퓨터를 구분해주는 주민번호와 같은 개념
- 인터넷 주소의 형태 : 호스트 (컴퓨터) 이름 (WWW) + 도메인 이름 (Name.co.kr)
- 도메인 이름은 규칙에 따라 붙여지며, 도메인을 관리하는 기관에
일정 비용을 지불하고 구매해야함
- 도메인 이름을 통한 웹 사이트 접속도 겉으로는 보이지 않지만
내부적으로 도메인 이름을 IP 주소로 변환하는 서비스를 이용함.
DNS 동작 구조
PC ___1.인터넷 주소www.juso.co.kr_> 통신사 DNS 서버 ____2. www__>
__3. 218.38.XX.XXX_ ns.juso.co.kr 주소 DNS 서버 __4. 218.38.XX.XXX_> PC
section 03 웹 프로그래밍의 구조
클라이언트 - 서버 구조
클라이언트 - 서버 구조
- 웹 서비스 제공을 위해서는 서버 컴퓨터와 서버에서 동작하는 프로그램이 필요.
[웹프로그래밍의 구조]
/client /server
front end back end
:HTML / CSS / JavaScript : 서블릿/JSP / Spring 프레임워크, 파이썬
Angular/ React / Vue
- 클라이언트 : 웹 서비스를 이용하는 사용자
- 서버 : 웹 서비스를 제공하기 위한 서비스 공급자
- 프론트엔드 : 클라이언트 중심의 프로그래밍 (HTML, CSS, 자바스크립트) 영역
- 백엔드 : 서버를 구성하며 서비스를 제공하기 위한
서버 쪽 프로그래밍 (웹 서버 소프트웨어, 웹 프레임워크, 데이터베이스) 영역
HTML(HyperText Markup Language)
- 웹 문서의 구조를 정의하고 콘텐츠를 표현하는 기본 마크업 언어
- 웹을 통해 콘텐츠를 제공하려면 HTML을 사용해야 함
- HTML은 태그라고 하는 간단한 표기법으로 표현하고자 하는 정보에 의미를 부여함
CSS ( Cascading Style Sheet )
- HTML 문서에 레이아웃과 디자인을 포함한 시각적 요소를 정의하기 위한 규격
- HTML은 콘텐츠의 내용과 구조 (레이아웃)를 정의하고
CSS 에서 콘텐츠의 위치, 정렬, 글자 크기, 여백, 배경 색상 등을 정의함
- 디자인을 적용할 HTML 요소를 셀렉터(Selector)로
지정하고 원하는 디자인 속성을 부여하는 방식
자바스크립트 (JavaScript)
- HTML 문서에서 동적으로 변하는 콘텐츠를 표현하기 위해 이벤트처리를
하거나 서버와 연결하여 데이터를 가지고 오는 등의 역할을 하는 프로그램 언어.
- HTML 문서에서 이벤트를 서버 연결 없이 동적으로 처리할 수 있는 기술임
: 즉 서버에 새로 접속하지 않고도 화면 정보가 변하는 기능을 함
- 대표적인 자바스크립트 라이브러리 (프레임워크)
: 앵귤러(Angular.js), 뷰(Vue.js), 리엑트(React.js) 등
백엔드 중심 개발
- 전통적인 웹 개발 모델이며, 서버에서 모든 것을 담당하는 방식임
- 특히 자바 서블릿/ JSP는 가장 인기 있는 백엔드 개발 기술임
<백엔드 동작의 개요 >
웹 브라우저 > 1. 요청(URL) -> 서버 -> 2. 데이터 처리 / 화면 호출 - Servlet / Java -> DB
JSP / (HTML) + 데이터 --> 3. JSP에서 HTML과 데이터 결합
----4. 응답 (HTML) --> 웹 브라우저
Dynamic web project 에서는 src - webapp 이하의 경로가 웹과 연결되어서 출력됨.
jsp file 실행 확인 => web browser
하이퍼텍스트 ? hypertext 참조 / 참조로 이동하는 것 링크이동. //
DNS (domain name system)
name server id 구하기
at cmd
>>> C:\Users\python>nslookup
ip adress
at cmd
>> ipconfig
TCP/IP기반에 인터넷에서 사용되는 서비스들 : DNS, email, www(web)..
인터넷 = IP + PORT
실습 .
chap21 java resources src/ main/ java
- com.example- Htmlservlet
1. html / frontend
2. servlet
3. backend
4. web
5. html / frontend
web browser / --- front end : html, css, javaScript
웹브라우저가 서버로 부터 정보를 받아서 실행 : (랜더링 )
댓글