project 1 [카운터] 앱 만들기 프로젝트 준비하기 [카운터] 앱 프로젝트 진행 숫자를 더하고 빼는 기능을 구현 요구사항 분석하기 3개의 컴포넌트의 역할 App컴포넌트 : Viewer과 Controller 컴포넌트를 감싸는 템플릿 Viewer 컴포넌트 : 현재의 카운트를 표시함 Controller 컴포넌트 : 카운트를 제어할 수 있는 기능 제공 리액트 앱 만들기 7week > project1 생성 npx create-react-app . 명령어 입력 src 폴더에서 파일 삭제 src/App.test.js src/logo.svg src/reportWebVitals.js src/setupTest.js index.js 수정하기기 import React from 'react'; import ReactDOM..

23-24/React.js 3 2023. 11. 17. 10:00

INDEX 7장 컴포넌트의 라이프사이클 메서드 1. 라이프사이클 메서드의 이해 ● 개념 2. 라이프사이클 메서드 살펴보기 2.1 render() 함수 2.2 constructor 메서드 2.3 getDerivedStateFromProps 메서드 2.4 componentDidMount 메서드 2.5 shouldComponentUpdate 메서드 2.6 getSnapshotBeforeUpdate 메서드 2.7 comoponentDidUpdate 메서드 2.8 componentWillUnmount 메서드 2.9 componentDidCatch 메서드 3. 라이프사이클 메서드 사용하기 3.1 예제 컴포넌트 생성 3.2 App 컴포넌트에서 예제 컴포넌트 사용 3.3 에러 잡아내기 4. 정리 ● 정리 5. Ques..

21-22/21-22 리액트 스타터 -2 2021. 12. 27. 13:00

1. 라이프사이클 메서드의 이해 1) 라이프 사이클 메서드의 종류(9가지)> Will 접두사가 붙은 메서드 : 어떤 작업을 작동하기 전에 실행되는 메서드 Did 접두사가 붙은 메서드 : 어떤 작업을 작동한 후에 실행되는 메서드 2) 라이프 사이클의 종류 마운트 : 페이지에 컴포넌트가 나타남 업데이트 : 컴포넌트 정보를 업데이트 언마운트 : 페이지에서 컴포넌트가 사라짐 (1) 마운트 DOM이 생성되고 웹 브라우저상에 나타나는 것을 마운트(mount)라고 한다. (2) 업데이트 컴포넌트가 업데이트하는 경우들 props가 바뀔 때 state가 바뀔 때 부모 컴포넌트가 리렌더링될 때 this.forceUpdate로 강제로 렌더링을 트리거할 때 (3) 언마운트 컴포넌트를 DOM에서 제거하는 것을 언마운트(unmo..

21-22/21-22 리액트 마스터 2021. 11. 8. 15:00