쿠쿠더님의 블로그

생명주기 CRA의 디렉토리 구조리액트의 함수형 컨포넌트 아토믹 패턴의 모든것. 커스텀 훅이란? React hook Context , Memo 란? React Router, useReducer React 전역상태란? React thunktancstack Query 란? 생명주기란 ? 리액트의 생명주기(Lifecycle)는 컴포넌트가 생성되고 업데이트되며 제거되는 일련의 과정을 의미한다. 클래스형 컴포넌트에서 주로 사용되며, 함수형 컴포넌트에서는 useEffect 훅을 통해 생명주기와 유사한 기능을 구현할 수 있다.1. 마운트(Mount)컴포넌트가 처음 DOM에 삽입될 때 실행된다.constructor() : 컴포넌트 초기화 (state 설정 등)render() : JSX를 반환해 UI를 구성compone..

Babel ES6의 등장공백기 webpack의 동작 Babel - 최신문법으로 개발을 하면서 코드 생산성을 높이고 그 문법을 ES5로 변환해서 사용하였습니다.- 공백기가 있었기때문에 과도기 기술이 너무 빠르게 발전해서 런타임환경에서 완벽하게 제공 불가 Babel의 목적 - 트랜스파일 즉 코드의 문법을 변환하는게 목적이다. babel의 환경 설정 변환 작업을 할때 원하는 형태로 파일을 변환하기 위해서 설정값이 필요하다. babelrc 실행할떄 필요한 설정 파일 babel 속성값을 정의하는 파일 ES6 등장 - 자바스크립트는 표준이 2015년 6월 많은 내용이 업데이트 되었다. - let const 화살표 함수 클래스 등등 개발자의 코드의 생산성과 유지보수성이 증가 하게 되었다. - 자바스크립트의 ..

React 란?React의 필요성React의 특징 React 란 1.웹 프레임워크로, 자바스크립트 라이브러리의 하나로서 사용자 인터페이스를 만들기 위해 사용된다.2. facebook에서 제공해주는 프론트엔드 라이브러리라고 볼 수 있습니다.3. 싱글 페이지 애플리케이션이나 모바일 애플리케이션의 개발 시 토대로 사용될 수 있습니다. React의 필요성 -react를 사용하지 않아도, html과 css , javascript를 이용해서 웹 페이지를 만들 수 있지만, react를 이용해 사용자와 상호작용할 수 있는 동적인 UI를 쉽게 만들 수 있기 떄문에 많이 이용되는 것 같다. React의 특징 1. Data Flow : 한 방향으로만 흐르는 단방향 데이터 흐름을 가진다. 2. Component 기반 구조 ..