React & Next.js에서 대규모 상태 관리

Name: React & Next.js에서 대규모 상태 관리
Rating: 3 (2 reviews)

확장 가능한 상태 관리 패턴과 도구를 마스터하여 고성능의 엔터프라이즈급 애플리케이션을 구축하세요.

(3.0) 수강평 2개

수강생 176명

Professional

react

리액트감잡기

next.js

tailwindcss

typescript

React Native Next.js TailwindCSS TypeScript

수강 후 이런걸 얻을 수 있어요

React와 Next.js 애플리케이션에서 확장 가능한 상태 관리 전략을 설계하고 구현하는 방법.
로컬, 글로벌, 서버 사이드 상태의 차이점과 각각을 효과적으로 사용하는 시점.
Redux, Zustand, Jotai, React Query와 같은 상태 관리 라이브러리에 대한 실무 경험.

이 강의에서 학생들이 배울 내용

현대 React와 Next.js 애플리케이션에서 상태 관리의 핵심 과제를 이해하세요.
로컬, 글로벌, 서버 사이드 상태를 구분하고, 각각을 언제 사용해야 하는지 알아야 합니다.
Redux Toolkit, Zustand, Jotai, React Query와 같은 인기 있는 상태 관리 라이브러리들을 탐구해보세요. React Native, Next.js, next.js, TailwindCSS, TypeScript
확장 가능한 폴더 구조와 아키텍처 패턴을 설정하는 방법을 배워 엔터프라이즈급 애플리케이션을 구축하세요.
비동기 데이터 관리를 위한 마스터 기법들을 익혀보세요. API 호출, 캐싱, 그리고 컴포넌트 간 동기화를 포함합니다.
Next.js에서 적절한 상태 하이드레이션과 함께 서버 사이드 렌더링(SSR)과 정적 사이트 생성(SSG)을 구현하세요.
불필요한 리렌더링을 줄이고 React의 내장 최적화 훅을 활용하여 애플리케이션 성능을 최적화하세요.
실제 프로젝트 구축을 통해 여러 계층의 상태와 데이터 소스를 다루는 실무 경험을 쌓아보세요.
대규모 코드베이스에서 상태 로직을 디버깅, 테스트, 유지보수하는 모범 사례를 배워보세요.
팀과 애플리케이션 확장을 위한 전략을 발견하고, 유지보수성과 깔끔한 관심사 분리를 보장하세요.

이런 분들께
추천드려요

학습 대상은
누구일까요?

학생들은 React 기초 사항(컴포넌트, props, hooks, context)에 대한 기본적인 이해가 있어야 합니다.
Next.js의 라우팅, 서버 사이드 렌더링(SSR), API 라우트와 같은 기본 사항에 대한 지식이 도움이 될 것입니다.
JavaScript ES6+ 개념(화살표 함수, async/await, 모듈)에 대한 사전 지식이 권장됩니다.

안녕하세요
입니다.

I’m an experienced instructor with a strong background in web development, business strategy, and career management. I’ve helped individuals and companies build successful websites, launch and grow businesses, and navigate their professional paths with confidence. My approach combines real-world experience with practical teaching, offering learners the tools and strategies they need to achieve their goals — whether starting a business, building a digital presence, or advancing their careers.

커리큘럼

전체

3개 ∙ (13분)

섹션 1. 섹션 1

3개 ∙ (13분)

1. 소개
04:17
2. REACT
04:45
3. 리액트 그리고 더 많은 것들
04:45

강의 게시일:

마지막 업데이트일:

수강평

전체

2개

3.0

2개의 수강평

Jang Jaehoon
수강평 609
∙
평균 평점 4.9
5
100% 수강 후 작성
좋은 강의 감사합니다!
무지55
수강평 6
∙
평균 평점 4.3
1
100% 수강 후 작성
이거 사기임 react 상태관리인 줄 알고 봤더니 쿼리다루고있음

비슷한 강의

같은 분야의 다른 강의를 만나보세요!

Next.js 시작하기

장기효(캡틴판교)

React를 시작할 때 꼭 알아야 하는 Next.js 프레임워크. 입문자 관점의 쉬운 설명과 실무자가 만족하는 심도 깊은 동작 원리 이해까지. Next.js를 한방에 해결합니다.

초급

Next.js, React, JavaScript

Next.js 시작하기

장기효(캡틴판교)

AI와 함께 배우는 Next.js

장기효(캡틴판교)

복잡한 Next.js의 여러 개념들을 짧은 시간에 핵심만 배울 수 있어요. Next.js를 처음 배우는 분들을 위한 실무 필수 지식만 알려드립니다. 프레임워크 강의만 8년째 진행하는 캡틴판교의 Next.js 신규 강의. "AI 시대에 프런트엔드 개발자"의 코딩과 학습 방법을 배워볼 수 있어요! :)

입문

JavaScript, React, Next.js

AI와 함께 배우는 Next.js

장기효(캡틴판교)

누구보다 빠르게 배우는 Springboot + NextJS RestAPI 게시판 만들기

Neo

누구보다 빠르게 배우는 Springboot + NextJS RestAPI 게시판 만들기 Springboot 로 CRUD 서버를 개발하고 NextJS로 나만의 게시판을 만들어보세요!

입문

Kotlin, Spring Boot, Next.js

누구보다 빠르게 배우는 Springboot + NextJS RestAPI 게시판 만들기

Neo

기초부터 배우는 Next YTMusic 클론 코딩 (with next.js 14, UI 마스터)

도도(코딩루팡)

React, Next.JS 14, TailwindCss, RadixUI, Shadcn, zustand 으로 YoutubeMusic 웹사이트를 클론합니다. NextJS 기초부터 UI 중점으로 웹프론트 기초를 마스터 할 수 있어요.!

초급

Next.js, React, TailwindCSS

기초부터 배우는 Next YTMusic 클론 코딩 (with next.js 14, UI 마스터)

도도(코딩루팡)

iOS/Android 앱 개발을 위한 실전 React Native - Basic

Wintho

Mobile App Front-End 개발을 위한 React Native의 기초 지식 습득을 목표로 하고 있습니다. 진입장벽이 낮은 언어/API의 활용을 통해 비전문가도 쉽게 Native Mobile App을 개발할 수 있도록 제작된 강의입니다.

초급

React Native, React, ES6

iOS/Android 앱 개발을 위한 실전 React Native - Basic

Wintho

Complete Full-Stack Python Developer Roadmap: Learn FastAPI, React, Database Design API Architecture

IT s Dev

A Complete End-to-End Developer Journey — Build Lightning-Fast APIs, Modern Frontend Interfaces, Real Projects, Authentication Systems, Dashboards & Full Deployments Using FastAPI, React, and Vibe Coding Techniques.

입문

React, React Native, react.js

Complete Full-Stack Python Developer Roadmap: Learn FastAPI, React, Database Design API Architecture

IT s Dev

누구보다 빠르게 배우는 풀스택 게시판 만들기

Neo

이 강의에 서버(Java+Springboot) 와 프론트(React, ReactNative, Flutter, Android, iOS)를 모두 담았습니다. 이 강의로 풀스택 게시판 만드는 경험을 진행해보세요

입문

React, React Native, iOS

누구보다 빠르게 배우는 풀스택 게시판 만들기

Neo

Firebase 시리즈 #2: AI 한자 추천 & 필기 학습 플랫폼

닭강정

🔥 한자 학습을 위한 맞춤형 플랫폼 구축! Google Gemini AI와 Firestore를 활용해 나만의 한자 단어장, 획순 애니메이션, 필기 인식까지 직접 구현해보세요!

초급

gemini, HTML/CSS, TailwindCSS

Firebase 시리즈 #2: AI 한자 추천 & 필기 학습 플랫폼

닭강정

Tailwind CSS 실전 포트폴리오 퍼블리싱

코딩웍스(Coding Works)

[Tailwind CSS 실전 포트폴리오 퍼블리싱]은 Tailwind CSS를 활용해 26가지 이상의 다양한 실전 예제 제작하는 과정입니다. 실전 예제를 빠르게 다양하게 제작하면 그 속에서 필수적인 이론을 설명합니다. 해당 강의는 개발자와 퍼블리셔가 만드는 Tailwind CSS 스타일링을 중심으로 제작되었습니다.

초급

TailwindCSS, HTML/CSS

Tailwind CSS 실전 포트폴리오 퍼블리싱

코딩웍스(Coding Works)

바닐라 자바스크립트 & Tailwind CSS

Michael Kwon

AI 활용과 컴포넌트 중심 UI 제작으로 배우는 실무형 웹 UI 개발, 디자이너+개발자 필수 코스!

초급

JavaScript, vanilla-javascript, frontend

바닐라 자바스크립트 & Tailwind CSS

Michael Kwon

아바타 커뮤니티앱 만들기 (React Native Expo)

Kyo

리액트 네이티브로 아바타 기반 커뮤니티앱을 개발합니다. 글작성 뿐만아니라 댓글/대댓글, 좋아요, 투표, 아바타 생성 등 완성도 있는 커뮤니티앱을 만드는 과정을 배우게 됩니다.

초급

React Native, TypeScript, expo

아바타 커뮤니티앱 만들기 (React Native Expo)

Kyo

React Native with Expo: 제로초에게 제대로 배우기

제로초(조현영)

웹 개발자가(특히 React 개발자라면) 정말 손쉽게 앱을 출시할 수 있는 시대가 되었습니다. Expo와 함께라면 더더욱 빠르게 Android와 iOS 앱 모두를 출시할 수 있습니다. Expo를 통해 빠르게 앱까지 출시할 수 있는 개발자가 되어봅시다.

초급

React, React Native, 하이브리드 앱

React Native with Expo: 제로초에게 제대로 배우기

제로초(조현영)

SEO 최적화 랜딩페이지 솔루션 & 노출전략: 바이브코딩으로 완성 with Nextjs

ludgi

실전 바이브 코딩으로 회사 소개 랜딩페이지를 완성합니다. Cursor AI + Next.js + TypeScript + TailwindCSS + shadcn/ui + MCP 스택으로, 설계부터 배포까지 한 번에 진행합니다. 핵심은 “빠른 구현 + 검색 엔진에 잘 노출되는 SEO 기반”입니다. 🏁 강의 목표 랜딩 제작 → 성능 최적화 → SEO 반영 → 배포/인덱싱 실시간 코딩(바이브 코딩)으로 섹션별 완성본을 바로 확인 검색 반영까지 직접 체험 🛠️ 실습 스택 Cursor AI, Next.js(App Router), TypeScript TailwindCSS, shadcn/ui, MCP 워크플로우 🔍 SEO 실습 강사가 제공하는 SEO 최적화용 MD 파일 적용 메타데이터, OG/Twitter 카드, robots/sitemap, 구조화 데이터(JSON-LD) 다국어 라우팅 선택 적용 🎯 완성물 반응형 회사 소개 랜딩 + 문의 폼 Lighthouse 95+ 목표 Vercel 배포 후 Search Console 등록 및 인덱싱 요청 📚 이 강의로 배우는 것 히어로/신뢰/기능/FAQ 섹션을 빠르게 구성하는 법 shadcn/ui로 깔끔한 UI 구성 폼 검증과 기본 전환 추적 포인트 설계 구조화 데이터 + 다국어 라우팅으로 SEO 스코어 올리기 배포 후 Search Console을 통한 인덱싱 과정 이해 💡 현업 인사이트 (강의 특전) 단순히 코드 구현만이 아니라, 실제 시장에서 활용되는 마케팅·노출 방식도 간단히 짚어드립니다. 광고, 블로그 포스팅, 댓글 작업의 현실적인 단가 범위 외주·용역 업체들이 실제로 SEO, 노출 작업을 어떻게 진행하는지 개발자가 직접 참여했을 때와 외주를 맡겼을 때의 비용/효율 차이 이 부분을 통해 단순히 기술을 넘어서 실제 현업에서 어떻게 활용되는지, 어떤 비용 구조로 움직이는지까지 감각을 익힐 수 있습니다. 한 줄 정리 “구현 → 최적화 → 배포 → 인덱싱”의 흐름을 따라가며, 실제 검색 노출과 현업 시장 구조까지 연결되는 웹 제작 프로세스를 배웁니다.

입문

React, Node.js, cursor

SEO 최적화 랜딩페이지 솔루션 & 노출전략: 바이브코딩으로 완성 with Nextjs

ludgi