안녕하세요 오늘은 React createElement 함수를 까보았습니다. 리액트 컴포넌트가 사실은 자바스크립트 객체를 리턴하고 있었다는 사실?! 알고 계셨나요? 🤔

리액트 컴포넌트는 바벨을 만나서 createElement 함수가 됩니다. 이 함수가 element 객체를 리턴하는 과정에 대해서 코드를 한줄한줄 까보면서 깊이 살펴보았습니다.


그럼 오늘도 화이팅입니다 👍


https://youtu.be/FZyZVwbaLIA?si=LuutCLiWc02TnMES


ref

- https://goidle.github.io/react/in-depth-react-reconciler_1/

[React 까보기 시리즈] React component 가 return 하는 html 은 babel 을 만나서 어떻게 변할까?(createElement 함수 까보기)

www.youtube.com

[React 까보기 시리즈] React component 가 return 하는 html 은 babel 을 만나서 어떻게 변할까?(createElement 함수 까보기)

더 많은 콘텐츠를 보고 싶다면?

또는

이미 회원이신가요?

2023년 10월 18일 오후 1:22

 • 

저장 15조회 1,781

댓글 0

    함께 읽은 게시물

    공식적으로 뭐하는 회사인지는 모르지만 일단 100억달러 기업가치

    ... 더 보기

    무라티의 싱킹 머신즈, 20억달러 투자 유치..."실리콘 밸리 사상 최대 시드 투자"

    AI타임스

    무라티의 싱킹 머신즈, 20억달러 투자 유치..."실리콘 밸리 사상 최대 시드 투자"

    조회 389


    코루틴 Q&A

    코루틴에 대해 알아보아요 Q. 코루틴에 대해 쉽게 설명해주세요. A. 코루틴은 실행을 일시 중지하고 상태를 잃지 않고 호출자에게 다시 제어권을 양보할 수 있는 함수입니다. 이렇게 하면 기능이 나중에 재개되어 중단된 위치에서 다시 시작할 수 있습니다. 코루틴은 단일 스레드에서 여러 작업을 동시에 수행할 수 있도록 프로그래밍에 자주 사용됩니다. Q. 스레드와 비교해서 설명해주세요. A. 스레드는 다른 스레드와 동시에 실행할 수 있는 별도의 실행 경로입니다. 프로그램이 새 스레드를 생성할 때 일반적으로 별도의 스택 및 레지스터 세트가 제공되며 운영 체제는 스레드가 하나 이상의 CPU 코어에서 실행되도록 예약합니다. 이를 통해 여러 스레드가 동시에 실행될 수 있으므로 한 번에 둘 이상의 작업을 수행할 수 있으므로 프로그램의 성능이 향상될 수 있습니다. 대조적으로, 코루틴은 실행을 일시 중지하고 상태를 잃지 않고 호출자에게 제어권을 다시 양보할 수 있는 함수입니다. 이렇게 하면 기능이 나중에 재개되어 중단된 위치에서 다시 시작할 수 있습니다. 스레드와 달리 코루틴은 일반적으로 단일 스레드에서 실행되며 동일한 스택 및 ... 더 보기

     • 

    저장 14 • 조회 1,296


    예제로 뿌수는 코틀린 Kotlin 프로그래밍 76제

    안드로이드 네이티브 앱 개발의 표준 언어이자, 최근 백엔드 개발에도 공격적으로 활용되고 있는 코틀린 프로그래밍 언어를 다양한 예제를 통해 배울 수 있는 온라인 학습 사이트를 공개합니다. 코틀린 공식 홈페이지에 있는 Kotlin By Example이라는 자료는 편역해서 구성했어요. 저는 NHN에 근무할 때 코틀린을 백엔드 API서버 개발에 활용한 경험이 있는데, 자바로 개발할 때보다 훨씬 편하고 즐거웠던 게 기억에 남았습니다. 코틀린을 배우시려거나, 이미 쓰고 있는데 궁금한 점이 많으셨던 분들에게 유용한... 더 보기

    예제로 격파하는 코틀린

    Hatemogi

    예제로 격파하는 코틀린

     • 

    저장 42 • 조회 2,406


    Next.js 까보기: "쓸 줄 아는 개발자"에서 "알고 쓰는 개발자로" 강의를

    ... 더 보기

    Next.js 까보기: "쓸 줄 아는 개발자"에서 "알고 쓰는 개발자"로

    www.productengineer.info

    Next.js 까보기: "쓸 줄 아는 개발자"에서 "알고 쓰는 개발자"로

     • 

    저장 8 • 조회 757



    혹시 Cursor 채팅만 사용하시나요? Agent 쓰는 방법!

    Cursor와 함께라면, 더이상 에디터는 단순한 입력 도구가 아닌

    ... 더 보기