1 . 웹
- 웹(Web) : 우리가 인터넷을 통해 정보를 보고, 읽고, 상호작용할 수 있게 해주는 서비스
- 흔히 사용하는 웹사이트, 블로그, 유튜브, 쇼핑몰 등은 모두 웹의 한 형태
- 웹은 HTML로 만들어진 문서(웹 페이지)를 브라우저(크롬, 사파리 등)가 읽어서 화면에 보여주는 방식으로 작동
- 웹은 인터넷 위에서 돌아가는 서비스 중 하나로, 우리가 주소창에 URL을 입력하면 HTTP 같은 프로토콜을 통해 서버에 요청하고, 그 결과를 받아와서 보여주는 구조 => 웹은 인터넷 위에 펼쳐진 거대한 정보 공간
1 - 1 . 인터넷과 웹의 차이
- 인터넷(Internet) : 전 세계 컴퓨터를 연결하는 네트워크 자체
- 웹(Web) : 인터넷 위에서 동작하는 서비스 중 하나
1 - 2 . 웹의 작동 방식
1. 사용자가 웹 브라우저에 주소(URL)를 입력
-> https://www.example.com
2. DNS 서버가 주소를 IP 주소로 바꿔줌
-> 컴퓨터는 사람이 쓰는 도메인을 이해하지 못하기 때문에 DN가 이 주소를 IP 주소로 바꿔줌
3. 브라우저가 서버에 요청을 보냄 (HTTP 요청 - Request )
-> HTTP 요청: 브라우저는 해당 IP 주소를 가진 서버에게 "웹 페이지 보여줘!"라는 메시지를 보냄
4. 서버가 요청을 받고, 웹 페이지 파일을 응답 (HTTP 응답 - Request )
-> HTTP 응답: 서버는 요청을 받으면, 내부에 저장된 HTML, CSS, Java등의 파일을 찾아서 브라우저에게 보냄
-> HTML: 구조 / CSS: 디자인 / JS: 동작
5. 브라우저가 파일을 해석해서 화면에 보여줌
-> 브라우저는 서버로부터 받은 HTML, CSS, JS 파일을 읽고 해석해서 웹페이지처럼 화면에 그려줌
-> 사용자는 웹사이트를 눈으로 보고, 클릭하고, 입력할 수 있는 상태가 됨
사용자
↓
브라우저
↓
DNS 조회
↓
웹 서버
↓
HTML/CSS/JS 응답
↓
브라우저 렌더링
↓
웹 페이지 표시
- HTTP : 웹 브라우저와 서버가 데이터를 주고받는 통신 규약
- HTTPS : HTTP에 보안 기능(SSL/TLS)을 추가한 프로토콜
1 - 3 . DNS (Domain Name System)
- DNS : 우리가 웹사이트 주소를 입력할 때 사용하는 도메인 이름(예: www.example.com)을 컴퓨터가 이해할 수 있는 IP 주소(예: 93.184.216.34)로 바꿔주는 시스템
- 마치 전화번호부처럼 동작해서, 사람이 기억하기 쉬운 이름을 숫자로 된 주소로 바꿔줌
-> 사용자가 웹 브라우저에 www.naver.com을 입력하면 DNS는 해당 도메인에 해당하는 IP 주소를 찾아주고,
그 주소를 통해 실제 서버와 통신이 시작됨
- DNS 덕분에 우리는 복잡한 숫자 대신 친숙한 이름으로 쉽게 웹사이트에 접속할 수 있음
1 - 4 . Server와 Client
- 서버(Server)와 클라이언트(Client)는 인터넷에서 정보를 주고받는 관계를 설명하는 기본 개념
- 클라이언트는 정보를 요청하는 쪽, 서버는 그에 대한 내용을 응답해 주는 쪽
-> ex) 클라이언트 -> 웹 브라우저, 스마트폰 앱 / 서버 -> 웹사이트의 본체나 데이터가 저장된 컴퓨터
1 - 5 . Frontend와 Backend
- 웹 서비스는 크게 프론트엔드와 백엔드로 구성
- 사용자는 프론트엔드를 통해 웹 서비스를 이용하며 백엔드는 사용자의 요청을 처리하고 필요한 데이터를 관리함
- 프론트엔드 (Frontend) : 사용자가 웹 브라우저를 통해 직접 보고 상호작용하는 영역
- 역할 : 화면 구성, 디자인 적용, 사용자 입력 처리, 서버와 데이터 통신, 사용자 경험(UX) 제공
- 주요 기술 : HTML(웹 페이지의 구조), CSS(웹 페이지의 디자인), JavaScript(웹 페이지의 동작)
-> ex) 로그인 화면, 게시글 목록, 회원가입 화면 등
- 백엔드(Backend) : 사용자의 요청을 처리하고 비즈니스 로직을 수행하는 영역
- 사용자는 직접 볼 수 없지만 웹 서비스의 핵심 기능이 동작하는 부분
- 역할 : 로그인 인증, 회원 정보 관리, 데이터 저장 및 조회, 권한 관리, API 제공
- 주요 기술 : Java / Spring, Python / Django, Node.js / Express, PHP / Laravel
-> ex) 로그인 정보 검증, 게시글 저장, 상품 주문 처리, 결제 처리 등
1 - 6 . Database(DB)
- 웹 서비스의 데이터를 저장하고 관리하는 시스템
- Backend는 Database와 통신하여 데이터를 저장하거나 조회한 뒤 그 결과를 사용자에게 전달
사용자
↓
게시글 작성
↓
Frontend
↓
게시글 등록 요청
↓
Backend
↓
Database 저장
↓
저장 완료
↓
Frontend
↓
화면 표시
1 - 7 . 최초의 웹 사이트
- 1991년 스위스에 있는 CERN(유럽 입자 물리 연구소)의 팀 버너스리(Tim Berners-Lee) 과학자에게 개발됨
- 웹사이트는 "월드 와이드 웹(WWW)이란 무엇인가?"를 설명하는 사이트였음 -> 웹 자체에 대한 소개서 같은 역할
- 주소 : http://info.cern.ch/
2 . 웹 서비스
- 인터넷을 통해 클라이언트(사용자)와 서버 간에 데이터를 주고받으며 기능이나 정보를 제공하는 소프트웨어 시스템
- 사용자는 웹 브라우저나 애플리케이션을 통해 웹 서버에 요청을 보냄
- 서버는 요청에 맞는 데이터를 처리하여 결과 응답함
- 웹 서비스는 HTML 페이지 제공, 파일 업로드, API 서비스 등 다양한 형태로 제공
- HTTP 프로토콜을 기반으로 작동
2 - 1 . 파이썬의 웹 서비스란?
- 파이썬에서 웹 서비스를 개발한다는 것은, 파이썬 코드로 사용자의 요청(예: 게시글 보기, 로그인 시도 등)을 처리하는 웹 애플리케이션을 만들고, 이를 웹을 통해 사용할 수 있도록 서버를 실행하는 것 의미
- 파이썬으로 웹 서비스를 만들 때 가장 많이 사용하는 도구 -> 웹 프레임워크
1. Flask (플라스크) – 가볍고 배우기 쉬운 웹 프레임워크
- 공부용, 소규모 프로젝트에 적합한 도구
- 설치가 간단하며 코드를 빠르게 작성할 수 있음
2. Django (장고) – 대형 서비스도 가능한 풀스택 프레임워크
- 사용자 인증, 데이터베이스 연동, 관리자 페이지 등 다양한 기능이 기본으로 내장되어 있음
- 구조적, 큰 프로젝트에 적합
- 웹 사이트에 최적화
3. FastAPI – 빠르고 현대적인 비동기 웹 프레임워크
- 비동기 지원 (async/await 사용) : 고성능 서버를 쉽게 작성할 수 있어 많은 요청을 빠르게 처리할 수 있음
- 자동 API 문서 생성 : 개발자가 API 문서를 따로 만들 필요 없이 /docs에 접속하면 Swagger UI로 자동 생성된 문서를 확인할 수 있음
- 타입 힌트를 통한 유효성 검사 : Python의 타입 힌트를 이용해 입력값을 자동으로 검증해 주고 오류 메시지를 깔끔하게 제공해 줌
'web' 카테고리의 다른 글
| Git (0) | 2026.06.15 |
|---|---|
| JavaScript - 1 (0) | 2026.06.15 |
| HTML, CSS - 3 (0) | 2026.06.13 |
| HTML, CSS - 2 (0) | 2026.06.11 |
| 2 . HTML, CSS - 1 (0) | 2026.06.11 |