RSC From Scratch. Part 1: Server Components · reactwg/server-components · Discussion #5
GitHub
이 글은 React Server Components(RSC)를 기술적으로 자세히 살펴보기 위해서 RSC를 아주 간소화한 버전을 직접 만드는 방법을 설명한 글로 React에서 유명한 Dan Abramov가 작성한 글입니다.
RSC를 살펴보는 글로 RSC의 장점이나 RSC로 어떻게 앱을 만드는지를 설명하는 것이 아니라 직접 RSC를 만들어 보면서 RSC를 어떻게 만드는지 이해할 수 있도록 의도된 글입니다.
RSC를 설명하기 위해서 node.js에서 스트링 인터폴레이션으로 HTML을 내려주는 간단한 서버를 구성하고 이를 스트링 인터폴레이션 대신 JSX로 구현한 뒤 HTML로 내려주도록 작성하면서 JSX를 만드는 과정을 보여줍니다. 이를 지금 React에서 쓰듯이 컴포넌트를 만들고 서버이므로 라우팅을 추가해서 웹페이지를 보여주도록 합니다.
라우팅 이동 중에도 상태를 저장하게 하고 클라이언트에 JSX 업데이트를 클라이언트에 적용할 수 있게 구현하고 서버를 SSR 서버와 RSC 서버로 나누어서 최종적으로 RSC를 완성시킵니다. 각 단계에서 직접 돌려볼 수 있는 코드를 제공하고 있기에 하나씩 따라해 보고 테스트해보면서 살펴볼 수 있고 마지막에 직접 시도해 볼만한 아이디어도 제공하고 있습니다.
https://github.com/reactwg/server-components/discussions/5
다음 내용이 궁금하다면?
이미 회원이신가요?
2023년 6월 29일 오후 5:18
댓글 0
함께 읽은 게시물
무너지고 있는 프론트엔드, 백엔드 직군의 경계에 대한 고찰
AI 기술이 우리 일상과 산업 전반에 스며들면서 소프트웨어 개발 환경 역시 큰 변화의 물결을 맞이하고 있다. 특히 코딩을 돕는 AI 에이전트의 등장은 개발 생산성에 대한 큰 변화를 만들고 있다. 나 역시 이러한 변화를 체감하며, 나에게 익숙한 소프트웨어 개발의 대표적인 두 축인 프론트엔드와 백엔드 영역에서 AI 기술이 미치는 영향과 그로 인해 변화하는 소프트웨어 엔지니어의 역할에 대해 개인적인 생각을 정리해 본다.
... 더 보기
What's new in UIKit (feat. WWDC 2025)
이
... 더 보기제가 리드하고 있는 조직(당근마켓 커뮤니티실)에서 백엔드 엔지니어를 채용 중이에요.
커뮤니티실에는 동네 이웃들의 이야기와 정보를 공유하는 동네생활팀, 이웃 간의 취미와 관심사를 연결하는 모임팀, 그리고 아파트 단지 생활을 더 편리하고 즐겁게 만들어 줄 단지팀이 있어요. 지금 내 동네에서 일어나고 있는 일들을 더 쉽게 즐기고 공유할 방법들을 찾는 일이라면 무엇이든 도전하여 실행에 옮겨요. 만드는 사람이 불편할수록 쓰는 사람은 편하다는 믿음으로 도전적인 문제를 풀어나갈 분과 함께하고자 해요.
... 더 보기이력서 팁: 문제를 해결한 경험, 이렇게 써봐요!
안
... 더 보기실력 향상을 위한 해외 유튜브 채널 10개
취업 준비와 코딩 공부할 때 도움 되는 해외 유튜브 채널 10개를 간략하게 소개합니다.
1. Gaurav Sen: https://www.youtube.com/@gkcs
- 전반적인 개발자 성장(특히 주니어와 시니어), 취업, 코딩 공부 노하우
- 시스템 설계의 기초 개념 설명 영상이 많다. 특정 시스템 설계를 분석하거나 모의 면접하는 영상이 꽤 많지만 개인적으로 설명이 겉도는 느낌이 있다
- 주니어+/중니어+에게 특화된 취업 및 공부 노하우
2. Abdul Bari(컴공 전공, 알고리즘 공부 필수 채널): https:... 더 보기
