무료
입문자를 위해 준비한
[프론트엔드, 풀스택] 강의입니다.
[프론트엔드, 풀스택] 강의입니다.
2023년 리뉴얼된 React 공식 문서를 함께 학습해요.
✍️
이런 걸
배워요!
이런 걸
배워요!
리액트 공식문서를 처음부터 끝까지 함께 읽어요
종종 리액트 외적인 자바스크립트 지식들도 다뤄요
혼자가 외롭다면 시간차 스터디는 어때요?
함께하는 리액트 공식문서 스터디
📢 알려드립니다
- 해당 강의는 지식공유자가 진행한 React 공식문서 스터디의 녹화분입니다.
- React 공식문서 스터디는 《React 공식문서》를 함께 읽으며 번역 및 공부하는 취지의 모임으로서, 함께 번역한 내용을 지식공유자가 낭독하고 예제 코드를 실행하며 참가자들과 함께 해석, 유추, 보충 설명하는 방식으로 진행되었습니다.
함께 배우는 React 💡
혹시 내 얘기라면 주목하세요!
“실무에서 React를 쓰고는 있지만 정확한 사용법을 이해하고 있진 않아요.”
“React 공식문서를 읽어보려 해도, 영어와 분량의 압박 때문에 선뜻 도전하지 못하고 있어요.”
이 강의는 함께 《React 공식문서》를 읽고 예제 코드를 실행하는 방식으로 진행된 React 공식문서 스터디의 진행 과정을 담고 있습니다. 함께 React를 공부해 보아요!
- ✅ React 전반에 대한 이해 수준을 대폭 끌어올릴 수 있습니다.
- ✅ 기존에 잘못 작성한 코드를 발견하고 리팩토링하기 위한 명확한 기준을 세울 수 있게 돼요.
- ✅ 새로운 기능도 쉽게 이해하고 바로 적용해볼 수 있어요.
영어 문장 바로 아래에 한글 번역이 있어요. 원문만 있을 때나 번역글만 있을 때보다 훨씬 이해하기 좋습니다.
React 외적인 내용도 많이 다루어서, JavaScript 생태계의 전반적인 지식을 두루 섭렵할 수 있어요.
💡 학습 전 참고해주세요
- 학습 자료는 https://react-ko.dev 를 확인해주세요.
- HTML, CSS 및 기본적인 Javascript 지식은 갖추고 있어야 합니다.
- 레퍼런스 파트 뒷부분은 향후 순차적으로 업데이트될 예정입니다. (최종 업데이트 예상 시기: 7월 말)
지식공유자의 다른 강의가 궁금하다면?
이런 분들께 추천드려요!
🎓
학습 대상은
누구일까요?
학습 대상은
누구일까요?
공식문서를 읽어본 적 없는 현직 개발자
공식문서로 공부하는 데에 어려움을 느끼는 취준생 등
📚
선수 지식,
필요할까요?
선수 지식,
필요할까요?
자바스크립트
안녕하세요
정재남 입니다.
정재남 입니다.
Naver 프론트엔드 개발자입니다.
지식공유를 좋아하며
꾸준히 강의 및 스터디를 진행하고 있습니다.
저서: 코어 자바스크립트
Github: github.com/roy-jung
블로그: roy-jung.github.io
유튜브 채널: FE재남
커리큘럼
총 71 개
˙ 31시간 54분의 수업
이 강의는 영상이 제공됩니다. 미리보기를 통해 콘텐츠를 확인해보세요.
섹션 0. 학습 | GET STARTED
6 강
∙ 3시간 38분
섹션 1. 학습 | UI 구성하기
8 강
∙ 3시간 25분
첫번째 컴포넌트
25:18
컴포넌트 import 및 export
14:51
JSX로 마크업 작성하기
12:38
JSX에서 JavaScript 사용하기
21:57
컴포넌트에 props 전달하기
49:49
조건부 렌더링
19:20
목록 렌더링
29:19
컴포넌트 순수성 유지
32:19
섹션 2. 학습 | 상호작용 추가하기 (Adding Interactivity)
7 강
∙ 3시간 29분
이벤트에 응답하기
35:27
state: 컴포넌트의 메모리
34:46
렌더링하고 커밋하기
10:28
스냅샷으로서의 state
23:35
여러 state 업데이트를 큐에 담기
22:47
객체 state 업데이트
52:38
배열 state 업데이트
29:31
섹션 3. 학습 | state 관리 (Managing State)
7 강
∙ 3시간 37분
state로 입력에 반응하기
33:31
state 구조 선택
45:53
컴포넌트 간의 state 공유
21:25
state 보존 및 재설정
36:25
state 로직을 reducer로 추출하기
38:28
context로 데이터 깊숙이 전달하기
24:54
reducer와 context로 확장하기
16:57
섹션 4. 학습 | 탈출구 (Escape Hatches)
8 강
∙ 7시간 27분
ref로 값 참조하기
45:06
ref로 DOM 조작하기
01:11:07
Effect와 동기화하기
01:19:32
Effect가 필요하지 않을 수도 있습니다
55:53
반응형 Effect의 생명주기
01:09:35
이벤트와 Effect 분리하기
30:39
Effect 의존성 제거하기
42:05
커스텀훅으로 로직 재사용하기
53:11
섹션 5. 레퍼런스 | react | Hooks
15 강
∙ 5시간 22분
useState
41:52
useReducer
23:23
useContext
21:42
useRef
18:52
useImperativeHandle
07:59
useEffect
44:52
useLayoutEffect
07:40
useInsertionEffect
09:40
useMemo
49:53
useCallback
12:24
useTransition
25:35
useDeferredValue
19:06
useDebugValue
03:10
useId
21:40
useSyncExternalStore
14:18
섹션 6. 레퍼런스 | react | Components
4 강
∙ 58분
<Fragment>
07:33
<Profiler>
12:22
<StrictMode>
07:45
<Suspense>
30:25
섹션 7. 레퍼런스 | react | APIs
5 강
∙ 50분
createContext
08:53
forwardRef
11:45
lazy
03:55
memo
12:04
startTransition
14:16
섹션 8. 레퍼런스 | react | Components
5 강
∙ 1시간 4분
Common(e.g. <div>)
40:14
<input>
13:29
<option>
01:52
<progress>
01:45
<textarea>
07:38
섹션 9. 레퍼런스 | react-dom
6 강
∙ 2시간 1분
APIs - createPortal
15:18
APIs - flushSync
05:53
APIs - deprecated APIs
25:57
Client APIs
27:25
Server APIs
25:56
Legacy APIs
20:37
강의 게시일 : 2023년 07월 06일
(마지막 업데이트일 : 2023년 08월 06일)
수강평
총 4개
수강생분들이 직접 작성하신 수강평입니다.
5
4개의 수강평
5점
4점
3점
2점
1점
VIEW
추천 순
최신 순
높은 평점 순
낮은 평점 순
평점 순
높은 평점 순
낮은 평점 순
귀한 강의 감사합니다.
항상 건강 조심하세요.
2023-07-07
리액트를 통해 문서를 쓰는 방법을 공부할 수 있었고 서류 작업에 있어서 도움이 되었습니다.
2023-07-11
리액트 공부를 하고 있습니다! 항상 좋은 강의 감사드립니다!
2023-07-13
좋은 강의 감사합니다.
2023-08-24