클라이언트 측과 서버 측은 무엇을 의미할까요? | 클라이언트 측과 서버 측의 비교

클라이언트 측과 서버 측이란?

클라이언트 측과 서버 측은 웹 개발 용어로, 애플리케이션 코드가 실행되는 위치를 설명합니다.클라이언트 측/서버 측과 프런트엔드/백엔드는 완전히 동일하지는 않지만, 웹 개발자는 이 구분을 프런트엔드 대 백엔드라고 부르기도 합니다.서버리스 아키텍처에서는 서버리스 벤더가 모든 서버 측 프로세스를 호스팅하고 리소스를 할당하며, 애플리케이션 사용량이 증가함에 따라 프로세스가 확장됩니다.

클라이언트-서버 모델이란?

인터넷의 대부분은 클라이언트-서버 모델을 기반으로 합니다. 이 모델에서는 사용자 장치가 서로 통신하는 대신 중앙에 위치한 서버와 네트워크를 통해 통신하여 필요한 데이터를 가져옵니다. 노트북, 스마트폰, 데스크톱 컴퓨터 등의 최종 사용자 장치는 마치 회사에서 서비스를 받는 고객처럼 서버의 '클라이언트'로 간주됩니다. 클라이언트 장치는 웹 페이지 또는 애플리케이션에 대한 요청을 서버에 보내고 서버는 이에 대한 응답을 제공합니다.

클라이언트-서버 모델이 사용되는 것은 일반적으로 서버가 사용자 장치보다 더 강력하고 안정적이기 때문입니다. 서버는 또한 개별 서버가 다운되더라도 다른 서버가 백업하는 경우가 많으므로 항상 켜져 있고 사용할 수 있도록 지속적으로 유지 관리되고 통제된 환경에 보관됩니다. 한편, 사용자는 장치를 켜고 끄거나 장치를 분실하거나 파손할 수 있으며, 이는 다른 사용자의 인터넷 서비스에 영향을 미치지 않아야 합니다.

서버에서는 한 번에 여러 클라이언트 장치에 서비스를 제공할 수 있으며, 각 클라이언트 장치에서는 인터넷에 액세스하고 탐색하는 과정에서 여러 서버에 요청을 보냅니다.

여러 클라이언트와 서버가 상호 작용합니다.

각 클라이언트는 여러 서버와 통신하며, 그 반대의 경우도 마찬가지입니다.

사용자가 인터넷을 검색하면서 브라우저 바에 'netflix.com'을 입력한다고 가정해 보겠습니다. 이렇게 하면 DNS 서버에 netflix.com의 IP 주소를 요청하고 DNS 서버는 브라우저에 IP 주소를 제공하여 이 요청에 응답합니다. 다음으로, 사용자의 브라우저에서는 영화 썸네일 이미지, 넷플릭스 로고, 검색창 등 페이지에 표시되는 콘텐츠에 대해 넷플릭스 서버에 요청합니다(IP 주소 사용). 넷플릭스 서버에서는 이를 브라우저에 전달하고 브라우저에서는 클라이언트 장치에서 페이지를 로드합니다.

클라이언트 측이란?

웹 개발에서 '클라이언트 측'은 웹 애플리케이션에서 클라이언트(최종 사용자 장치)에 표시되거나 발생하는 모든 것을 의미합니다. 여기에는 텍스트, 이미지, 나머지 UI 등 사용자에게 표시되는 내용과 애플리케이션이 사용자의 브라우저 내에서 수행하는 모든 작업이 포함됩니다.

HTML, CSS 등의 마크업 언어는 클라이언트 측의 브라우저에서 해석됩니다. 또한 많은 최신 개발자들은 애플리케이션 아키텍처에 클라이언트 측 프로세스를 포함시키며, 모든 것을 서버 측에서 처리하는 것에서 벗어나고 있습니다. 예를 들어 동적 웹 페이지*에 대한 비즈니스 로직은 일반적으로 최신 웹 애플리케이션에서 클라이언트 측에서 실행됩니다. 클라이언트 측 프로세스는 거의 항상 JavaScript로 작성됩니다.

앞서의 netflix.com 예시에서 사용자에게 Netflix 메인 페이지가 표시되는 방식을 결정하는 HTML, CSS, JavaScript는 클라이언트 측 브라우저에서 해석됩니다. 이 페이지에서는 '이벤트'에도 반응할 수 있습니다. 예를 들어, 사용자가 동영상 썸네일 이미지 중 하나에 마우스를 가져가면 이미지가 확장되고 인접한 썸네일이 한쪽으로 약간 이동하여 더 큰 이미지를 위한 공간이 확보됩니다. 이는 클라이언트 측 프로세스의 예로, 웹 페이지 내의 코드가 사용자의 마우스에 반응하여 서버와 통신하지 않고 이 작업을 시작합니다.

클라이언트 측을 프런트엔드라고도 하지만, 이 두 용어는 정확히 같은 의미는 아닙니다. 클라이언트 측은 프로세스가 실행되는 위치만을 의미하며, 프런트엔드는 클라이언트 측에서 실행되는 프로세스의 종류를 의미합니다.

*동적 웹 페이지는 모든 사용자에게 동일한 콘텐츠를 표시하지 않으며 사용자 입력에 따라 변경되는 웹 페이지입니다. Facebook 홈페이지는 동적인 페이지이며, Facebook 로그인 페이지는 대부분 정적인 페이지입니다.

서버 측이란?

클라이언트 측과 마찬가지로 '서버 측'은 클라이언트가 아닌 서버에서 일어나는 모든 일을 의미합니다. 과거에는 거의 모든 비즈니스 로직이 서버 측에서 실행되었으며, 여기에는 동적 웹 페이지 렌더링, 데이터베이스와의 상호 작용, 신원 인증, 푸시 알림이 포함되었습니다.

이러한 모든 프로세스를 서버 측에서 호스팅할 때 발생하는 문제점은 프로세스 중 하나를 포함하는 각 요청이 매번 클라이언트에서 서버로 이동해야 한다는 것입니다. 이로 인해 대기 시간이 많이 발생합니다. 이러한 이유로 최신 애플리케이션에서는 클라이언트 측에서 더 많은 코드를 실행하며, 한 가지 사용 사례는 브라우저 내에서 사용자가 보는 콘텐츠를 변경하는 스크립트를 실행하여 동적 웹 페이지를 실시간으로 렌더링하는 것입니다.

'프런트엔드' 및 '클라이언트 측'과 마찬가지로 백엔드도 서버에서 발생하는 프로세스를 지칭하는 용어지만, 백엔드는 프로세스 유형만을 의미하고 서버 측은 프로세스가 실행되는 위치를 나타냅니다.

클라이언트 측 스크립팅이란? 서버 측 스크립팅이란?

클라이언트 측 스크립팅은 클라이언트 장치에서, 일반적으로 브라우저 내에서 JavaScript와 같은 스크립트를 실행하는 것을 의미합니다. JavaScript는 보편적으로 지원되므로 모든 종류의 스크립트가 JavaScript로 작성된 경우 클라이언트 측에서 실행될 수 있습니다. 다른 스크립팅 언어는 사용자의 브라우저가 해당 언어를 지원하는 경우에만 사용할 수 있습니다.

서버 측 스크립트는 사용자 작업에 대한 응답으로 웹 페이지에 동적 콘텐츠를 전달하기 위해 클라이언트가 아닌 서버에서 실행되는 경우가 많습니다. 서버는 다양한 언어를 지원할 수 있으므로 서버 측 스크립트를 JavaScript로 작성할 필요는 없습니다.

스크립트는 클라이언트 측과 서버 측에서 실행됩니다.

데이터는 클라이언트와 서버 간에 주고받으며 스크립트는 양쪽 모두에서 실행될 수 있습니다.

서버리스 아키텍처에서 서버 측 프로세스는 어떻게 작동할까요?

서버리스 컴퓨팅에서는 모든 서버 측 또는 백엔드 프로세스가 여전히 클라이언트 장치 대신 서버에서 실행되지만, 특정 서버 또는 서버 집합에 배포되지는 않습니다. 백엔드 프로세스는 필요에 따라 실행되고 자동으로 확장되는 함수로 세분화됩니다. 개발자는 서버리스 아키텍처 내에서 일반적으로 서버 측에서 실행되는 모든 기능을 계속 빌드할 수 있습니다.

Cloudflare Workers는 서버 측에서 실행될까요, 아니면 클라이언트 측에서 실행될까요?

Cloudflare Workers는 온디맨드 방식으로 실행되는 서버리스 JavaScript 함수이며, 클라이언트와 원본 서버 사이에서 CDN 캐싱을 위해 Cloudflare가 사용하는 에지 네트워크에서 실행됩니다. 이를 통해 개발자는 기술적으로는 서버 측에 있지만, 클라이언트 장치에 최대한 가까운 위치에 있는 서버리스 백엔드를 구축할 수 있으므로 대기 시간을 줄고 애플리케이션이 사용자 상호 작용에 더 빠르게 응답할 수 있습니다.

Cloudflare Workers를 시작하려면 개발자 문서를 참조하세요.