프라이빗 멤버십을 진행하면서, 앱 개발에 대해 잘 모르시는 분들을 위해 참고 자료를 작성해 보았습니다. 입문자분들께 아래 블로그 글이 도움이 되시길 바랍니다.

블로그 글​

• 개발 입문자를 위한 안내 문서
• 리액트네이티브 입문 1 - 타입스크립트
• 리액트네이티브 입문 2 - 리액트
• 리액트네이티브 입문 3 - 스타일

이 자료들은 한국어로만 작성되었습니다만, 영문 번역이 필요하시면 crossplatformkorea@gmail.com으로 이메일을 보내주시기 바랍니다.

해당 밋업에서는 7년 간의 Expo 변천사를 알아보고 최신 Expo의 변화와 현황을 알아봅니다. 또한, Expo의 최신 기능인 EAS와 Dev Client에 대해서도 소개하며, Expo를 사용하면서 마주한 어려움과 해결 방법에 대해 이야기 합니다.

우리의 추억​

이번 컨퍼런스에서는 'tRPC'의 소개와 그 사용법을 중심으로 깊이 있는 내용을 다루었습니다. tRPC는 End-to-end typesafe API를 더욱 효율적으로 구축할 수 있게 도와주는 기술로, 이를 통해 프로젝트 구현이 어떻게 간소화될 수 있는지에 대한 구체적인 방법들이 소개되었습니다.

특히 AI 영어교육 스타트업 '세타원코리아'의 김찬우 대표와 신은수 전 Tech Lead의 발표가 눈에 띄었습니다. 그들은 tRPC를 활용하여 프로덕트를 개발하면서 겪었던 경험과 노하우를 풍부하게 공유했습니다. 이는 세타원이 초기 MVP를 성공적으로 출시할 때 tRPC가 어떠한 역할을 했는지에 대한 실제 사례를 통해 이해할 수 있게 도와주었습니다.

김찬우 대표는 이전에 LXPER에서 진행한 AI 영어 학습 관련 특허에 대한 이야기를 나누었고, 신은수 전 Tech Lead는 다양한 스타트업에서의 경험을 공유하며 tRPC의 유용성을 강조하였습니다.

무엇보다도, 이번 컨퍼런스는 다양한 토론과 QnA 시간이 풍부했습니다. 참석자들의 열정적인 참여와 깊이 있는 질문들로 인해 어느 때보다 풍성하고 생생한 토론의 장이 펼쳐졌습니다.

이번 컨퍼런스를 통해 tRPC의 중요성과 실제 활용성에 대해 명확하게 인식할 수 있었습니다. 발표자들의 경험과 노하우는 tRPC가 실무에서 어떻게 적용될 수 있는지를 명확히 보여주었고, 특히 세타원코리아의 사례는 tRPC 활용의 구체적이고 성공적인 모습을 잘 보여주었습니다.

마지막으로, 이번 컨퍼런스에 참석해주신 모든 분들께 진심으로 감사의 인사를 드립니다. 앞으로의 행사에서도 이와 같은 유익한 정보와 경험을 계속해서 공유하길 기대합니다!

7월 밋업에는 깜짝 블록체인 세미나가 있었습니다. 현재 블록체인 트랜드와 샘 알트먼의 야심작 월드코인에 대해서도 알아볼 수 있는 유익한 시간이었습니다. 그리고 5일 후인 24일에 상장 발표를 하니 많이들 놀라신 것 같습니다 😅

특히 두부 앱에서 미션 참여하여 발표에 대한 리뷰에 참여해주셔서 더욱 유이한 시간이었습니다.

현장사진은 인스타그램에서 확인해주세요.

Hermes는 Facebook에서 개발한 오픈 소스 JavaScript 엔진으로, 특히 React Native 앱의 시작 시간을 개선하기 위해 설계되었습니다. 2019년 React Native 0.60.4에서 처음 도입되었습니다.

리액트 네이티브 앱은 대게 JavaScript를 사용하여 작성되며, 이 코드는 장치에서 실행되기 전에 JavaScript 엔진을 통해 해석됩니다. 이전에는 대부분의 리액트 네이티브 앱들이 JSC (JavaScriptCore)를 사용하여 코드를 해석했습니다. 하지만 Facebook은 특히 모바일 앱에서의 성능 향상을 목표로 Hermes를 도입했습니다.

Hermes의 주요 특징과 장점은 다음과 같습니다:

1. 빠른 시작 시간: Hermes는 바이트코드로 컴파일된 JavaScript를 직접 실행하므로 앱의 시작 시간이 향상됩니다.
2. 낮은 메모리 사용량: Hermes는 메모리 사용량을 최소화하는 설계로 되어 있어, 앱의 전반적인 메모리 소비량을 줄일 수 있습니다.
3. Optimized for React Native: Hermes는 리액트 네이티브와 함께 사용하기 위해 최적화되어 있어, 일반적인 리액트 네이티브 작업들에 대한 성능 향상을 기대할 수 있습니다.

더 알아보고 싶으시면 Hermes 엔진이란? 블로그를 확인해보세요.

React Native Architecture는 React Native 애플리케이션의 내부 구조와 동작 원리를 설명하는 용어입니다. React Native의 초기 아키텍처는 몇 가지 주요 구성 요소로 구성되었으며, 시간이 지나면서 개선과 업데이트가 이루어져 애플리케이션의 성능과 안정성을 향상시켰습니다. 2021년까지의 정보를 기반으로 설명하겠습니다.

1. Bridge: React Native의 초기 아키텍처의 핵심 요소였습니다. Bridge는 JavaScript 스레드와 Native 스레드 간의 통신을 가능하게 했습니다. JavaScript에서 생성된 UI 업데이트, 이벤트 등을 Native 코드로 전송하는 역할을 합니다.

2. JavaScript Core (JSC): iOS에서 사용되는 JavaScript 엔진입니다. Android에서는 JSC를 포함하여 번들에 포함시켜 배포합니다.

3. Native Modules: React Native 애플리케이션에서 기기의 Native 기능에 접근할 수 있게 해주는 모듈입니다. 예를 들면, 카메라, GPS, 파일 시스템에 접근할 수 있습니다.

그러나 Facebook은 React Native의 성능과 유연성을 향상시키기 위해 아키텍처를 계속 개선하고 있습니다. "Fabric" 및 "TurboModules"와 같은 새로운 아키텍처 업데이트가 도입되었습니다.

• Fabric: React Native의 UI 레이어를 재작성하는 프로젝트입니다. 이를 통해 더 빠른 UI 업데이트와 더 부드러운 애니메이션을 달성할 수 있습니다. Fabric은 JavaScript와 Native 간의 통신을 최소화하여 성능을 향상시킵니다.

• TurboModules: Native Modules의 재작성 버전으로, JavaScript 스레드와 Native 스레드 간의 통신 성능을 향상시킵니다.

새로운 아키텍처의 도입은 React Native 애플리케이션의 성능을 향상시키며, Native와의 통합을 더욱 원활하게 만들기 위한 것입니다.

리엑트 네이티브 새로운 아키텍쳐에 대해서 더 자세히 알아보세요.

6월 밋업에서는 5월에 진행한 UI 컴포넌트에 대한 고찰을 이어, 이번에는 라이브 코딩 세션을 진행하였습니다. 버튼보다는 조금 더 복잡하고, 고려해야 할 사항이 많은 Accordion 컴포넌트에 대해 다뤘습니다.

몇년 만에 다시 밋업에 라이브 코딩을 해보게 되었습니다. 혹시라도 밋업에서 동일하게 진행해보고 싶으신 분은 150,000원의 발표비를 별도로 제공해드립니다. 아래 동영상에서 볼 수 있듯이, 두려움을 주는 분위기가 아닌, 서로 배우고 돕는 분위기입니다. 편안하게 지원해 주시기 바랍니다.

발표 지원서

감사합니다.

현장 사진​

발표 일부분 동영상​

• UI 컴포넌트 라이브 코딩 - 1편 (Feat. Accordion)
• UI 컴포넌트 라이브 코딩 - 2편 (Feat. Accordion)

5월 밋업에서는 글쓴이가 UI 컴포넌트에 대한 고찰 그리고 디자인 시스템에 대해서 1시간 가량 발표를 진행했습니다.내용은 전반적으로 우리가 많은 UI 컴포넌트를 개발하면서 놓지는 중요한 요소들에 대한 설명들을 하였고 UI 컴포넌트 디자인 원칙(사용자 중심, 일관성, 단순성, 피드백)에 따라 기능 세트를 정의하고 props를 작성해나가는 방법에 대해 알아보았습니다. 마지막으로 단순성을 유지하기 위해 가능한 뺄 수 있는 모든 프롭스나 스텝들을 줄여야 하는 것을 한번 더 각인시켰습니다.

마지막으로 리액트에서 inline style로 인한 리렌더 방지법을 쇼츠로 제공해드렸습니다. 유익하였으면 구독과 좋아요 알림 설정 부탁드립니다.

"완벽이란 더 이상 뺄 것이 없는 상태를 이야기한다"는 프랑스의 작가 앙투안 드 생텍쥐페리가 쓴 "리틀 프린스"에서 유래했다고 널리 알려져 있습니다. 이 구문은 정확하게 번역하면 "완벽함이란 더 이상 더할 것이 없는 것이 아니라, 더 이상 뺄 것이 없는 상태를 의미한다"라는 의미입니다. 이것은 기능과 디자인, 그리고 생활의 많은 측면에서 균형과 심플함의 중요성을 강조합니다.

저희는 발표자 분들께 $150불의 발표비를 지급드리고 있으며 발표 내용도 20~50분 자율적으로 캐주얼하게 제공해주시면 됩니다. 관심있으신 분은 발표 신청서를 통해 진행해주세요. 감사합니다 🙇🏻‍♂️

발표 영상 일부​

https://www.youtube.com/watch?v=Zbph_vQwGc0

4월 밋업에서는 2월 플러터 밋업에 이어서 마이크로소프트의 MAUI 관련 내용을 담았습니다. 우선 먼저 React Native 개발자로서 MAUI를 다룬 소감을 아이디어샘 박태성님이 공유해주셨습니다.

두번째로 Some other place의 김상현님의 발표가 이어졌습니다. 발표 제목은 MAUI, 네이티브 친화적 크로스 플랫폼, 이것이 그것입니다로 링크를 통해 발표 내용을 확인할 수 있습니다. MAUI가 React Native와 Flutter와 어떻게 다른지를 중점적으로 다루는 내용입니다.

저희는 발표자 분들께 $150불의 발표비를 지급드리고 있으며 발표 내용도 15~50분 자율적으로 캐주얼하게 제공해주시면 됩니다. 관심있으신 분은 발표 신청서를 통해 진행해주세요. 감사합니다 🙇🏻‍♂️

Florian Ludot은 Avanssion Inc.의 CTO로서, 개발자가 확장 가능하고 효과적인 서비스를 구축할 수 있도록 도와주는 도구인 Storybook을 소개하는 발표를 했습니다. 이번 발표에서는 초기 디자인 단계부터 구현 및 배포, 구성 요소 라이브러리 게시 및 통합에 이르기까지 Storybook 워크플로우를 안내하였으며, UI 개발 프로세스를 혁신하고 프로젝트를 다음 단계로 끌어올릴 수 있는 팁과 모범 사례를 공유하였습니다.

Florian Ludot은 프랑스에서 태어나고 자랐으며, 일본에서 4년을 보낸 후 최근에는 서울로 이사한 개발자입니다. 그는 개발 및 디자인 팀과 긴밀히 협력할 수 있는 환상적인 기회를 가졌으며, 이 분야에 대해 더 배우고 싶은 모든 사람과 지식을 공유할 수 있어 항상 기쁘다고 말하였습니다.

밋업 영상은 https://www.youtube.com/watch?v=ICpn4JrnIHY 에서 확인해주세요.

3월 밋업 사진​