[boostcourse] 1.1. Web개발의 이해 - FE/BE

1. 웹의 동작 (HTTP 프로토콜 이해)

HTTP

- 인터넷 중 웹에서는 HTTP 프로토콜을 사용

- 인터넷상에서 서버와 클라이언트가 데이터를 주고받기 위한 프로토콜

- 어떠한 종류의 데이터도 전송할 수 있음

- 클라이언트가 서버에게 요청, 서버가 클라이언트에게 응답

- 무상태 프로토콜, Stateless

- 장점: 불특정 다수를 대상으로 하는 서비스에 적합. 클라이언트와 서버가 계속 연결된 형태가 아니기에 요청과 응답을 훨씬 더 처리할 수 있음

- 단점: 응답 후 연결을 끊어버리기에 클라이언트의 이전 상황을 알 수가 없음. 정보를 유지하기 위에 Cookie와 같은 기술 등장

URL

- Uniform Resource Locator

- 인터넷 상 자원의 위치

- https://www.ssoyeong.tistory.com/programming/123.html

- 접근 프로토콜://IP 주소 또는 도메인 이름/문서의 경로/문서 이름

- 하나의 물리적 하드웨어에는 소프트웨어가 여러 개 동작 가능. 각각의 포트 값이 할당되어야 함

HTTP 작동 방식

Request

- 요청 메소드, 요청 URI (자원 위치 명시), 프로토콜의 버전 등

Response

- 프로토콜의 버전, 응답 코드, 응답 메시지 등

 

2. 웹 Front-End 와 웹 Back-End

웹 프론트엔드

- 사용자에게 웹을 통해 다양한 콘텐츠(리소스)를 제공함

- 사용자의 요청에 반응해서 동작함

웹 프론트엔드의 역할

- 웹 콘텐츠를 잘 보여주기 위해 구조를 만들어야 함. 적절한 배치와 일관된 디자인

- 사용자 요청을 잘 반영해야 함. 소통하듯이

- HTML, CSS, JavaScript

- HTML: 원하는 문서의 구조를 표현

- CSS: 꾸미기

- JavaScript: 움직이고 변경

웹 백엔드

- 서버 입장에서의 개발

- 프로그래밍 언어, 웹의 동장 원리, 알고리즘 및 자료구조, 운영체제 및 네트워크, 프레임워크에 대한 이해, DBMS에 대한 이해

 

3. 브라우저의 동작

브라우저

- 웹을 통해서 전달되는 데이터는 어딘가에서 해석돼야 함

- 서버에서 전송한 데이터가 클라이언트에 도착해야 할 곳, 브라우저

- 브라우저에는 데이터를 해석해 주는 파서와 데이터를 화면에 표현해 주는 렌더링 엔진이 포함되어 있음

렌더링 동작 과정

렌더링: 서버로부터 요청받은 내용을 브라우저 화면에 표시하는 것

1. HTML과 CSS 파일을 각각 파싱해서 DOM 트리, CSSOM 트리를 만듦

2. 두 트리를 결합하여 Render 트리를 만듦

3. Render 트리를 화면에 어떻게 배치해야 할지 레이아웃을 구성

4. 화면상의 실제 픽셀로 변환하여 그림

 

 

4. 웹 서버

웹 서버

- 소프트웨어, 혹은 웹 서버 소프트웨어가 동작하는 컴퓨터

- 가장 중요한 기능은, 클라이언트가 요청하는 HTML 파일이나 각종 리소스를 전달하는 것

- 웹 브라우저나 웹 크롤러가 요청하는 리소스는 정적 혹은 동적인 결과가 될 수 있음

- 웹 크롤러는 네이버와 같은 검색 사이트에서 다른 웹 사이트 정보를 읽어갈 때 사용하는 소프트웨어

웹 서버 소프트웨어의 종류

- Apache, Nginx, Microsoft, Google 웹 서버 등

 

5. 웹 애플리케이션 서버 (WAS)

DBMS

- 데이터베이스를 관리하는 시스템

- 다수의 사용자들이 데이터베이스 내의 데이터에 접근할 수 있도록 해주는 소프트웨어

미들웨어

- 클라이언트 쪽에 비즈니스 로직이 많은 경우 비효율적

- 비즈니스 로직을 클라이언트와 DBMS 사이의 미들웨어 서버에서 동작하도록 함

- 클라이언트는 입력과 출력만 담당하도록 함



WAS

- 미들웨어의 일종

- 웹 클라이언트의 요청 중 보통 웹 애플리케이션이 동작하도록 지원하는 목적

- 주요 기능 3가지

1. 프로그램 실행 환경 및 DB 접속 기능 제공

2. 여러 개의 트랜잭션 관리

3. 비즈니스 로직 수행

- 웹 서버의 기능을 제공하기도 함. Tomcat만 사용해서 WEB, WAS 역할 모두 가능하기도 함

- 규모가 커질수록 WEB, WAS 분리함. 무중단 배포, failover를 위해.

 

 


 

웹 프로그래밍(풀스택)

부스트코스 무료 강의

www.boostcourse.org