hongjunland

Welcome

2 분 소요

1. React 공부순서

1.1 공부순서

1) 1주차 : 자바스크립트기초 + 타입스크립트 + React 기본개념 2) 2주차 : React 심화 3) 3주차 : 토이 프로젝트

1.2 링크 자료

2. Chapter list - JS & TS

[초보]

(1) 루프, if 문, try / catch 등의 기본 프로그래밍 도구 및 문법을 알고 있어야 함

(2) 익명 함수뿐만 아니라 정의 및 할당 할 수있는 다양한 방법을 포함한 함수 정의의 이해

(3) 기본 scope 원칙의 이해, 글로벌 (window) scope VS 오브젝트 scope 이해 (클로저 제외)

(4) 컨텍스트의 역할과 ‘this’변수의 사용 이해

(5) 함수 객체 및 객체를 초기화 하고 선언하는 다양한 방법 이해하기

(6) ‘<’, ‘>’, ‘ == ‘, ‘ === ‘ 와 같은 자바 스크립트 비교 연산자를 이해하고, falsy가 무엇이며, 객체와 문자열 비교가 어떻게 작동하는지뿐만 아니라 캐스팅에 대한 이해

(7) 객체의 속성/함수에 대한 배열 인덱싱 및 이것이 실제 배열과 다른 점 이해 (객체 리터럴 VS 배열 리터럴)

[중급] -> 여기까지만 하자

(1) Understanding timers, how they work, and when/how they can be useful as well as asynchronous method execution

(2) In depth knowledge on callbacks and function application such as the ‘call’ and ‘apply’ methods for controlling context and function argument passing

(3) Understanding JSON notation and the ‘eval’ function

(4) Understanding closures, how they affect the performance of your code, and how they can be used to create private variables, along with the lovely (function(){})() call

(5) AJAX and object serialization

-> 타이머, 콜백, JSON, eval 함수, 클로저(접근제어), AJAX & Object 직렬화

  • Chapter1 JavaScript 초보

    • 기본문법
    • 익명함수
    • scope
    • context, this
    • object
    • 연산자, falsy, 캐스팅
    • 객체의 리터럴 vs 배열 리터럴

  • Chapter2 JavaScript 중급

    • 타이머
    • 콜백
    • JSON
    • eval
    • 클로저
    • AJAX & 객체 직렬화

3. Chapter list - React

  • Chapter1 리액트 기본(1)

    • 1-1 리액트란 무엇인가
    • 1-2 JSX
    • 1-3 props & state
    • 1-4 생명주기
    • 1-5 이벤트 처리

  • Chapter2 리액트 기본(2)

    • 2-1 배열 데이터 렌더링 및 관리
    • 2-2 state 끌어올리기
    • 2-3 합성 및 상속
    • 2-4 React적인 사고

  • Chapter3 리액트 고급(1)

    • 3-1 Context
    • 3-2 에러 경계
    • 3-3 Ref 전달
    • 3-4 Fragment
    • 3-5 고차 컴포넌트 및
    • 3-6 다른 라이브러리와 통합
    • 3-7 JSX 이해하기
    • 3-8 성능 최적화

  • Chapter4 리액트 고급(2)

    • 4-1 Portal
    • 4-2 Profiler
    • 4-3 ES6 없이 사용하는 React
    • 4-4 JSX 없이 사용하는 React
    • 4-5 재조정(Reconciliation)
    • 4-6 Ref와 DOM
    • 4-7 Render Props

  • Chapter5 리액트 고급(3)

    • 5-1 정적 타입 검사
    • 5-2 Strict Mode
    • 5-3 PropTypes를 사용한 타입 검사
    • 5-4 비제어 컴포넌트
    • 5-5 웹 컴포넌트

  • Chapter6 Hook

    • 6-1 Hook
    • 6-2 State Hook & Effect Hook
    • 6-3 Hook 규칙
    • 6-4 Custom Hook
    • 6-5 Hook API 참고서

  • Chapter7 알아야할 것들

    • 7-1 기여하는 방법
    • 7-2 코드 구조 개요
    • 7-3 구현 참고사항
    • 7-4 설계 원칙

4. 계획

  월 화 수 목 금 비고
1주차 JS & React 기본1 React 기본2 React 고급1(~3-4) React 고급1(3-5~끝) 복습  
2주차 React 고급2 React 고급3 Hook 알아야할 것들 복습  
3주차 토이 프로젝트 토이 프로젝트 토이 프로젝트 토이 프로젝트 토이 프로젝트  
  • 남은부분은 주말에

참조

  • https://ko.reactjs.org/docs/getting-started.html
  • https://okky.kr/article/375836

참고