기술 면접 질문 리스트 클라이언트 사이드 렌더링(CSR)과 서버 사이드 렌더링(SSR)의 개념과 장/단점을 설명해주세요. TCP/UDP에 대해서 설명해주세요. http와 https의 차이점에 대해 설명해주세요. 1. 클라이언트 사이드 렌더링(CSR)과 서버 사이드 렌더링(SSR)의 개념과 장/단점을 설명해주세요.. 답변: CSR - 싱글 페이지 어플리케이션에서 사용되는 렌더링 방식으로 하나의 페이지만 요청하고 이후 페이지를 전환할 경우 자바스크립트 코드를 이용해 동적으로 UI를 변경한다. 하나의 페이지에서 자바스크립트 코드로 UI를 변경하므로 부드러운 움직임을 제공해 높은 사용자 경험을 제공한다. 단점으로 페이지 최초 방문 시 필요한 모든 리소스를 로드하므로 렌더링 속도 저하의 원인이 된다. 최초 로드 ..
개발자포트폴리오 #개발자이력서 #개발자취업 #개발자취준 #코딩테스트
기술 면접 질문 리스트 GET, POST 방식의 차이점에 대해서 설명해주세요. GET, POST의 개념과 함께 데이터 흐름에 대해서 설명해주세요. 쿠키, 세션, 웹스토리지의 차이에 대해 설명해주세요. 1. GET, POST 방식의 차이점에 대해서 설명해주세요. 답변: GET은 http 요청 시 데이터를 URL의 요청 파라미터로 전송합니다. 이로 인해 민감한 정보를 포함하는 것을 지양해야 합니다. 리소스에 대한 읽기를 수행하는 요청 메서드이며, 멱등성을 보장하는데 이는 항상 동일한 요청에 대한 동일한 응답을 반환한다는 의미입니다. 이러한 특성으로 인해 응답 데이터의 캐싱이 가능해 서버로 요청하지 않고 캐시를 사용합니다. POST는 요쳥 데이터를 본문에 담아 전송합니다. 요청을 탈취당하지 않는 한 비교적 안..
기술 면접 질문 리스트 Javascript의 호이스팅에 대해 설명해주세요. 동기와 비동기의 차이에 대해 설명해주시고 비동기프로그래밍의 필요성에 대해 답변해주세요. 브라우저의 작동방식에 대해서 설명해주세요 1. Javascript의 호이스팅에 대해 설명해주세요. 답변: 자바스크립트의 식별자가 마치 현재 스코프의 최상단으로 끌어올려진 것 처럼 동작하는 것을 호이스팅이라 합니다. var, let, const 키워드 모두 호이스팅이 발생하지만, let과 const는 호이스팅 되지 않는 것 처럼 동작합니다. 그 이유로 var 키워드는 선언과 초기화가 동시에 일어나 undefined가 할당되기 때문에 선언문 이전에 변수 참조 시 에러가 발생하지 않습니다. 반면, let과 const는 선언과 초기와 단계가 분리되어 ..
기술 면접 질문 리스트 ‘==’와 ‘===’ 연산자의 차이는 무엇인지 설명해주실 수 있을까요? 데이터 10,000개를 가지고 무한 스크롤 구현시에 가장 중요하게 고려해야 할 점은 무엇인가요? JSX란 무엇인가요? 1. ‘==’와 ‘===’ 연산자의 차이는 무엇인지 설명해주실 수 있을까요? 답변: 둘 다 비교 연산자로 각각 동등 연산자와 일치 연산자라고 합니다. 동등 연산자는 좌항과 우항의 피연산자를 비교하여 타입이 다르더라도 암묵적 형 변환 후 같은 값이라면 true를 반환합니다. 일치 연산자는 암묵적 형 변환을 허용하지 않으며 각 피연산자의 타입이 같아야하며 값도 동일해야 true를 반환합니다. 2. 데이터 10,000개를 가지고 무한 스크롤 구현시에 가장 중요하게 고려해야 할 점은 무엇인가요? 답변:..
기술 면접 질문 리스트 var, let, const의 차이에 대해 알려주세요. Async/Await와 Promise의 차이에 대해 설명해주세요. Arrow Function 이란 무엇인지 설명해주실 수 있을까요? 1. var, let, const의 차이에 대해 알려주세요. 답변: var 키워드는 변수의 중복선언이 가능해 재선언이 가능하고, 함수 레벨 스코프를 따르기 때문에 함수가 아닌 일반적인 코드 블록에서 사용될 경우 전역 변수로 선언이 됩니다. let 키워드는 변수의 중복 선언이 불가능하고, 자바스크립트의 모든 블록을 따르는 블록 레벨 스코프를 갖습니다. const는 선언과 동시에 초기화 단계 수행되어야 하고 그렇지 않을 경우 문법 에러가 발생합니다. let과 동일하게 블록 레벨 스코프를 따르며 객체를..
var ES5까지 변수를 선언할 수 있는 유일한 방법은 var키워드를 사용하는 것이었다. var 사용 시 몇가지 주의할 점이 존재한다. - 변수 중복 선언 허용 var 키워드로 선언한 변수는 중복 선언이 가능하다. var x = 1; var y = 1; var x = 100; var y; console.log(x) // 100 console.log(y) // 1 - 함수 레벨 스코프 var 키워드로 선언한 변수는 오로지 함수 레벨 스코프를 따른다. 함수 외부에서 선안한 변수는 코드 블록 내에 선언하여도 모두 전역 변수가 된다. 따라서 의도치 않게 변수의 중복 선언이 발생할 수 있다. var x = 1; if (true) { var x = 10; // 함수 코드 블럭이 아니므로 변수의 중복 선언이 발생함 ..
기술 면접 질문 리스트 버츄얼 돔과 리얼 돔의 차이를 설명해주세요. useRef에 대해 설명해주세요. useEffect의 실행 순서에 대해 설명해주세요 1. 버츄얼 돔과 리얼 돔의 차이를 설명해주세요. 답변: 가상 돔은 브라우저의 실제 돔을 추상화한 것으로 자바스크립트 객체 형태로 메모리상에 저장됩니다. 리액트에서 상태 변화로 인해 렌더링이 발생하면 이전에 생성된 가상 돔과 렌더링 이후에 생성된 가상 돔을 비교 연산(Diffing)하여 실제 변경된 노드만을 실제 돔으로 한 번에 배치(batch) 업데이트 합니다. 이러한 과정을 재조정(reconciliation)이라 하며 reflow와 repaint과정은 브라우저의 성능을 저하시키는 가장 큰 원인으로 배치 업데이트를 통해 화면에 보여줄 컨텐츠를 한 번에 ..
기술 면접 질문 리스트 상태관리를 왜 할까요? 그리고 평소 state 관리는 어떻게 하시나요? Redux가 무엇인가요? 왜 Redux를 사용하시나요? Redux 말고 다른 전역 상태관리 라이브러리 아는 것 하나와 차이점을 설명해주세요 1. 상태관리를 왜 할까요? 그리고 평소 state 관리는 어떻게 하시나요? 답변: 상태관리는 컴포넌트의 불필요한 리렌더링을 방지하고 앱의 유지보수성을 높입니다. 리액트는 단방향 데이터 흐름을 가지고 있으므로 컴포넌트가 복잡해 질 경우, 상위 컴포넌트에서 하위 컴포넌트로 Props를 전달해야하는 Props Drilling이 발생하는데, 이는 중간 컴포넌트의 불필요한 리렌더링을 발생시켜 웹 성능을 저하시킵니다. 이처럼 애플리케이션의 규모가 커짐에 따라 상태관리가 복잡해지므로 ..