React

📌 생명주기 메서드가 실행되는 시점마운트(mount)컴포넌트가 마운팅(생성)되는 시점업데이트(update) 이미 생성된 컴포넌트의 내용이 변경(업데이트)되는 시점언마운트(unmount) 컴포넌트가 더 이상 존재하지 않는 시점    📌 생명주기 메서드render()컴포넌트를 렌더링하는 메서드 컴포넌트가 UI 를 렌더링하기 위해서 쓰인다.render() 함수는 항상 순수해야 하며 부수 효과가 없어야 한다. this.setState 를 호출해서는 안된다. componentDidMount()컴포넌트가 마운트되고 난 후 호출되는 메서드this.setState()로 state 값을 변경하는 것이 가능하다.(다만, 일반적으론 state를 다루는 것은 생성자에서 하는 것이 좋다.)state가 변경되고, 그리고 그 ..

📌 React HooksuseInputuseTabsuseTitleuseClickuseConfirm & usePreventLeaveuseBeforeLeaveuseFadeln & useNetworkuseScroll & useFullscreenuseNotificationuseAxios💡Nomad Coders 에서 진행한 총 10가지의 custom hooks 에 대한 정리 모음집입니다.  들어가기에 앞서, useState 와 useEffect에 대해 알아보자📌 useState함수형 컴포넌트 내부에서 상태를 정의하고, 이 상태를 관리할 수 있게 해주는 훅이다. 넘겨진 인수가 없는 경우 초기값은 undefined 다. const[state, setState] = useState(initialState) 에서 ..

🚨상황npm ERR! code ENOENTnpm ERR! syscall opennpm ERR! path C:\Users\User\OneDrive\바탕 화면\Study_React\package.jsonnpm ERR! errno -4058npm ERR! enoent Could not read package.json: Error: ENOENT: no such file or directory, open 'C:\Users\User\OneDrive\바탕 화면\Study_React\package.json'npm ERR! enoent This is related to npm not being able to find a file.npm ERR! enoent 원인 npm start의 폴더 대상 문제 > start하는 경..

📌2.6 JSXJSX 란? 문자열도, HTML도 아닌 JavaScript 를 확장한 문법입니다. React에서 JSX 사용이 필수가 아니지만, 대부분의 사람들은 JavaScript 코드 안에서 UI 관련 작업을 할 때 시각적으로 도움이 된다고 생각하여 사용이 됩니다.   예시 보기const element = ( Hello, world! );const element = React.createElement( 'h1', {className: 'greeting'}, 'Hello, world!');두 예시는 동일한 기능을 합니다. 다만, 위의 예시는 JSX를 통해 표현을 했고 밑의 예시는 React.createElement() 문법을 사용하여 표현하였습니다.   Babel 이란? ES6 및 JS..