신입 개발자 기술면접 예상 질문 정리 - 네트워크(1)

1. HTTP METHOD에 대해 설명해 보세요.

HTTP 메서드는 클라이언트가 서버에게 요청하는 작업의 종류를 나타냅니다.

GET은 데이터를 요청할 때, POST는 데이터를 서버에 전송할 때 사용됩니다. PUT은 데이터를 업데이트할 때, DELETE는 데이터를 삭제할 때 사용됩니다. PATCH는 부분 업데이트에 사용됩니다.

HTTP 메서드는 REST API 설계 시 엔드포인트의 목적을 명확하게 구분하는 데 중요한 역할을 합니다. 예를 들어, 사용자의 정보를 가져오는 요청은 GET 메서드를, 새로운 사용자 정보를 등록하는 요청은 POST 메서드를 사용합니다.

*HTTP 메서드에 대한 자세한 내용은 https://inpa.tistory.com/entry/WEB-🌐-HTTP-메서드-종류-통신-과정-💯-총정리 참고

HTTP METHOD에는 get, post, put, delete 가 있습니다.
단순히 종류를 나열하는 것이 아닌, get과 post 간의 차이점에 대해 말할 수 있어야 합니다.
get은 클라이언트에서 서버로 어떠한 리소스로부터 정보를 요청하기 위해 사용되는 method입니다. 즉, 서버에서 어떤 데이터를 가져와서 보여줄 때, 값이나 내용, 상태 등을 바꾸지 않는 경우에 사용합니다.
post는 리소스를 생성/ 업데이트하기 위해 서버에 데이터를 보내는 데 사용되는 method입니다. 서버상의 데이터 값이나 상태를 바꾸기 위해서 사용합니다.
주요 차이점으로는, get 요청은 캐시가 되나, post는 캐시 되지 않습니다. get은 브라우저에 기록되지만 post는 기록되지 않습니다.

2. CORS(Cross Origin Resource Sharing)에 대해 설명해 보세요.

CORS(Cross Origin Resource Sharing)는 한 도메인에서 실행 중인 웹 애플리케이션이 다른 도메인에서 리소스를 요청할 수 있도록 허용하는 보안 메커니즘입니다.

기본적으로 브라우저는 보안을 위해 다른 도메인에서의 요청을 차단하지만, CORS를 설정하면 특정 도메인에서의 요청을 허용할 수 있습니다. 서버에서 응답 헤더에 Access-Control-Allow-Origin을 설정하여 특정 도메인 혹은 모든 도메인(*)에서의 접근을 허용할 수 있습니다. 이를 통해 클라이언트와 서버 간의 교차 도메인 통신 문제를 해결합니다.

CORS(Cross-Origin Resource Sharing)는 웹 보안 정책으로, 브라우저에서 실행 중인 스크립트가 다른 오리진 도메인(origin)에 있는 리소스에 접근 시 발생하는 보안 문제를 다루는 메커니즘입니다. 데이터 교환 시의 보안 유지와 타 도메인 리소스 사용을 통한 서비스의 독립성과 확장성 향상을 위해 필요합니다.

CORS(Cross-Origin Resource Sharing)는 Same-Origin Policy(동일 출처 정책)에 위해 웹 보안을 유지하기 위한 상황에서 사용됩니다. 브라우저가 다른 출처 리소스로의 접근을 제한하는 상황과, 웹 애플리케이션이 다른 도메인의 리소스를 필요로 하는 Cross-Origin 요청 상황에서 쓰입니다.

이러한 상황에서 CORS(Cross-Origin Resource Sharing)의 역할은 웹 서버에게 특정 도메인으로부터 오는 요청을 허용하도록 지시하여 도메인 간 데이터 교환을 안전하게 만드는 것입니다.Access-Control-Allow-Origin, Access-Control-Allow-Methods, Access-Control-Allow-Headers, Access-Control-Allow-Credentials 등의 헤더를 사용하여 제어됩니다.

3. 브라우저의 작동 방식에 대해서 설명해 보세요.

브라우저는 사용자가 요청한 웹 페이지를 화면에 렌더링하는 역할을 합니다. 브라우저의 작동 방식은 크게 요청(Request), 응답(Response), 렌더링(Rendering) 단계로 나눌 수 있습니다.

사용자가 URL을 입력하면 브라우저는 DNS를 통해 IP 주소를 조회하고, 해당 서버에 HTTP 요청을 보냅니다. 서버는 요청받은 리소스를 HTTP 응답으로 반환하며, 브라우저는 이를 해석하여 화면에 표시합니다. 렌더링 엔진(예: 크롬의 Blink)은 HTML, CSS, 자바스크립트 파일을 파싱하여 DOM 트리, CSSOM 트리를 생성하고, 이를 결합해 렌더링 트리를 구성한 후, 레이아웃과 페인팅을 거쳐 최종적으로 화면에 출력합니다. 또한, 자바스크립트는 JS 엔진(예: V8 엔진)에 의해 해석되고 실행되어 동적인 웹 페이지 기능을 제공합니다.

사용자 URL을 입력하면 브라우저는 해당 주소의 웹 서버로 HTTP 요청을 보냅니다. 서버는 받은 요청을 처리하여 HTML, CSS, JavaScript 파일 등을 브라우저에게 응답으로 보냅니다.

이후, 브라우저는 HTML을 패싱(passing)하여 돔(Document Object Model) 트리를 만들어 웹 페이지 구조를 나타냅니다. CSS 파일 역시 함께 패싱(passing)되어 CSSOM(CSS Object Model) 트리를 생성해 페이지 스타일을 정의합니다.

그 뒤, 돔(Document Object Model)과 CSSOM(CSS Object Model)을 결합하여 렌더 트리를 생성합니다. 이 트리는 페이지의 시각적 표현을 나타내며 각 요소별 크기와 위치 데이터를 포함하고 있습니다. 이를 기반으로 계산된 스타일과 레이아웃 정보를 통해 텍스트, 이미지, 색상 등 다양한 시각적 요소들을 포함한 페이지를 화면에 그려냅니다.

필요한 경우 자바 스크립트가 실행되어 동적 기능을 추가하거나 페이지를 변경할 수 있고, 모든 요소와 스크립트가 실행되면 페이지 로딩이 완료됩니다.

4. 서버 사이드 렌더링(SSR)과 클라이언트 사이드 렌더링(CSR)의 차이점을 설명해 보세요.

서버 사이드 렌더링(SSR)은 사용자가 웹 페이지를 요청하면 서버에서 HTML을 완전히 렌더링하여 클라이언트에게 전달하는 방식입니다. 초기 로딩 시간이 빠르며, SEO(검색 엔진 최적화)에 유리합니다. 반면, 서버 부하가 커질 수 있습니다.

클라이언트 사이드 렌더링(CSR)은 초기 요청 시 최소한의 HTML만을 전달하고, 자바스크립트를 사용해 브라우저에서 나머지 내용을 렌더링하는 방식입니다. 페이지 전환이 부드럽고, 사용자 경험을 향상시킬 수 있지만, 초기 로딩 속도가 느리고 SEO가 어려울 수 있습니다.

일반적으로, 초기 로딩 속도와 SEO가 중요한 경우 SSR을 사용하고, 사용자의 인터렉션이 많은 SPA(Single Page Application)에서는 CSR이 많이 사용됩니다.

서버 사이드 렌더링(SSR)은 페이지를 서버에서 렌더링하여 클라이언트에 HTML을 전달합니다. 초기 로딩이 빠르고 SEO에 유리하지만, 서버의 부하가 증가할 수 있습니다.

클라이언트 사이드 렌더링(CSR)은 클라이언트에서 자바스크립트를 사용하여 페이지를 렌더링합니다. 초기 로딩 시간이 길지만, 클라이언트의 상호작용이 빠르고, 서버의 부하가 적습니다.

⭐참고자료

1) 한빛출판네트워크, "백엔드 기술 면접 TIP: 자바 기본 문법 예상 질문 5가지와 해설", 2024.02.08, https://www.hanbit.co.kr/channel/category/category_view.html?cms_code=CMS1626582373&cate_cd=

2) 제로베이스, "현직자가 말하는 신입 백엔드 개발 면접 질문 ｜ 백엔드 스쿨", https://zero-base.co.kr/event/media_BE_school_qna

3) 스파르타코딩클럽, "2024 백엔드 면접 질문 문제은행 - 개발자 면접 준비 101", 2024.08.22, https://spartacodingclub.kr/blog/2024-backend-jobinterview-question

이 글은 참고자료를 바탕으로 각 질문에 대한 답변을 정리한 것으로, 틀린 부분이 있을 수도 있습니다.