react4 리액트 훅, React - Hook (2) - LifeCycle (생명주기 1. LifeCycle (생명 주기)리액트는 컴포넌트를 기반으로 하여 수명 주기가 존재한다. 앱 전반에 걸쳐 우리의 눈에 페이지가 보이는 순간부터 페이지가 사라질 때 까지의 생명주기를 관리하는 방법을 공부해보았다. 1) 리액트의 라이프 사이클 크게 3 가지로 분류할 수 있다. - Mount 컴포넌트가 처음 탄생하는 순간이다. 마운트 되었다는 것은 처음 렌더링 되었다는 것을 말한다. - Update 컴포넌트가 리렌더링 되는 순간이다. - unMount 컴포넌트가 화면에서 사라지는 순간이다. 2) 라이프 사이클 제어 각 라이프 사이클 별로 컴포넌트가 다른 행동을 하도록 제어하는 것을 말한다. useEffect를 이용하여 제어할 수 있다. 2. useEffect 리액트 컴포넌트의 사이드 이.. 2025. 3. 27. 리액트 훅, React - Hook (1) - State (상태) 리액트 훅?Hook은 React 버전 16.8부터 React 요소로 새로 추가되었으며, Hook을 이용하여 기존 Class 바탕의 코드를 작성할 필요 없이 상태 값과 여러 React의 기능을 사용할 수 있다고 공식 홈페이지에 설명이 기재되어 있다. 클래스의 컴포넌트 기능들을 함수 컴포넌트에서도 이용할 수 있게 해준다. Hook의 조건 1. use 라는 키워드로 시작되며, 함수 컴포넌트 내부에서만 호출될 수 있다. 2. 함수 컴포넌트 내부에서만 사용될 수 있다. 3. 조건부로 호출되어서는 안된다. (조건문, 반복문 내부에서 호출 불가) 4. 함수 앞에 use라는 키워드를 붙여 Custom Hook을 만들 수 있다. 별도의 폴더로 만들어 관리하면 좋다. State Hook1. useStateimport .. 2025. 3. 26. 3월 3째주 기록 1. React1) JavaScript 기본 문법 + NodeJS + React 기초 한 입 크기로 잘라 먹는 리액트 강의 듣기 한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지 강의 | 이정환 Winterlood - 인프런이정환 Winterlood | , 리액트, 한 강의로 끝장낼 수 있어요.한 입 크기로 잘라먹을 수 있도록 도와드릴게요. 🔥 [임베딩 영상] [사진] 많은 수강생 여러분이 사랑해 주신 덕분에 인사이트 출판사와www.inflearn.com 2025. 3. 17. React + SpringBoot 첫 연동 React와 SpringBoot를 처음 시작하기 전, 간단한 연동을 진행해 보았다. 1. 간단한 스프링부트 프로젝트 만들기Spring Initializr 사이트에 초기 프로젝트를 만들어 줄 수 있다. https://start.spring.io/ 프로젝트 설정하기 Gradle, Java, 버전은 아무것도 안붙은 것(안정화 버전) Web 애플리케이션 통신을 위해 Spring Web은 꼭 포함시켜 주어야 한다. MVC 구조에 맞추어 Controller, Service, Repository 만들기 각각 서비스는 컨트롤러는 서비스에 의존, 레포지토리에 의존, 레포지토리는 엔티티를 포함하여 만들어 주었다.간단하게 설명하면 엔티티는 데이터 모델이고, 레포지토리는 모델을 가저오는 저장소, 서비스는 비즈니스 로직을.. 2025. 3. 15. 이전 1 다음 728x90 반응형
