전체 글 52

React 개념 정리 10일차 (useEffect)

React의 Hook 중 하나로, 함수형 컴포넌트에서 Side Effect(부수 효과)를 처리하기 위해 사용된다. React 컴포넌트가 렌더링된 이후 특정 작업을 수행하도록 설정할 수 있다.useEffect는 컴포넌트의 생명주기와 관련된 작업을 처리하기 위한 강력한 도구이다. 이를 통해 데이터 가져오기, 구독 설정, DOM 조작 등 다양한 Side Effect를 효율적으로 관리할 수 있다.// src/App.jsimport React, { useEffect } from "react";const App = () => { useEffect(() => { // 렌더링 후 실행된다. console.log("hello bro"); }); return Home;}export default App;App..

language/react 2025.01.07

React 개념 정리 8일차 (useState)

useState useState는 React의 내장 훅(Hook) 중 하나로, 함수형 컴포넌트에서 상태(state)를 추가하고 관리할 수 있도록 해준다. React는 기본적으로 함수형 컴포넌트가 상태를 가지지 않지만, useState를 사용하면 상태를 생성하고 업데이트할 수 있다. const [count, setCount] = useState(0);함수형 업데이트// 일반적인 업데이트 방식setState(number + 1);// 함수형 업데이트 setState(() => {});// 현재 number의 값을 가져와 +1을 더하여 반환setState((currentNumber)=>{ return currentNumber + 1 });위 코드와 같이 setState의 ( ) 안에 수정할 값이 아니라, 함수..

language/react 2025.01.07

React 개념 정리 8일차 (state)

state 개요 state란?State란 컴포넌트 내부에서 바뀔 수 있는 값을 의미import React, { useState } from 'react';function GrandFather() { const [name, setName] = useState("홍길동"); return ;}// .. 중략 useState 훅을 사용하는 방식const [ value, setValue ] = useState( 초기값 ); const 로 선언을 하고 [ ] 빈 배열 을 생성하고, 배열의 첫번째 자리에는 이 state의 이름, 그리고 두번째 자리에는 set 을 붙이고 state의 이름 붙임, useState( ) 의 인자에는 이 state의 원하는 처음값 을 넣어줌앞으로는 " 훅 " 이라고 표현하겠다.  us..

language/react 2025.01.07