웹 프로그래밍이란?
웹 프로그래밍은 웹 어플리케이션을 개발하는 과정으로, 사용자가 웹을 통해 상호작용할 수 있는 프로그램을 만드는 작업입니다. 웹 어플리케이션은 우리가 사용하는 브라우저를 통해 작동하는 소프트웨어입니다. 이를 통해 사용자는 서버에 데이터를 요청하고, 서버는 그에 맞는 정보를 반환하여 동적인 웹 페이지를 보여줍니다.
URL의 구성 요소
URL(Uniform Resource Locator)은 웹 상에서 자원의 위치를 가리키는 주소입니다. 예를 들어, 우리가 웹 페이지를 방문할 때 사용하는 주소창에 표시되는 것이 바로 URL입니다. URL의 구성 요소는 아래와 같습니다:
- 프로토콜 (Protocol): 데이터를 주고받기 위한 통신 규약으로, 가장 흔한 예는
http또는https입니다. - IP 주소: 인터넷 상에서 각 컴퓨터를 구분할 수 있는 고유한 주소입니다.
- Port 번호: 서버의 특정 서비스에 접근할 때 사용되는 번호입니다.
- DNS (도메인): IP 주소를 사람이 기억하기 쉽게 변환한 문자열입니다. 예를 들어,
http://www.google.com이 하나의 DNS입니다.
HTTP 요청과 응답
HTTP(HyperText Transfer Protocol)는 웹에서 브라우저와 서버가 통신하는 데 사용되는 프로토콜입니다. 사용자가 웹 페이지를 요청하면 브라우저는 서버에 요청을 보내고, 서버는 이에 대한 응답으로 웹 페이지 파일을 보내줍니다. 이 과정은 매우 빠르게 일어나며, 우리가 웹 페이지를 방문할 때 눈에 보이지 않는 과정입니다.
- 요청(request): 사용자가 브라우저에서 특정 웹 페이지를 요청합니다.
- 응답(response): 서버는 사용자가 요청한 페이지나 데이터를 응답으로 브라우저에 전달합니다.
- 웹 서버: 브라우저의 요청을 받아 처리하고, 그에 맞는 응답을 보내주는 서버입니다.
- 웹 브라우저: 사용자가 입력한 URL을 바탕으로 웹 서버에 요청을 보내고, 그 결과를 해석해 화면에 표시하는 프로그램입니다.
JSP와 Java Servlets
JSP(Java Server Pages)와 Java Servlets는 자바 언어를 기반으로 서버에서 동적인 웹 페이지를 생성하는 데 사용됩니다.
- JSP: 자바를 기반으로 한 서버 사이드 스크립트 언어입니다. HTML과 자바 코드를 함께 작성할 수 있어 동적인 웹 페이지를 쉽게 만들 수 있습니다.
- Java Servlets: 자바 프로그램으로 클라이언트의 요청을 처리합니다. JSP와 함께 사용되어 웹 애플리케이션을 동적으로 동작하게 만듭니다.
아파치 톰캣 (Apache Tomcat)
아파치 톰캣은 자바 기반의 웹 애플리케이션 서버로, JSP와 서블릿을 실행하는 데 널리 사용됩니다. 오픈 소스로 제공되며, 자바 웹 애플리케이션을 개발할 때 필수적인 도구입니다.
HTML 기본 구조와 태그
HTML은 웹 페이지를 만드는 기본 언어입니다. 웹 브라우저는 HTML 코드를 해석하여 화면에 표시합니다. 기본적인 HTML 문서의 구조는 다음과 같습니다:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>문서 제목</title>
</head>
<body>
<!-- 여기에 페이지의 본문 내용이 들어갑니다 -->
</body>
</html>주요 HTML 태그 설명
- 제목 태그 (
<h1>~<h6>)<h1>에서<h6>까지는 제목을 표시하는 태그입니다.<h1>은 가장 크고 중요한 제목을,<h6>은 가장 작은 제목을 나타냅니다.- 예시:
<h1>이것은 제목입니다</h1> <h2>이것은 부제목입니다</h2>
- 문단 태그 (
<p>)<p>태그는 문단을 나타냅니다. 본문의 내용을 구분할 때 사용됩니다.- 예시:
<p>이것은 본문 문단입니다.</p>
- 링크 태그 (
<a>)<a>태그는 다른 웹 페이지나 파일로 연결되는 하이퍼링크를 만듭니다.- 예시:
<a href="https://www.example.com">이 링크를 클릭하세요</a>
- 이미지 태그 (
<img>)<img>태그는 웹 페이지에 이미지를 삽입할 때 사용됩니다.src속성에 이미지의 URL을 지정합니다.- 예시:
<img src="image.jpg" alt="이미지 설명">
- 목록 태그 (
<ul>,<ol>,<li>)<ul>은 순서 없는 리스트,<ol>은 순서가 있는 리스트를 나타냅니다. 각 리스트 항목은<li>태그로 감싸져야 합니다.- 예시:
<ul> <li>항목 1</li> <li>항목 2</li> </ul> <ol> <li>첫 번째 항목</li> <li>두 번째 항목</li> </ol>
- 테이블 태그 (
<table>,<tr>,<td>,<th>)- HTML 테이블을 만들 때 사용됩니다.
<table>은 테이블을 감싸는 태그이고,<tr>은 행,<td>는 셀,<th>는 테이블 헤더를 나타냅니다. - 예시:
<table> <tr> <th>제목 1</th> <th>제목 2</th> </tr> <tr> <td>내용 1</td> <td>내용 2</td> </tr> </table>
- HTML 테이블을 만들 때 사용됩니다.
- 구분선 태그 (
<hr>)<hr>태그는 페이지 내에서 내용 간의 구분을 위해 수평선을 삽입합니다.- 예시:
<hr/>
HTML은 웹 페이지를 만들 때 가장 기본적으로 사용되는 언어입니다.
이 언어를 통해 우리는 텍스트를 구조화하고, 이미지나 링크를 삽입하며, 다양한 스타일을 적용할 수 있습니다.
위에서 소개한 태그들을 적절히 활용하면 더욱 풍부하고 구조적인 웹 페이지를 만들 수 있습니다.
'🗄️ Backend > JSP' 카테고리의 다른 글
| JSP와 MVC2 패턴 (1) | 2024.10.18 |
|---|---|
| JSP와 MVC 패턴: DAO/DTO, 커넥션 풀, EL, JSTL (1) | 2024.10.18 |
| 쿠키(Cookie)와 세션(Session) 완벽 가이드 (0) | 2024.10.18 |
| JSP와 서블릿: 동적 웹 개발의 기초 (0) | 2024.10.18 |
| HTML 기초 및 태그 정리 (2) | 2024.10.17 |