# render
Using the Effect Hook
Hooks는 Class없이 상태를 관리할 수 있도록 도와준다.Effect hooks는 함수형 컴포넌트 내부에서 side effect를 실행하도록 도와줍니다.대표적인 "side effect"의 예시로 Data fetching, setting up a subscripti

[Error] ReactDOM.render는 React18에서 지원되지 않습니다.
npx를 이용해 React 앱을 만든 뒤 index.js에서 ReactDOM.render()를 실행했을때 다음과 같은 경고 메세지가 콘솔창에 뜨는 것을 발견.Warning: ReactDOM.render is no longer supported in React 18. U
Returns and Renders
이제 진짜 database에서 비디오를 검색할수 있게 되었다.전 파트에서 async,await와 callback의 차이를 배웠다.아직 callback의 작동 원리가 헷갈릴 수도 있다. javascript와 return에 대해 조금만 알아도 return 부분에서 아무 기

렌더링/리렌더링
우선 렌더링을 알아보자. 렌더링이란 사용자 화면에 내용을 보여 주는 것이다.초기 렌더링이란 어떠한 UI 관련 프레임워크, 라이브러리를 사용하든지 간에 맨 처음 사용자 화면에 뷰를 보여주는 것을 초기 렌더링이라고 한다. 리액트에서는 렌더링을 다루는 render함수가 있다

중요 렌더링 경로 최적화
중요 렌더링 경로 Critical Rendering Path 주요 렌더링 경로란 DOM 파싱 부터 렌더까지의 경로를 말한다. > 주
렌더링 최적화
아래 내용은 노마드코더님의 강의에서 배운 내용을 기반으로 작성하였습니다.어떤 함수의 State가 변경된다면 그 함수는 re-render가 될 것입니다. 여기까지는 당연하다고 생각할 수 있지만, 부모 컨포넌트의 state가 수정된다면 바뀔 필요가 없는 자식 컴포넌트까지

React - useEffect()
어떤 함수가 input / output이외의 다른 값을 조작한다면, 이 함수는Side Effect가 있다고 표현합니다!함수컴포넌트에서는 외부세계에 영향을 주는 어떠한 행위입니다.대표적으로 Data Fetching, DOM에 직접 접근(ex. Event Listener

[react] 이벤트 state, props, render함수
state에 mode를 추가한다.welcome 속성을 만들어준다.App.js)render함수 안, return 전에 if문 조건문으로state.mode가 'welcome'일때 welcome 속성을 가져오고state.mode가 'read'일때는 contents의 첫번째
[React] 폴더구조 & 컴포넌트
React 엘리먼트를 container DOM에 렌더링하고 컴포넌트에 대한 참조를 반환합니다(무상태 컴포넌트는 null을 반환합니다).App이라는 컴포넌트를 render()를 통해 아래의 코드 <div id="root"></div> 에 넣어줍니다. React

[React #7] Component Lifecycle(생애주기) Methods
Component Lifecycle React components는 create, render, DOM에 추가, 업데이트, 삭제될 수 있다. 이 스텝들이 컴포넌트의 생명주기(lifecycle)라고 한다. Mounting : 컴포넌트가 초기화되고 DOM에 놓이는 첫 순

TIL- React Intro
React 배경지식 왜 리액트를 사용 하는가? 웹 어플리케이션의 발전 정적인 1세대 웹에서(html , css, 자바스크립트, 돔, 이벤트) 동적인 2세대의 웹(제이쿼리- 메서드 모음) 으로 발전하면서 3세대 웹 (프론트앤드 프레임워크 & 라이브러리) 리액트,앵귤러,뷰

render 함수
어떤 UI 관련 프레임워크, 라이브러리를 사용하든지 간에 가장 처음 어떻게 보일지를 정하는 초기 렌더링이 필요하다. React에는 render 함수라는 것이 있다.render() {...}이 render함수는 컴포넌트가 어떻게 생겼는지 정의하는 역할을 하는데 html

[react] 노마드코더 영화웹서비스 제작 3.2 컴포넌트의 생명주기 메서드
react component에서 사용하는 유일한 function은 render function이지만, 그외에도 많은 것들을 가지고 있다.life cycle method라는 것들을 가지는데, 리액트가 컴포넌트를 생성하고 없애는 방법이다.component가 생성될 때,re
[TIL] render
renderrender(request, template_name, context=none, content_type=none, status=none, using=none)render는 위와 같은 parameter를 가진다이 중 request와 template_name은
django render vs redirect
코딩하다가 이런 경우를 마주침menu app 에서 메인으로 돌아가려고 아래와 같이 쓰는데위와 같이 사용하면 메인 페이지로 돌아가고 나서, 주소에 /menu 이런식으로 url 이 남아있음www.examplepage.com/menu이런식으로.여기서 window.locati