코스 프로모션 배너 전용입니다.

0일 0시간 0분 0초 코스 프로모션 배너 전용입니다.

(자동)

정가 ~~(자동)~~

할인 금액 (자동)

현재 판매가 (자동)

(자동)

* 12개월 무이자 할부 시

바로 구매하기

React & Redux , 사용법만 익힌다면 한계가 있습니다.

원리를 이해하지 않으면, 한정된 시야로 개발을 하게 됩니다. 훨씬 다양하고, 넓은 시야로 확장성 있는 개발을 할 수 있도록
원리를 이해하는 것이 중요합니다. 기술의 원리를 파악하기 위해 직접 그 기술을 만들어보는 것은 생각지도 못하죠.
그 정도 디테일하게 접근할 엄두조차 내지 못하기 때문입니다. 하지만 저 김민태는 여러분과 함께 여러분의 고정관념을 깰 준비가 되어있습니다.
그리고 그 고정관념을 깨줄 개발 선배는 저 김민태밖에 없습니다.

왜 React, Redux의 원리를 왜 배워야 할까요?

수많은 리스크에도 흔들리지 않고 효율적으로 관리하기 위한 필수 기술!
React와 React를 사용하는 방법을 배우고 이 기술들을 사용하는 방법은 그리 어렵지 않습니다.
하지만 단순히 그 사용법만 알고서는 더 큰 프로젝트, 애플리케이션을 관리하기 절대 쉽지 않습니다.
기술에 대한 원리, 구조에 대한 이해를 통해 뿌리를 깊숙히 내려야만 효율적으로 기술을 사용할 수 있습니다. 무작정 많이 사용한다고 좋은 것이 아닙니다.
적재 적소에 알맞게 사용해야 그 역할에 충분히 충실하기 때문이죠.

확장성 있는 엔지니어링을 위한 6가지

React, 코드 40줄로 직접 만들기

다루기 어려운 것을
다루기 쉽게 변형하여 개발하는 방법

강사의 한 마디
개발을 하면서 다루기 어려운 것이 있다면, 이를 상대적으로 다루기 쉬운 형태의 것으로 변경하고, 다루기 쉬운 것을 통해 다루기 어려운 것을 제어하는 방법을 취합니다. React를 직접 만들어보며 이러한 방법을 React는 어떻게 구현했는지 직접 알아봅니다. 이를 통해 React의 근간이 되는 핵심 원리를 보다 명확히 이해할 수 있습니다.

Redux, 코드 13 줄로 만들기

관계를 끊으며,
확장성 있는 개발을 설계 하는 방법

강사의 한 마디
여러 소프트웨어를 연계하여 개발을 하면 관계의 정도에 따라 의존성과 변경용이성의 사이에서 고민을 하게 됩니다. Redux를 직접 만들어보며, 소프트웨어간에 적정한 거리를 유지하며 최소 관계를 맺어 개발하는 방법을 익혀봅니다. 이를 통해 확장성 있는 개발 설계 방법을 습득합니다.

Middleware, 직접 만들기

소프트웨어를 변경하지 않으며,
더 많고 어려운 문제 해결하는 방법

강사의 한 마디
소프트웨어는 현실의 문제를 해결하는 솔루션입니다. 현실의 문제는 시간의 흐름에 따라 언제나 변화합니다. 따라서 필연적으로 소프트웨어도 변화해야 하며 변화는 복잡도를 올리기 마련입니다. 미들웨어를 직접 만들어보며 소프트웨어의 핵심은 변경하지 않으며 현실의 다양한 문제를 해결할 수 있는 방법을 알아봅니다.

울타리에서 벗어나 사고 하기

React나 Redux 같은 기술의
사용자에서 생산자로서 울타리 벗어나기

강사의 한 마디
React나 Redux의 사용법만을 아는 것도 꽤나 어려운 일이지만, React와 Redux를 직접 만들어보는 경험은 사용자가 아닌 생산자의 관점에서 기술을 이해할 수 있게 하고, 무의식적으로 규정한 사고의 한계를 벗어날 수 있게 해주는 큰 경험이 될 것입니다.

❓React & Redux 직접 만들어 보면 뭐가 좋나요❓

소프트웨어는 사람이 만들기 때문에 만든 이의 생각이 깊게 녹아있을 수 밖에 없습니다. 많은 소프트웨어를 조합하여 하나의 앱 또는 서비스를 만드는 개발자 입장에서 사용하는 소프트웨어의 구현 의도를 잘 이해하는 것이 올바른 사용을 위해 무엇보다 중요합니다. 제작자의 의도를 가장 잘 이해하는 방법은 직접 만들어 보는 것입니다. 모든 것을 다 만들어 볼 필요는 없지만 React 나 Redux 와 같이 앱의 아키텍처에 큰 영향을 주는 도구를 직접 만들어 보며 이해할 수 있다면 어떤 앱을 만든다해도 많은 인사이트를 가질 수 있을겁니다.

27년차의 라이브코딩 엿보기 수업

27년차 우아한형제들 개발 이사가
코드 안에 숨어있는 원리를 설명하는 법

위 코드가 어떤 원리인지 파악이 되나요?
Redux의 미들웨어는 이렇게 만들어집니다.커링이라는 코드 테크닉인데 Redux 는 이 커링 테크닉을 어떻게 활용해 미들웨어 아키텍처를 만들고 사용자는
이 아키텍처를 활용해 Redux를 변경하지 않고 필요한 기능을 Redux 에 삽입할 수 있었을까요?
그 비밀을 함께 탐험해 보죠.

엔지니어적 판단 능력 기르기

개념의 뿌리를 깊게 내려
스스로 판단하고 결정할 수 있는 능력 갖기

강사의 한 마디
종종 ‘남들도 이렇게 쓰나?’, ‘이게 맞나?’ 와 같이 본인의 개발 방법에 대한 확신을 갖지 못하는 주니어 개발자가 보입니다. 선배에게 의존하게 되고, 블로그 글에서 그 답을 찾으려고 하는 경향도 있습니다. 그러나, 스스로 결정의 근거를 찾고, 판단할 수 있는 능력을 기르는 것이 무엇보다 중요합니다.

코스 프로모션 배너 전용입니다.

0일 0시간 0분 0초 코스 프로모션 배너 전용입니다.

(자동)

정가 ~~(자동)~~

할인 금액 (자동)

현재 판매가 (자동)

(자동)

* 12개월 무이자 할부 시

바로 구매하기

강사님께 직접 물었습니다

김민태

이력
現 우아한 형제들 / 기술이사 프론트엔드 개발 그룹장
 前 피키캐스트 / 웹 프론트엔드 파트 리더
前 NCSoft / 차장
前 KTH / 웹 플랫폼팀 팀장, Ios 개발팀 팀장

교육 경험
• 우아한형제들 개발자 채용 및 사내외 교육 진행
• 패스트캠퍼스 오프라인 JavaScript 부트 캠프 과정 14기 진행
• 패스트캠퍼스 온라인 The RED : React와 Redux로 구현하는 아키텍처와 리스크 관리 강의 진행

기타 활동
• 한국 웹 20주년 국제 콘퍼런스 강연

Question 1.
어떤 분들이 수강하시면 좋을까요?

최근 프론트엔드 개발자라면 거의 대부분이 사용하고 있는, React나 Redux 보다 깊이 있게 이해하고 사용하고 싶은 분들께 추천 합니다. React 와 Redux의 단순한 사용자의 관점에서 벗어나 보다 넓은 시야로 기술을 바라볼 수 있고, 보다 확장성 있는 개발을 할 수 있는 사고 능력을 기르는 데 큰 도움이 될 것입니다.

Question 2.
책이나 기존 인강과는 어떤 점이 다른가요?

대부분의 교육 콘텐츠는 React나 Redux 등의 기술을 어떻게 사용하는지에 중점을 두고 있습니다. 이 또한 좋은 교육 콘텐츠이지만, 우리는 직접 React와 Redux를 만들어보며 그 핵심 원리를 깊이 있게 이해하고자 합니다. 만들어보는 경험은 React와 Redux를 보다 잘 활용할 수 있는 계기가 될 것입니다.

Question 3.
중점을 둔 수업방식/실습이 있으신가요?

우리가 만들어 볼 React와 Redux의 코드는 각각 40줄 내외, 15줄 내외로 길지 않습니다. 그러나 각각의 코드가 어떤 의미가 있는지 이해하는 과정은 짧지 않을 것입니다. 지루하진 않을 것입니다. React와 Redux가 현실의 어떤 문제를, 어떻게 해결하고 있는지 지금까지와는 다른 관점에서 익힐 수 있게 될 것입니다.

강의 미리 엿보기 👇

만들어보며 이해하는 React & Redux
프론트엔드 아카데미 상세정보.

수업 목표

▫️새로운 기술에 대한 학습 비용을 줄이고, 기술 트렌드를 잘 이해할 수 있도록 개발도구들의 구조를 학습합니다.
▫️React, Redux, Middleware를 직접 만들어 개념 동작 원리를 이해할 수 있어, 코드의 자신감을 가질 수 있습니다.
▫️개발도구의 구조에 대한 이해를 바탕으로 새로운 응용 기술이 등장하더라도 어렵지 않게 활용할 수 있습니다.

강의 특징

▫️수강료 1회 결제로 평생 소장
▫️부가 학습 자료 제공

수업 시수

▫️약 6시간 분량

난이도

▫️초중급
▫️JavaScript 지식

커리큘럼을 확인하세요.

아래의 모든 챕터 클립을 강의 하나로 들을 수 있습니다.
지금 결제 한 번으로 모든 강의를 평생 소장하세요!

01. 시작하며

▫️ 무엇을 배울 것인가?
▫️ 1타 2피, 3피, 4피
▫️ 작게 시작하기
▫️ 변경하지 않고 확대하기
▫️ 웹 프론트엔드 개발 환경

02. React 만들기

▫️ 해결책 만들기
▫️ 객체 to DOM Render
▫️ webpack & babel setup
▫️ create Element
▫️ @jsx
▫️ function component
▫️ class component
▫️ virtual DOM
▫️ 마법의Hook 원리와 제약
▫️ 사이드 이펙트
▫️ 소프트웨어의 성장과 발전

03. Redux 만들기

▫️ 문제 정의 - 어떤 코드가 상태를 어디서 바꾸나?
▫️ 해결책 만들기
▫️ 구독 발행 모델
▫️ 형식적 무결성
▫️ 그럴듯 하게 모양내기
▫️ 비동기 처럼 보이는 동기의 한계

04. 미들웨어 만들기

▫️ 컨셉의 한계와 돌파구
▫️ 미들웨어와 플러그인
▫️ 미들웨어 파이프라인 구현
▫️ 로거 미들웨어
▫️ 비동기 처리기 미들웨어

상세 커리큘럼.

자세한 커리큘럼 및 내용은 여기서 확인하세요!

자세히 보기 »

👩🏻‍💻수업 환경👩🏻‍💻

코스 프로모션 배너 전용입니다.

0일 0시간 0분 0초 코스 프로모션 배너 전용입니다.

(자동)

정가 ~~(자동)~~

할인 금액 (자동)

현재 판매가 (자동)

(자동)

* 12개월 무이자 할부 시

바로 구매하기

김민태에 대해 더 알아보고 싶다면

지금 보러가기 »

구매 안내.

결제 후, 언제 어디서나 하루 10분 공부 시작.

• 홈페이지 회원가입 및 로그인
• 원하는 강의 결제하기
• 마이페이지에서 강의 시청하기

이 강의도 추천해요.

학습규정 * 본 상품은 동영상 형태의 강의를 수강하는 상품입니다.
* 상황에 따라 사전 공지 없이 할인이 조기 마감되거나 연장될 수 있습니다.
* 수강 신청 및 결제를 완료하시면, 마이페이지를 통해 바로 수강이 가능합니다.

총 학습기간:
– 정상 수강기간(유료 수강기간) 최초 1개월 (30일), 무료 수강 기간은 31일 일차 이후로 무제한이며, 유료 수강기간과 무료 수강기간 모두 동일하게 시청 가능합니다.
– 본 패키지는 약 6시간 분량으로, 일 1시간 내외의 학습 시간을 통해 정상 수강 기간(=유료 수강 기간) 내에 모두 수강이 가능합니다.
– 수강시작일: 수강 시작일은 결제일로부터 기간이 산정되며, 결제를 완료하시면 마이페이지를 통해 바로 수강이 가능합니다. (사전 예약 강의는 1차 강의 오픈일)
– 패스트캠퍼스의 사정으로 수강시작이 늦어진 경우에는 해당 일정 만큼 수강 시작일이 연기됩니다.
– 일부 강의는 아직 모든 영상이 공개되지 않았습니다. 각 상세페이지 하단에 공개 일정이 안내되어 있습니다.

주의사항 – 상황에 따라 사전 공지 없이 할인이 조기 마감되거나 연장될 수 있습니다.
– 천재지변, 폐업 등 서비스 중단이 불가피한 상황에는 서비스가 종료될 수 있습니다.
– 본 상품은 기수강생 할인, VIP CLUB 제도 (구 프리미엄 멤버십), 기타 할인 이벤트 적용이 불가할 수 있습니다.
– 커리큘럼은 제작 과정에서 일부 추가, 삭제 및 변경될 수 있습니다.
– 쿠폰 적용이나 프로모션 등으로 인해 5만원 이하의 금액으로 강의를 결제할 경우, 할부가 적용되지 않습니다.

환불규정 – 환불금액은 정가가 아닌 실제 결제금액을 기준으로 계산됩니다.
– 쿠폰을 사용하여 강의를 결제하신 후 취소/환불 시 쿠폰은 복구되지 않습니다.

– 수강시작 후 7일 이내, 100% 환불 가능합니다. (단, 수강하셨다면 수강 분량만큼 차감)
– 수강시작 후 7일 이내, 1강 이상 수강 시 전체 강의에서 수강한 강의의 비율에 해당하는 수강료를 차감 후 환불 가능합니다.

– 수강시작 후 7일 초과 시 정상 수강기간 대비 잔여일에 대해 아래 환불규정에 따라 환불 가능합니다.
환불요청일 시 기준
: 수강시작 후 1/3 경과 전, 실 결제금액의 2/3에 해당하는 금액 환불
: 수강시작 후 1/2 경과 전, 실 결제금액의 1/2에 해당하는 금액 환불
: 수강시작 후 1/2 경과 후, 환불 금액 없음

* 보다 자세한 환불 규정은 홈페이지 취소/환불 정책에서 확인 가능합니다.

패스트캠퍼스 아이디 공유 금지 정책 안내 [패스트캠퍼스 아이디 공유 금지 정책]
패스트캠퍼스의 모든 온라인 강의에서는 1개의 아이디로 여러명이 공유하는 형태를 금지하고 있습니다.
동시접속에 대한 기록은 내부 시스템을 통해 자동으로 누적되며, 이후 서비스 이용이 제한될 수 있습니다.

[기기제한 정책]
패스트캠퍼스 온라인 강의 시청을 위해서는 ID별 최대 3개의 기기를 등록할 수 있으며, 기기 등록은 온라인 강의장 접속 시 자동 등록됩니다.
최대 갯수를 초과하였을 경우 등록된 기기 해제가 필요합니다.

[저작권 정책]
패스트캠퍼스의 모든 강의는 무단 배포 및 가공하는 행위, 캡쳐 및 녹화하여 공유하는 행위, 무단으로 판매하는 행위 등 일체의 저작권 침해 행위를 금지합니다.
부정 사용이 적발될 경우 저작권법 위반에 의한 법적인 제재를 받으실 수 있습니다.

root layout

김민태의 프론트엔드 아카데미 : 제 2강 만들어보며 이해하는 React&Redux