반응형

useEffect 2

🚀 4단계: React Router, API 연동(Fetch/Axios) 배우기

✅ 1️⃣ React Router란?✅ 2️⃣ React Router를 사용한 페이지 이동 구현✅ 3️⃣ API 연동 개념 (fetch, axios)✅ 4️⃣ 실습 프로젝트: React Router + API 연동1️⃣ React Router란?🔹 React Router의 역할React는 **싱글 페이지 애플리케이션(SPA)**으로, URL이 변경되어도 전체 페이지를 새로고침하지 않음react-router-dom을 사용하면 컴포넌트 기반으로 페이지 이동 가능🔹 React Router 설치하기📌 터미널에서 실행npm install react-router-dom2️⃣ React Router를 사용한 페이지 이동 구현🔹 기본적인 라우팅 설정📌 예제 코드 (App.js)import { BrowserRo..

React 2025.02.19

🚀 3단계: React 실습 프로젝트 진행하며 개념 정리

✅ 1️⃣ React 실습 프로젝트 추천✅ 2️⃣ 프로젝트별 주요 개념 정리 (useState, useEffect, React Router, API 연동, Redux)✅ 3️⃣ 프로젝트 개발 단계 및 학습 전략1️⃣ React 실습 프로젝트 추천실제 프로젝트를 만들어 보면 React의 개념이 더 쉽게 이해될 거야!아래 3가지 추천 프로젝트를 따라 하면서 개념을 정리해보자.📌 1. Todo List (기본 개념 연습: useState, props)주요 기능: 할 일 추가, 삭제, 체크사용 개념: useState로 상태 관리, props로 컴포넌트 간 데이터 전달📌 예제 코드 (useState 활용)import { useState } from "react";function TodoApp() { cons..

React 2025.02.18
반응형