개발 · 프로그래밍

/

프론트엔드

React 완전 끝내기: useHoooooook

넓고 깊으면서 자세하게 React의 state와 hook을 배울 수 있습니다. React 공식 문서의 95% 이상을 다룹니다. 본 강좌로 React를 끝낼 수 있습니다.

(5.0) 수강평 2개

수강생 91명

ReactJavaScriptDOM
Thumbnail

초급자를 위해 준비한
[프론트엔드, 웹 개발] 강의입니다.

이런 걸
배워요!

  • React state(상태)

  • React hook

  • 컴포넌트를 만드는 방법

  • React 패러다임

  • React 코드 리팩터링 방법

  • React와 외부 시스템 연결

  • 시나리오로 개발하는 방법

react-yb

이런 내용을 배워요

React는 선언형 방법으로 UI를 구현합니다.

선언형과 명령형 코드 형태를 이해해야 React에 최적인 코드를 작성할 수 있습니다.
명령형 형태를 설명합니다.
선언형 방법 단계를 체크 리스트를 따라가면서 코드와 함께 설명합니다. 완전하게 React에 최적인 선언형 방법을 내 것으로 만들 수 있습니다.

React UI 선언형 방법

React에서 state는 기본중에 기본입니다.

state를 구조화하는 원칙을 따라가면서 코드와 함께 설명합니다.
완전하게 React의 복잡한 상태 구조를 심플하게 만드는 개념을 정립할 수 있습니다.

상태 구조화 원칙

React는 다양한 hook을 제공합니다.

정확하게 hook을 이해해야 목적에 맞게 hook을 사용할 수 있습니다.
React 공식 문서의 모든 hook을 다양한 코드 형태를 제시하고 설명합니다.

hook-list-1

먼저 시나리오를 작성하고
이를 기준으로 React 앱을 개발하는 방법을 배울 수 있습니다.

여행을 가려면 먼저 여행 계획을 수립해야 하듯이, 프로그램 개발도 먼저 사용자와 시스템이 상호작용하는 시나리오를 작성해야 합니다.
여행 계획에 따라 여행하듯이 시나리오에 따라 프로그램을 개발해야 합니다.
여행지에 따라 계획이 다르듯이 개발 환경에 따라 시나리오가 다릅니다.
React 환경에 맞는 시나리오를 작성하는 방법과 시나리오를 따라 가면서 React 컴포넌트를 개발하는 방법을 배울 수 있습니다.

scenario-1

한 번에 완전하게 코드를 작성할 수 없습니다.

따라서 리팩터링을 하게 되지만 환경에 따라 리팩터링 방법이 다릅니다.
React는 UI 중심이므로 이에 최적인 방법으로 리팩터링을 해야 합니다.
React 환경에 최적인 리팩터링 방법을 배울 수 있습니다.

refact-1

비기너를 위한 권고

React는 빠르게 대충 배워도 React 앱을 개발할 수 있습니다.
하지만, 조금 더 깊게 들어가면 돌아와서 다시 배워야 합니다.
기본을, 바탕을 하나씩 다져가는 것이 느린 것 같아도 결국은 빠릅니다. 이것이 지름길이며 개발자의 길입니다.
자신감을 갖고 기술 면접에 임할 수 있습니다.
기술 면접을 보는 면접관은 기본의 튼튼함을 체크합니다. 왜냐하면, 기본이 중요하다는 것을 면접관은 경험으로 알고 있기 때문입니다.
튼튼한 기본을 바탕으로 개발한 코드는 다르며, 면접관은 이것이 보입니다.

수강 전 참고 사항

실습 환경

  • 브라우저, Node.js, 코드 에디터

  • 강의에서 환경 설정 방법을 다룹니다.

학습 자료

  • 강의의 모든 소스 코드를 파일로 제공합니다.

  • 강의에서 학습 자료 사용 방법을 다룹니다.


연관 강의 로드맵을
함께 학습해보세요.

이런 분들께
추천드려요!

학습 대상은
누구일까요?

  • React state와 hook을 완전하게 배우려는 개발자

  • React의 모든 것을 빠짐없이 배우려는 개발자

  • React 개발 응용력을 향상시키려는 개발자

  • React 환경의 기획자

  • 컴포넌트 개념 정립을 원하는 개발자, 기획자

선수 지식,
필요할까요?

  • 자바스크립트, HTML, CSS

  • DOM 이해도 필요하지만 필수는 아닙니다

  • 강의자의 "React 비기너" 강좌 추천

안녕하세요
김영보입니다.

40년 넘게 소프트웨어를 개발했으며, 지금도 개발하고 있습니다. 
23년 넘게 JavaScript 중심으로 개발했습니다.

메일: tonextday@gmail.com

동영상: 11개
클린업 자바스크립트, 자바스크립트 비기너, 자바스크립트 중고급
모던 자바스크립트(ES6+) 기본, 모던 자바스크립트(ES6+) 심화
DOM 기본, DOM 인터랙션
React 비기너, React 완전 끝내기
요구분석 구현 방법
자바스크립트 머신러닝 TensorFlow.js

저서: 9권
몰입! 자바스크립트, ECMAScript 6, HTML5, DOM 스크립팅
자바스크립트 정규표현식, 요구분석을 위한 Event Process 모델링
머신러닝 TensorFlow.js JavaScript, Ajax 활용, prototype.js 완전분석  
9권 중에서 8권은 국내 최초 저자입니다.
특히, "머신러닝 TensorFlow.js JavaScript"는 출판하는 시점에 amazon.com에 관련된 책이 없었습니다.

 

 

커리큘럼

전체

95개 ∙ (10시간 25분)

수업 자료

가 제공되는 강의입니다.

강의 게시일: 
마지막 업데이트일: 

수강평

아직 충분한 평가를 받지 못한 강의입니다.
모두에게 도움이 되는 수강평의 주인공이 되어주세요!