본문 바로가기 메뉴 바로가기

104%

프로필사진
  • 글쓰기
  • 관리
  • 태그
  • 방명록
  • RSS

104%

검색하기 폼
  • Web FrontEnd Developer (411)
    • Today I Learned (8)
    • Project Structure (4)
    • Electron (4)
    • Nest.js (3)
    • Node.js (2)
    • Next.js (1)
    • React (30)
    • Redux & Middleware (1)
    • Typescript (7)
    • Webpack (9)
    • Javascript (34)
    • HTML&CSS (13)
    • 자료구조 (11)
    • 알고리즘 (66)
    • 디자인패턴 (1)
    • Git (1)
    • 독후감 & 감상평 (9)
    • 프로젝트 (3)
      • Pickvs.com (2)
    • 컴퓨터 공학과 졸업 (200)
      • 안드 개발 기록 (21)
      • 블록체인 (8)
      • 기본 개념 (13)
      • JSP&Servlet (9)
      • 스프링 프로젝트 (17)
      • 무선 네트워크 (24)
      • 소켓 프로그래밍 (36)
      • 기본 개념2 (7)
      • 기타 (2)
      • 면접준비 (6)
      • 자바 (1)
      • 데이터베이스 (22)
      • 객체지향 (7)
      • 시스템프로그래밍 (3)
      • 운영체제 (20)
      • 안드로이드 Trouble Shooting (4)
    • 후기 및 일상 (0)
    • 운전 (0)
  • 방명록

ReactElement (1)
JSX.Element vs ReactNode vs ReactElement의 차이

타입스크립트로 리액트 코드를 작성하다보면 컴포넌트의 타입을 정해줘야하는데 너무 여러가지 타입이 있어서 헷갈려서 정리하고자 합니다. 배경지식 클래스형 컴포넌트는 render메소드에서 ReactNode를 리턴한다. 함수형 컴포넌트는 ReactElement를 리턴한다. JSX는 바벨에 의해서 React.createElement(component, props, ...children) 함수로 트랜스파일된다. html 처럼 생긴 문법을 리액트 라이브러리의 렌더링 함수로 변환하는것이다. 그래서 JSX를 사용하지 않고도 리액트를 사용할 수 있으나(JSX없이 사용하는 React) 이렇게 하면 매우 불편하다. // jsx Hello {this.props.toWhat} JSX는 아래 처럼 변경된다. // transpile ..

React 2020. 5. 21. 14:22
이전 1 다음
이전 다음
공지사항
  • Email : simsimjae@naver.c⋯
  • BOJ : simsimjae
  • GitHub : www.github.com/s⋯
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG
  • promise
  • reactdom
  • react hooks
  • es6
  • reducer
  • design system
  • Action
  • computed
  • props
  • await
  • type alias
  • async
  • storybook
  • rendering scope
  • hydrate
  • Next.js
  • atomic design
  • Polyfill
  • useRef
  • state
  • webpack
  • Babel
  • javascript
  • mobx
  • return type
  • react
  • useEffect
  • server side rendering
  • typescript
  • reflow
more
«   2026/05   »
일 월 화 수 목 금 토
1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31
글 보관함

Blog is powered by Tistory / Designed by Tistory

티스토리툴바