목록React (3)
Live Today
✔️ React의 개념과 장점을 말해보세요. React는 UI 구축을 위한 자바스크립트 프론트엔드 라이브러리입니다. 장점 : Virtual DOM을 사용해서 어플리케이션의 성능을 향상시킵니다. 서버, 클라이언트 사이드 렌더링을 지원합니다. 컴포넌트의 가독성이 높고 간단하여 유지보수가 쉽습니다. 다른 프레임워크와 혼용이 가능합니다. ✔️ React를 사용하는 이유에 대해 말해보세요. 동적인 웹페이지를 효율적으로 유지 보수하고 관리하기 위함 웹 어플리케이션에 동적인 변화가 많이 일어난다면 그만큼 DOM 요소들 또한 변화가 이루어져야 한다는 것과 같다. DOM 요소들이 변화한다는 것은 브라우저의 렌더링 과정이 다시 이루어져야한다는 것이므로 매번 렌더링이 일어난다면 성능이 저하된다. 이를 해결하기 위해 여러 프..
React 프로젝트 만들기 1. Node.js 설치 2. npm 또는 yarn 설치 3. Visual Studio Code 설치 4. create-react-app으로 프로젝트 만들기 1. Node.js 설치 https://nodejs.org/ko/download/ 다운로드 | Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org LTS 버전 설치 2. npm과 yarn 차이 Node.js를 설치하면 Node.js 패키지 매니저 도구인 npm이 설치된다. npm으로 수많은 개발자가 만든 패키지를 설치하고 설치한 패키지의 버전을 관리할 수 있다. 리액트 역시 하나의 패키지이다. yarn은 npm을..

1-1. 리액트 이해 리액트는 자바스크립트 라이브러리 구조가 MVC, MVW 등인 프레임워크와 달리, 오직 V(View)만 신경 쓰는 라이브러리 컴포넌트 : 리액트 내 특정 부분이 어떻게 생길지 정하는 선언체 컴포넌트는 재사용이 가능한 API로 수많은 기능들을 내장 컴포넌트 하나에서 컴포넌트의 생김새와 작동 방식 정의 사용자 화면에 뷰를 보여주는 것을 렌더링이라고 함. 1-2. 초기 렌더링 render함수 → render() { . . .} 컴포넌트가 어떻게 생겼는지 정의하는 역할을 함. 객체 반환 컴포넌트 내부에 또 다른 컴포넌트들이 들어갈 수 있다. 이때 render 함수를 실행하면 그 내부에 있는 컴포넌트들도 재귀적으로 렌더링함. 최상위 컴포넌트의 렌더링 작업이 끝나면, HTML 마크업을 만들고, ..