1) 웹 브라우저가 웹서버와 상호작용할 수 있는 방법에는 어떤 것들이 있나요 ?
기본적으로 URL을 통해 접속하는 방법이 있습니다. URL을 직접 입력하거나 링크를 통해 접속 하면 HTTP 메서드로 GET요청이 날아가게 됩니다.
또 다른 방법으로는 form 태그를 사용하여 상호작용하는 것인데, 일반적으로는 form 태그는 POST로 요청합니다.
두가지 방법은 모두 사용자의 웹 페이지를 새로고침해야 한다는 한계가 있는데요 이런 한계를 극복하는 방법에는 AJAX로 요청한느 방법이 있습니다. AJAX로 요청하면 웹 페이지를 새로고침 하지 않고도 상호작용 할 수 있습니다. 마지막으로 웹 소켓을 통한 상호작용도 가능합니다. 앞서 이야기한 방법들은 모두 클라이언트 쪽에서 먼저 서버로 요청을 해야만 데이터를 보낼 수 있었습니다.
서버에서 먼저 클라이언트로 보내는 방법이 필요했고, 그 대안이 바로 웹 소켓을 통한 연결로 정보를 주고 받는 것입니다.
1-1) AJAX가 필요한 이유와 AJAX를 사용하면 무엇을 할 수 있는지 설명해보세요
1-2) 웹 소켓은 어떤 경우에 사용하나요 ?
2) HTML 페이지 가장 상단에 있는 독타입은 어떤 기능을 하나요 ?
독타입은 해당 HTML 문서의 HTML 버전을 나타냅니다. 일반적으로 우리가 작성하는 HTML 버전은 5버전이고 HTML5는 현재 HTML의 표준으로 사용되고 있습니다.
3) HTML 문서의 head태그에는 어떤 정보들이 들어가나요 ?
head태그에는 주로 HTML 문서를 설명하기 위한 메타데이터가 들어갑니다. 여기에는 HTML 페이지의 제목을 지정하기 위한 title 태그, 캐릭터셋이나 오픈 그래프를 지정할 수 있는 meta태그, CSS를 첨부하기 위한 link 태그 등이 포함됩니다.
- 오픈그래프 질문 or 리퍼러(referer)
오픈그래프 - 사용자의 편의를 위해 미리보기에서 어떤 이미지와 제목을 보여줄 것인지 명시하는 방법 , og로 표기
리퍼러 : 클라이언트가 이전에 어떤 페이지에 있었는지를 나타내는 값으로
클라이언트의 유입 경로를 추적하거나 통계를 내기 위해 중요 항목
meta 태그에서 제어 할 수 있다.
4) 컴파일 언어와 인터프리터 언어의 차이를 설명해 보세요.
컴파일 언어는 프로그래밍 언어로 작성된 소스코드가 컴파일되어, 운영체제별로 실행될 수 있는 파일로 배포되는 언어를 의미합니다.
인터프리터 언어는 컴파일 과정 없이 프로그래밍 언어가 코드 실행 환경으로 바로 배포된 후 인터프리터에 의해 실행됩니다.
컴파일 언어로는 C나 자바 같은 언어가 있고인터프리터 언어로는 자바스크립트나 파이썬언어가 있습니다.
컴파일언어는 문법적인 오류를 컴파일 시점에 체크하지만, 인터프리터 언어는 실행 시점에 체크합니다.
그래서 인터프리터 언어는 안정적인 코드 작성을 위해 IDE도움을 받거나 자바스크립트를 확장한 타입스크립트처럼 컴파일 과정을 추가하기도 합니다.
타입스크립트 : JS를 확장한 언어로 자바스크립트에 컴파일 과정과 자료형을 추가한 언어
물론 여기서의 컴파일과정은 컴파일 언어에서의 컴파일 과정과는 다르고, 타입스크립트로 작성된 코드를 트랜스파일하여 자바스크립트로 만드는 과정을 이야기한다.
프로그래밍 언어로 작성된 소스코드를 컴파일화는 과정에있어서 기계어 의해 실행될 수 있는 상태가 되는데 이것이 실행 파일이다.
5) 데이터를 표현하기 위해 사용되는 JSON과 XML은 어떤 차이가 있나요 ?
JSON은 중괄호 ({)와 큰따옴표 (")를 사용하여 키-값 형태로 표현되는 데이터 표현 방식이고, XML은 마치 HTML처럼 태그 단위로 표현되는 방식입니다.
XML은 하나의 값을 표현하기 위해 여는 태그와 닫는 태그가 2번씩 들어가야 하기 때문에 일반적으로 JSON보다 데이터의 크기가 커집니다. 따라서 데이터 전송 시에는 동일한 데이터를 표현하더라도 데이터 크기가 작은 JSON이 더 유리합니다.
물론 XML도 장점이 있습니다. XML은 태그 형태로 표현 되기 때문에 값에 속성을 부여해 보다 풍부한 데이터 표현이 가능합니다.
5-1) JSON과 XML 둘 중 어떤 것을 사용할 건가요 ?
6) AJAX가 필요한 이유와 AJAX를 사용하면 무엇을 할 수 있는지 설명해 보세요 .
AJAX(Asynchronous JavaScript And XML)의 약자로 직역하면 비동기 자바스크립트와 XML 이라는 뜻입니다.
전통적으로 웹 브라우저에서 웹 서버로 새로운 요청을 하려면 항상 페이지를 이동했습니다.
그러나 웹 서비스가 발전하면서 더 나은 사용자 경험을 제공하기 위해 자바스크립트를 사용하여 웹 페이즈를 이동하지 않고도 새로운 정보를 요청하는 방법이 추가 되었고, 그것이 바로 AJAX 입니다.
예를 들어 AJAX를 서용하면 새로 회원가입 페이지를 띄우지 않으면서 아이디 중복 검사를 수행하거나, 페이스북이나 인스타그램 같이 뉴스 피드를 볼 수 있는 페이지에서 스크롤을 내리는 것만으로 다음 목록을 불러올 수 있습니다. 만약 다음 목록을 보기 위해 페이지가 매번 새로고침되어야 한다면 지금보다 사용자 경험이 좋지 못했을 것입니다.
- UX가 좋아진다는 것은 표면적인 특징이다 사실 웹 개발 관점에서도 차이가 있다.
AJAX를 통해 웹 서비스를 개발하면 프엔과 백엔드를 완전히 분리할수있기 때문이다.
7)동기와 비동기에 대해 설명해 주세요.
우리가 시스템을 설계할 때는 통신을 동기적으로 할지 비동기적으로 할지를 정할 수 있습니다.
동기적인 통신은 작업을 요청하는 클라이언트와 작업을 처리하는 서버의 동기화가 필요하기 때문에 클라이언트는 서버가 작업을 처리하는 동안 대기하고 있어야 합니다.
서버에서 작업에 대한 처리가 끝나면 바로 응답이 올테까요.
반면 비동기적인 통신은 클라이언트가 서버에게 작업을 요청한 후 다른 작업을 처리합니다. 클라이언트는 자신이 하던 작업을 기억하지 않고, 작업이 완료되었다는 응답이 왔을 때 무엇을 해야 할지만 미리 등록해 둡니다. 이벤트 핸들러 같은것을 통해서 말이죠.
그래서 동기적인 방식은 직관적이고 흐름을 따라가기 쉽기 때문에 문제가 생겼을 때 디버깅이 쉽습니다.
반면, 서버가 작업을 처리하는 동안 클라이언트가 대기하게 되면서 다른 작업을 하지 못할 수도 있습니다. 또 여러 가지 작업을 해야 한다면 전체 작업을 끝내는 속도가 길어질 수 있습니다.
비동기적인 방식은 반대의 특징을 가지고 있습니다. 동기적인 방식보다는 직관적이지 않고, 비동기적인 프로그래밍에 대한 지식이 없이는 디버깅도 어렵습니다. 그러나 여러 가지 작업을 처리할 경우에는 비동기적으로 작업을 요청해 두고 끝나는 대로 취합하면 전체 작업 속도를 단축할 수 있습니다.
- 비동기적인 방식이 성능 측면에서 항상 유리한 것은 아님.
- 대규모 작업을 작은 단위로 나눈다고 생각해보면 나눠진 작은 단위의 작업들이 동시에 실행될 경우, 비동기적인 방식으로 여러 작업을 동시에 실행하고 취합하면 더 빠르게 처리할 수 있다. 그러나 작은 단위의 작업들이 반드시 차례대로 실행되어야 하는 경우라면 오히려 동기적인 방식의 속도가 더 빠를 수 있다.
