면접 질문 복기

슬기로운 코딩생활·2021년 3월 25일
0

2021.03

목록 보기
2/3

SPA(Single page Application) : 1개의 페이지만 있는 애플리케이션으로 하나의 페이지에서
내용만 바꾸는 것.
서버로부터 새페이지를 불러오지 않고 현재 페이지를 동적으로 다시
작성하는 웹앱. 최초로 한 번. 페이지 전체를 로드한 후에는 데이터만
변경해서 쓸 수 있다. 구현방식에는 Ajax를 통한 콘텐츠 로드.
장점: 네이티브 앱을 쓰는 것 같은 좋은 사용자 경험, 속도향상,
배포가 간단하다.서버 요청이 적다, 트래픽 총량이 줄어든다.
단점: 초기 구동 속도가 느림, SEO 최적화에 약하다.-> 처음에
전해지는 웹페이지의 소스 코드 내부가 거의 비어있어서-> 검색이
잘 안될 수 있다. IE 8이하는 지원하지 않는다.

Ajax : 자바스크립트를 사용한 비동기 통신, 클라이언트와 서버간에 XML 데이터를 주고받는 기술.
Json이나 xml 형태로 필요한 데이터만 받아 갱신하기 때문에 그만큼의 자원과 시간을 아낄수 있다.
장점: 웹페이지의 속도 향상, 서버의 처리가 완료될 떄’까지 기다리지 않고 처리 가능, 서버에서 데이터만
전송하면 되므로 전체적인 코딩의 양이 줄어든다. 페이지 리로드 없이 수정할 수 있다.
단점: 히스토리 관리가 안된다. 연속으로 데이터를 요청하면 서버 부하가 증가,xmlhttprequest를 통해
하는 경우 사용자에세 아무런 진행 정보가 주어지지 않는다. 그래서 아직 요청이 완료되지 않았는데
사용자가 페이지를 떠나거나 오작동할 우려가 있다.

xmlHttpRequest : 서버로부터 데이터를 받아오기 위해 사용하는 객체.
통신방식: open(),send()

CSR(Client Side Rendering) : 필요한 부분만 렌더링하며 새로고침이 없고 변하는 부분만 새로 그리는 것.
URL이 바뀌지 않기에 히스토리 관리가 어려워질 수 있다. 특히 ajax 같은
경우 히스토리가 없어서 사용자 폼 데이터를 전송한 페이지를 북마크 해도
다음에 재접속했을때 그페이지가 아니라 초기 페이지를 보게 된다.

Hash : URL은 똑같고 URI의 차이가 생겨서 히스토리 관리가 가능해진다. 변경해도 서버에 페이지가 갱신되지
않는다. URI에서 #로 시작하는 문자열.URI는 자원을 식별할 수 있는 문자열이며 가장 큰 개념이다.

MPA(Multi Page Application) : SPA의 반대개념으로 서버로부터 리소스들을 받아 렌더링 하는 방식.
서버로부터 form데이터를 전달해서 새로운 페이지 렌더링을 요청한다.
다른 페이지로 넘어갈 떄 URL도 바뀌고 서버로 들어가는 요청에 응답으로
HTML 파일을 건네서 완전히 새로운 페이지로 넘어가는 것.
여러개의 카테고리가 필요하면 적합하다.
단점: html 파일을 건네면 굳이 다시 그리지 않아도 되는 것까지 전달하게
되서 트래픽이 늘어나기 때문에 부담이 생기고 느려진다.

SSR(Server Side Rendering) : 서버가 해당하는 html을 주는 방식.

PostCss : CSS문접을 강화하는 플러그인들을 의미. 단순히 플러그인 개발도구만을 제공한다.
장점: CSS 표준문법 사용,자바스크립트 기반
단점: Sass의 함수나 for문같이 강력한 문법을 제공하지 않는다. Sass에 비해 덜 유명하다.

React-Router : 페이지를 새로 불러오지 않는 상황에서 각각의 선택에 따라서 선택된 데이터를 하나의
페이지에서 렌더링 해주는 라이브러리.

웹팩 : 여러개의 파일을 하나로 묶어주는 개발 자동화 도구. 파일을 묶는 과정에서 여러가지 작업들이 실행하도록
작업계획을 세워주기도 한다. Sass,typescript,jsx와 같은 언어들을 네이티브 언어로 컴파일 해주거나,
개발 중에 파일이 수정되었을 때 자동으로 브라우저의 내용을 리로드 해주는 등의 작업도 할 수 있다.

API : 애플리케이션 프로그래밍 인터페이스의 약자. 라이브러리나 프레임 워크에서 우리가 이용할 수 있는
클래스나 함수.

리액트 라우터 돔에서의 두가지 라우터

해쉬라우터 : URL Hash를 사용하며 지원되는 브라우저나 웹서버에 제한이 없다. 주소에 해쉬가 붙게 된다.
URL해시를 서버에서 읽을 수 없기 때문에 서버사이드렌더링으로 설정을 백업할 수는 없다.
히스토리 지원X.검색엔진이 읽지 못하나다.

브라우저라우터 : 링크컴포넌트로 to속성에 이동할 경로를 써준다. Route 컴포넌트 path 속성을
Link의 to속성을 component mapping 경로를 기술한다. 새로고침하면 경로에서 못 찾아
에러가 난다. 대부분 레거시 브라우저(IE9이하)에서는 사용할 수 없다.
History API를 사용해야 한다.

0개의 댓글