팀장님과 미팅을 하면서 이런 저런 이야기를 했는데,
"WAS 아세요?" 하셔서 으엇..어... 😅
"웹 서버 아세요?"에도 으엇... 😬
순간 어떻게 취업했지 반성했습니다...🤔
무튼,
어디선가 들어는 봤고, 어떻게 저떻게 쓰고는 있는 서비스를 개념과 좀 연결 짓고자 이번 포스트를 준비했습니다. 여러 포스트를 참고하여 쓰는 만큼, 관련 소스가 많을 듯 해서 맨 아래에 정리해두도록 하겠습니다.
먼저 정적 및 동적 웹 페이지를 살펴 본 뒤 웹 서버와 웹 애플리케이션 서버에 대해 알아보겠습니다.
오늘 다룰 개념들은
- 정적 웹 페이지
- 동적 웹 페이지
- Client-side code
- Server-side code / Server-side programming
- Web server
- Application Server(Web Application Server)
1. Static Web Page vs. Dynamic Web Page
1) 정적 웹 페이지 Static Web Page
- HTML, JavaScript(client-side code), CSS 등의 언어로 쓰여져 있고, 저장 되어 있는 파일을 그대로 보여주는 페이지
👉 보통 이런 페이지들은 Client-side code이다. - 웹 브라우저를 통해 클라이언트의 요청을 서버가 받아서, 추가적인 동작 없이 응답을 그대로 전달해서 보여준다.
👉 적혀져 있는 코드를 그대로 반환한다. - 수동으로 바꾸지 않는 한, 페이지는 계속 한 페이지, 즉 같은 페이지로 static 하다.
Client-side code
HTML, CSS, Javascript로 작성 되며, 웹 브라우저 내에서 작동할 뿐 OS에는 거의 영향을 끼치지 못한다.(파일 시스템에 접근하는 것조차 한정적이다.)
유저 별로 다른 화면을 보도록 컨트롤할 수 없고, client-side code에서는 브라우저별로 호환성이 천차만별이다.
2) 동적 웹 페이지 Dynamic Web Page
- CGI, AJAX, ASP, ASP.NET 등 beyond client-side code로 쓰여져, 요청에 맞추어 데이터를 가공하여 보여주는 페이지
- 클라이언트에 따라 페이지의 콘텐츠가 달라질 수 있다.
👉 데이터베이스를 먼저 읽고 그에 따라 응답한다.
👉 정적 웹 페이지에 비해서 렌더링 시간이 오래 걸린다. - 주가나 날씨 정보처럼 정보가 자주 바뀌는 곳에서 사용된다.
server-side programming / back-end scripting
동적 웹 사이트를 지원하는 대부분의 코드는 서버 위에서 동작한다. 이를 위한 코드 작성을 server-side programming 또는 back-end scripting이라고 부른다.
Server-side code는 PHP, Python, Ruby, C#, JavaScript(NodeJS) 등 매우 다양한 언어로 쓸 수 있다. 서버의 시스템에 접근하기 용이하며, 개발자가 원하는 언어를 선택할 수도 있다.
장점으로는
1. 정보의 저장이나 전달이 효율적이고
2. UX를 커스텀하기 편하고
3. 콘텐츠 접근을 통제할 수 있으며
4. 세션이나 상태 정보를 저장할 수 있고
5. 알림이나 대화를 하기에 적합하고
6. 데이터 분석에도 용이하다.
비교
| 정적 웹 페이지 | vs | 동적 웹 페이지 |
|---|---|---|
| HTML, JS, CSS, 이미지 ... | AJAX, ASP, ... | |
| 적혀 있는 코드 그대로 응답 | 동작 방식 | 데이터베이스를 먼저 읽고 그에 따라 응답 |
| 빠름 | 렌더링 시간 | 비교적 느림 |
웹 브라우저와 서버의 소통 방식
웹 브라우저는 HTTPHyperText Transfer Protocol를 통해 웹 서버와 통신한다. 어떤 웹 페이지의 버튼을 클릭하거나 양식을 제출하거나 검색을 하면, 웹 브라우저가 목표 서버로 HTTP 요청을 보내는 식이다.
요청은 필요한 리소스를 알아볼 수 있도록 URL를 포함하고 있고, 필요한 action의 방식(method) 역시 명시하고 있다. URL 파라미터같은 추가적인 정보도 포함하고 있을 수 있고 말이다.
무튼, 웹서버는 클라이언트의 요청을 기다리고 있다가 요청이 도착하면 HTTP 응답 메시지와 함께 답을 보낸다.
성공적인 응답일 경우 body에 요청했던 리소스가 담겨 있을 것이고, 이는 웹 브라우저에 띄워질 것이다.
2. Web Server
- 웹 브라우저의 HTTP 요청에 따라서 정적 웹 콘텐츠(HTML 페이지, 파일, 이미지, 비디오 등)를 보내줌
웹 서버의 예
- Apache HTTP Server
- NGINX
3. Application Server, WAS
- 웹 서버와 동일하게 웹 콘텐츠를 전달할 수도 있지만, 핵심적인 건 유저와 서버가 원활하게 소통하게 하는 것이다. enable interaction between end-user clients and server-side application code
👉 동적 콘텐츠를 만들어 내거나 전달하는 식(ex. 대화, 실시간 분석 등)
server-side (application) code
주로 비즈니스 로직이라고도 불림
애플리케이션 서버의 예
- Apache Tomcat
- Glassfish
- Jeus
4. Web Server vs. WAS
| Web Server | Application Server |
|---|---|
| 정적 콘텐츠에 적합 | 동적 콘텐츠에 적합 |
| 리소스를 적게 쓰고, 적게 활용함 | 더 많은 리소스를 쓰고 활용함 |
| 웹 애플리케이션 구동 환경을 마련함 | 애플리케이션 자체를 위한 구동 환경을 마련함 |
| 멀티 스레딩 지원 됨 | 멀티 스레딩 불가능 |
| HTML, HTTP 프로토콜 사용 | HTTP, RPC/RMI 프로토콜 사용 |
References
All Image or Original Writings Right Reserved by
Difference between Static and Dynamic Web Pages
Static vs Dynamic Websites: What’s the Difference?
[Web] Web Server와 WAS의 차이와 웹 서비스 구조
Introduction to the server side
