한 줄 요약 - useState, useEffect, 커스텀 훅 같은 React 핵심 개념을 글로 읽기만 하는 게 아니라, 직접 눌러보며 이해하는 인터랙티브 학습 코너를 새로 열었습니다.
무엇인가요
개념마다 만질 수 있는 라이브 데모가 붙어 있어요. 모든 레슨은 같은 틀로 흘러갑니다. 일상 비유로 시작해서, 만질 수 있는 데모로 핵심을 보여주고, 깨끗한 코드와 흔한 실수까지 짚어줘요. 대상은 이 기법을 처음 보는 사람이라, 전문 용어는 그때그때 풀어 씁니다.
왜 만지면서 배우나요
예를 들어 렌더링 레슨에서는 일반 변수를 바꿔도 화면이 안 바뀌는 걸 직접 눌러 확인하고, 다시 그리기 버튼을 누르면 그제야 값이 따라잡는 걸 봅니다. 리스트 레슨에서는 key를 index로 두면 입력값이 엉뚱한 행에 붙는 버그를 손으로 재현해봐요. 글로 백 번 읽는 것보다 한 번 만져보는 게 빠릅니다.
다루는 개념
- 렌더링이 뭔가 / useState / 이벤트 핸들링
- 조건부 렌더링 / props / 리스트와 key
- useEffect / useRef / 커스텀 훅 / useContext / useMemo
퀴즈와 통계
레슨을 보고 나면 개념 이해 점검 퀴즈로 확인할 수 있어요. 푼 결과는 학습 통계에 쌓여서, 용어 학습과 함께 한 곳에서 진행 상황을 볼 수 있습니다.
어디서 시작하나요
아래 관련 코너 카드로 들어가면 첫 레슨부터 차례로 볼 수 있어요. 초보자라면 순서대로, 이미 아는 분은 궁금한 개념만 골라 만져보세요.