당근마켓 웹뷰 프레임워크 Stackflow로 함께 간단한 웹뷰 만들어보기 | Hands-on Workshop
당근 밋업 당근 · YouTube
AI 핵심 요약
웹뷰에서 화면 전환과 상태를 구성하는 방법을 익히기 위해 Stackflow와 React로 간단한 앱을 만드는 핸즈온을 진행했다. StackBlitz에서 개발 환경을 준비하고 기본 렌더러·UI 플러그인을 연결한 뒤, 액티비티를 등록하고 초기 화면을 설정해 파라미터가 있는 화면까지 구현했다. `useFlow`의 `push`, `replace`, `pop`으로 화면 간 이동을 만들고, 타입 기반 액티비티 정의로 이름과 파라미터 오류를 줄이는 방식을 살펴봤다. 마지막에는 전환 상태와 플러그인 라이프사이클 훅을 활용해 UI 동작과 앱 기능을 확장하는 구조를 확인했다.
- Stackflow는 화면 UI 자체보다 스택 내비게이션 상태와 액티비티 전환을 관리하는 라이브러리다.
- 액티비티 이름과 파라미터를 타입으로 선언하면 화면 이동 시 오타와 잘못된 인자를 컴파일 단계에서 확인할 수 있다.
- push, replace, pop을 구분해 화면을 쌓거나 교체하거나 이전 화면으로 돌아가는 흐름을 구성한다.
- 액티비티의 전환 상태를 활용하면 기본 UI와 다른 애니메이션이나 스와이프 동작도 직접 구현할 수 있다.
- 플러그인 인터페이스와 라이프사이클 훅을 이용하면 기존 액티비티 코드를 바꾸지 않고 앱 전반의 기능을 확장할 수 있다.
소개
🥕당근마켓 웹뷰 프레임워크 Stackflow로 당근마켓의 토니와 함께 간단한 웹뷰 만들어보는 핸즈온 워크샵을 가졌습니다. 📎아래 링크에서 Stackflow를 확인해 보세요. https://stackflow.so https://github.com/daangn/stackflow
비슷한 학습 자료
컨퍼런스 당근 밋업
프레임워크부터 플랫폼까지: 당근 웹뷰 플랫폼 | 2024 당근 테크 밋업
컨퍼런스 당근 밋업
당근마켓 성장과 함께 쌓아온 안정적인 인프라 구축과 운영 노하우를 당근마켓 SRE 팀에서 공유합니다. 이번 SRE 밋업에서는 사내 개발자 플랫폼 개발과 관련된 다양한 세션을 준비했습니다. 🥕발표자료: https://daangn.notion.site/SRE-c62abc2b6f0347a4ace9ee9cdfc49b6b?pvs=4 🥕 당근 SRE에 지원하기: https://about.daangn.com/jobs/ * 1회 밋업 다시보기: https://youtube.com/playlist?list=PLaHcMRg2hoBqWWla-pCBSRqU-jSriiZHj * 2회 밋업 다시보기: https://youtube.com/playlist?list=PLaHcMRg2hoBqJRSlnE7Xw_QpVkf8u6ISH
데브옵스 · 인프라 클라우드
컨퍼런스 당근 밋업
2021 당근마켓 프론트엔드 개발자 채용설명회
컨퍼런스 당근 밋업
안녕하세요! 당근마켓 프론트엔드 챕터에서 처음으로 인사드려요. 행사에 참여하시면 당근마켓 프론트엔드 팀이 하는일과 현재 업무 방식, 비전과 목표에 대한 소개를 들어보실 수 있습니다. 회사 소개 후, 질문 답변 시간이 있어요. 이번 채용 라이브에서는 1400만 유저를 위한 서비스를 만드는 당근마켓의 프론트엔드팀에 대한 이야기를 나눠보고자 해요. 특히, 이번에는 기존에 없었던 인턴 포지션에 대해서도 소개드리려고 해요. 현재 당근마켓은 앱 기반 서비스이긴 하지만, 웹뷰를 활용한 웹 기술을 적극적으로 사용하고 있어요. 그래서 당근마켓 프론트엔드 개발자들이 진행하고있는 다양한 실제 프로젝트들을 소개드리고, 더 나아가서 저희 프론트엔드 팀이 어떻게 일하는지에 대해 소개드리려고 해요. 여러분이 준비해주신 질문들은 유튜브 라이브 채팅에 남겨주시면 답변드리도록 할게요! 😆
컨퍼런스 if kakao
복잡한 흐름 앞에서, 우리가 선택한 건 Funnel / 이었다
컨퍼런스 if kakao
if(kakao)25 복잡한 동선을 가진 웹뷰 서비스에서, 기획자와 개발자가 동일한 흐름을 바라볼 수 있도록 퍼널 중심의 구조화를 설계하고 useFlow로 구현한 경험을 소개합니다. #TECH #Frontend 카카오 비즈니스에서 FE를 담당있는 차재명(max.cha)입니다. 반복되는 불편을 줄이고, 개발자 경험과 팀이 몰입할 수 있는 환경을 만드는 데 관심이 많습니다. 발표자료 보기 📍https://if.kakao.com/2025/session?sessionId=39 if(kakao)25 홈페이지 : https://if.kakao.com/2025 #카카오 #kakao #이프카카오25
프론트엔드
컨퍼런스 SLASH
토스ㅣSLASH 23 - 퍼널: 쏟아지는 페이지 한 방에 관리하기
컨퍼런스 SLASH
매끄럽고 우아한 사용자 경험을 위한 개발자의 경험도 우아할 수 있을까요? 수많은 화면과 쏟아지는 분기를 효과적으로 관리하는 ‘퍼널’ 설계에 대해 소개합니다. 진유림 / 토스 Frontend Developer 발표 자료 👉🏻 https://bit.ly/3WZip27 토스 개발자 컨퍼런스 SLASH에 대한 자세한 정보는 👉🏻 https://bit.ly/43kW3tO 컨퍼런스 및 세션에 대한 문의는 👉🏻 slash@toss.im 토스에 합류하고 싶다면 👉🏻 https://toss.im/career/jobs #퍼널 #라이브러리 #frontenddeveloper #토스 #개발자컨퍼런스 #SLASH *본 발표자료의 저작권은 연사에 있으며, 저작권자의 사전 서면 동의 없이 자료의 일부 또는 전부를 이용하거나 배포할 수 없습니다. *또한 해당 자료를 복제하여 SLASH 행사 홈페이지를 제외한 온라인상에 게재하는 행위는 연사가 동의한 저작권 및 배포전송권에 위배됩니다....
프론트엔드
컨퍼런스 SLASH
거대한 모놀리식 Django 프로젝트에 현대적인 프론트엔드 인프라를 구축한 사례를 공유합니다. 어떻게 해야 오래된 코드 베이스를 대대적으로 수정하지 않으면서도, 최신 프론트엔드 기술들을 적극적으로 도입해나갈 수 있을지 고민한 경험을 공유합니다. 조유성 / 토스 Full Stack Developer 토스 개발자 컨퍼런스 SLASH에 대한 자세한 정보는 👉🏻 https://toss.im/slash-21 컨퍼런스 및 세션에 대한 문의는 👉🏻 slash@toss.im #토스 #개발자컨퍼런스 #SLASH
웹 개발 프론트엔드