반응형

React기초 2

useEffect 라이프사이클 개념부터 실전 예제

React를 처음 배우면서 가장 많이 마주치는 훅 중 하나가 바로 **useEffect**입니다.하지만 초보자 분들에게는 “언제 실행되는지?”, “언제 멈추는지?” 헷갈리기 쉬운 개념이죠.이번 포스팅에서는 useEffect의 동작 원리와 사용법,그리고 클래스 컴포넌트의 라이프사이클 메서드와의 비교까지 알아보겠습니다.✅ 1. useEffect란?컴포넌트가 렌더링된 이후 특정 작업(=Effect)을 수행할 수 있도록 하는 React Hook입니다. 예:API 호출이벤트 리스너 등록타이머 설정외부 상태 동기화 등📌 기본 문법 useEffect(() => { // 실행할 코드}, [의존성 배열]);✅ 2. useEffect 실행 시점 정리 의존성 배열 실행 시점 없음항상 실행 (렌더링마다)빈 배열 []처음..

React, Vue 2025.12.31

JSON이 뭐고, React에서는 왜 자꾸 쓰는 걸까?

React를 공부하다 보면 fetch로 JSON 데이터를 가져온다, props로 JSON 넘긴다 이런 말들을 자주 보게 됩니다.처음엔 “그 JSON이라는 게 도대체 뭐지?” 하고 막막하셨을 거예요.이번 포스팅에서는 JSON이 뭔지, 왜 React에서 자주 쓰이는지, 그리고 실제로 어떻게 사용하는지 예제를 통해 하나씩 살펴보겠습니다.✅ JSON이란?**JSON(JavaScript Object Notation)**은 데이터를 주고받을 때 사용하는 가벼운 텍스트 형식입니다.간단하게 말하면, 정보를 담기 위한 약속된 문장 구조예요.{ "name": "홍길동", "age": 28, "isStudent": false} 위처럼 중괄호 {} 안에 "key": value 쌍으로 이루어진 데이터 구조를 JSON이라고..

React, Vue 2025.05.23
반응형