React 2

React Hook

React를 공부하면서 알게된 기능을 간단하게 정리해본다. 이후 상세하게 파고들어봐야겠다. React가 지원하는 Hook 상태 관리를 위한 useState()value에 해당하는 값을 관리할 수 있고 setter를 호출하여 value의 값을 변한다.이때 value에 객체를 선언하여 전체적으로 변경할 수도 있다. import {useState} from 'react'; const [value , setter] = useState({초기화 값}); 조건부 이벤트핸들러 역할의 useEffect()useEffect는 렌더링 이후에 실행되고, 특정 조건을 만족하면 호출하여 실행하도록 설계한다.import React, { useEffect } from 'react';useEffect(()=>{ if(p..

React 2024.05.23

리액트 LifeCycle API

리액트에는 요소의 라이프사이클에 따라 사용할 수 있도록 LifeCycle API를 제공한다.해당 API를 통해 부모 자식관계의 요소들 사이에서 state와 props를 관리를 수월하게 해 준다. 나는 Spring 백엔드를 근간에 두고 있어 SpringFramwork에 비유하면서 공부하여 보았다.스프링에도 라이프사이클에 의해 관리되도록 하는 어노테이션들이 있다. 리액트도 매우 비슷한 기능을 하는 API들을 만들어 놓은 것으로 이해되었다. SpringBoot에서 라이프사이클에 해당하는 기능들Bean Life Cylce에 해당하는더보기@PostConstruct@PreDestroy Bean의 생명주기와는 관련 있진 않지만 엔티티의 생명주기에 대응하도록 만들어진더보기@PostPersist@PostUpdate@Pr..

React 2024.05.14