1-1 웹의 정의와 웹브라우저 작동 원리
2024. 7. 8. 18:59ㆍ■ BASICS OF WEB DEVELOPMENT
웹(WEB)개발이란?
우리가 보는 홈페이지 또는 웹페이지를 만드는 기술텍스트
그렇다면 WEB 이란?
- World Wide Web 의 줄임말로 첫 글자를 따서 www 라고 부르기도 함
- 서버로부터 데이터를 가져와서 브라우저 화면 상에 표출하여 이용자에게 정보를 전달하는 창구같은 것
- 개발의 기초이기도함: 대부분 개발자들은 웹개발부터 시작
WEB 의 구성
- 웹은 Client(사용자)가 화면 상으로 정보를 전달받기 위한(view page 라고도 불림) 요청을 해주는 Web Browser와 이의 요청에 응답을 해주는 Web Server로 구성되어 있음
- Browser: Front-End (ex: HTML/CSS, JS)
Server: Back-End (ex: JAVA)
WEB BROWSER 란?
- 브라우저의 역할은
1. 예를들어 https://naver.com/ 에서 "naver.com'이라는 이름의 서버에 있는 "/"라는 주소 창구에 요청을 보냄 = 주소 창에 주소를 입력하고 엔터를 입력하는 것
2. 그 다음 브라우저는 서버가 만들어 놓은 API 라는 창구에 미리 정해진 약속대로 요청을 보내고
3. API는 요청에 맞게 네이버 홈에 해당하는 HTML 파일을 돌려주고 브라우저가 받은 것을 화면에 그려주는 것
- 그려주는 역할이란 우리가 보는 웹페이지는 서버에서 준비해두었던 것을 받아서 브라우저에서 우리가 볼 수 있도록 그려주는 역할을 수행하는 것
Q. 그럼 항상 HTML 파일로 돌려주는 것?
- 답은 NO! 데이터만 내려 줄 때가 더욱 많음 왜냐하면 개발자 도구에 보이는 HTML 파일의 코드도 결국 데이터라고 할 수 있기 때문 ex) 공연 티켓을 예매하고 있는 상황에서 좌석이 실시간으로 매진 될 때마다 보던 페이지가 새로고침 되면 예약하기 너무 어려우니 데이터만 받아서 갈아 끼우는 식으로 작동
- 실제로 많은 웹 서비스에서는 API로 요청을 보내면 서버의 데이터베이스에서 데이터를 돌려주고, 브라우저에서 Javascript 라는 언어에서 갈아 끼워줌
- 데이터만 내려올 경우에는 아래와 같이 생겼고 JSON 형식이라고 하는데 나중에 배울 예정
- 브라우저는 또한 정적(Static)페이지와 동적(Dynamic)페이지로 존재
- 정적페이지는 한번 로딩되면 추후에 서버와 소통하지않고 내부 소스만을 이용하여 정보 전달; 즉, 최초 서버로부터 소스 파일을 다운로드한 후 해당 컴퓨터 내에 존재하는 내부 소스파일을 실행하거나 동일한 페이지만 보여준다는 의미
- 동적페이지는 내부 소스 외에도 서버와 지속적으로 소통함으로써 서버 내에 데이터를 주고 전달받는 형태의 페이지; 즉, 웹이 서버와 소통하면서 이용자의 요청에 따라 서버 데이터를 화면에 표출 및 서버 데이터를 변경하는 것을 의미 ex) 네이버, 구글등의 검색페이지
WEB SERVER 란?
- 웹에 대한 요청을 받아들이는 곳으로서 요청에 대한 로직 및 데이터베이스와의 연동을 하는 곳
- 웹서버는 WAS(Web Application Server) 라는 컨트롤 타워 내 Web Server 와 Web Container 를 포함하고 있음
- 위의 사진과 같이 Client에서 정적 콘텐츠 요청이 들어오면 해당 정적 콘텐츠를 로딩해 Client에게 전달하게 되는데, 만약 동적인 콘텐츠 요청이 들어오면 Web Container가 처리를 맡아 동적 콘텐츠를 만들어 해당 파일을 client에게 전달해주게 됨, 즉 동적 콘텐츠냐 또는 정적 콘텐츠냐에 따라 처리하는 모듈이 달라짐
- 이때 들어오는 요청을 확인하고 어느 모듈에 전달할 것이냐를 정하는 것이 WAS이고 추가적으로 WAS는 외부적인 모듈인 Database도 DB Connection을 통해 Database에 접근하여 데이터를 불러와 Client에게 전달도 함
- WAS는 Web server와 Web Container를 포함한 종합 컨트롤 타워라고 생각하면 됨
- 웹 서버 하나에서 할 수 있는 일을 구분하여 사용하는 이유는 WAS는 DB 조회 등 다양한 요청을 처리하느라 바쁘기 때문에 정적 페이지와 같은 콘텐츠는 Web Server에서 빠르게 처리하고 동적 콘텐츠는 Web Container에서 처리함으로써 서버에 부하를 방지하고 또한 효율적인 서버 운영이 가능하기 때문
정리
- Web은 Web browser과 Web Server로 구분
Web Browser 은 정적 콘텐츠, 동적 콘텐츠로 구성
- Web Server 는 WAS라는 컨트롤 타워 내 Web Server와 Web Container를 포함
- 정적 처리는 Web Server, 동적 처리는 Web Container가 처리
- Database 모듈은 단독적으로 존재해 WAS가 Database에 접근하여 데이터를 관리
출처
핏불테리어님 블로그
https://velog.io/@ybnr_92/Web-%EC%9D%B4%EB%9E%80
시큐어로그님 블로그
https://blog.naver.com/securelog/223447856975
'■ BASICS OF WEB DEVELOPMENT' 카테고리의 다른 글
2-2 HTML/CSS - 추억앨범 프로젝트1 (0) | 2024.07.08 |
---|---|
1-2 HTML/CSS 기초 (0) | 2024.07.08 |