[React] 기술 면접 대비 리액트 용어 모음

1. SPA (Single-page application)
   • 하나의 HTML 페이지와 애플리케이션 실행에 필요한 JS, CSS 같은 모든 자산을 로드하는 애플리케이션
   • 후속 페이지의 상호작용은 서버로부터 새로운 페이지를 불러오지 않으므로 페이지가 다시 로드 되지 않음
2. ES6, ES2015, ES2016 등등
   • ECMAScript 언어 명세의 최신 버전을 나타내며, JavaScript는 이를 구현한 것
   • ES6 버전에는 화살표 함수, class,템플릿 리터럴, let const 같은 추가 사항 있음
3. 컴파일러
   • 자바스크립트 컴파일러는 코드를 변환하고 다른 형식으로 코드를 반환함.
   • 일반적으로 es6 문법을 구형 브라우저에서도 동작하도록 변환
   • Babel은 리액트와 함께 널리 사용되는 컴파일러
4. 번들러
   • 분리된 자바스크립트와 css 모듈 코드를 브라우저에 최적화 된 여러 개의 파일로 결합
   • 리액트에서 널리 사용되는 번들러는 webpack, Browserify가 있음
5. 패키지 관리자
   • 프로젝트의 종속성을 관리 할 수 있는 도구
   • npm , yarn 이 자주 사용 되는 패키지
6. CDN
   • Content Delivery Network의 약자
   • 전 세계의 서버 네트워크에서 캐시 된 정적 콘텐츠를 제공
7. JSX
   • 자바스크립트의 확장 문법
   • JSX는 React.createElement() 의 호출을 통해 일반 자바스크립트 객체인 React 엘리먼트로 컴파일 됨
8. 엘리먼트
   • 리액트 애플리케이션을 구성하는 블록
   • 화면에 보이는 것들을 기술하며, 리액트 엘리먼트는 변경 되지 않음 
   • 직접 사용되지 않고 컴포넌트로부터 반환 됨
9. 컴포넌트
   • 페이지에 렌더링 할 리액트 엘리먼트를 반환하는 작고 재사용 가능한 코드 조각
   • 기능별로 나눌 수 있으며, 다른 컴포넌트 안에서 사용 가능
   • 항상 대문자로 이름을 시작해야 함 <Wraper>
10. props
    • 컴포넌트의 입력 값
    • 부모 컴포넌트로부터 자식 컴포넌트로 전달 된 데이터
    • 읽기 전용이므로 수정 x
    • 수정 필요할 시 state 사용
11. props.children
    • 모든 컴포넌트에서 props.children 사용 가능
    • 컴포넌트의 여는 태그와 닫는 태그 사이으 ㅣ내용을 포함

<Welcome>Hello world!</Welcome>
//Hello world! 문자열은 Welcome 컴포넌트의 props.children으로 사용할 수 있습니다.

12. state

• 컴포넌트와 관련된 데이터가 시간에 따라 변경 될 경우 state가 필요
• state와 props의 가장 중요한 차이점은 props는 부모 컴포넌트로부터 전달받지만, state는 컴포넌트에서 관리된다는 것입니다. 컴포넌트는 props를 변경할 수 없지만, state는 변경할 수 있습니다.

13. 생명주기 메서드

• 컴포넌트 각 단계에서 실행되는 커스텀 기능
• mounting(컴포넌트가 만들어지고 DOM에 삽입 될 때), willUpdate unmounted

14. Key

• 엘리먼트의 배열을 만들 때 포함해야 하는 특별한 문자
• 안정적으로 식별 할 수 있도록 배열 내의 엘리먼트에 key 제공(고유값)
• Math.rander() 같은 값을 키로 사용 x. 키는 다시 렌더링 하는 과정 동안 안정적으로 식별 되어야 함.(diff알고리즘,재정의)

15. Ref

• 리액트는 컴포넌트에 접근 할 수 있는 특수한 어트리뷰터를 지원
• React.createRef() 함수,콜백함수, 문자열로 생성 가능

16. 재조정

• 컴포넌트의 state나 props가 변경되면 리액트는 새로 반환 된 컴포넌트를 이전 렌더링 된 컴포넌트와 비교하여 실제 DOM을 업뎃 할 지 결정.
• 두 컴포넌트가 다르다면 DOM을 업데이트 함.
• 이러한 과정을 재조정 (Reconciliation) 이라고 함.

https://ko.legacy.reactjs.org/docs/glossary.html