My Boundary As Much As I Experienced

문제 상황현재 ANTTIME의 초대 링크를 통해 앱을 설치 했을 때 초대한 사람이 추천인으로 안 뜨고 있었다...전임자 분들이 구현한 로직으로는,앱이 설치 안 되어 있음 ->  ios/android 각각 마켓에 보내기앱이 설치 되어 있음 -> 앱 실행까지는 가능했는데...앱이 설치 안 되어 있음 ->  ios/android 각각 마켓에 보내기 -> 앱 실행 - 회원가입 시 추천인 코드가 입력되어 있기!이게 안 되는 것이다. 이런 기능을 구현하려면 디퍼드 딥링킹이라는 기술이 필요하다. 디퍼드 딥링킹을 직접 구현하려면 어떻게 구현하나?1) 딥링크 생성마케팅 링크 또는 딥링크를 아래와 같은 형태로 생성https://example.com/app?utm_source=campaign&utm_medium=email&..

설계 배경UI 개발에서 버튼은 필수적인 컴포넌트 중 하나이다.하지만 단순한 기능처럼 보여도 버튼 컴포넌트를 잘 설계하는 것은 생각보다 까다로운 작업이다.다양한 상태, 크기, 색상, 아이콘 배치 등 요구사항을 충족하면서도 유지보수성과 재사용성을 고려해야 하기 때문이다. 이번에 디자이너 분이 디자인 시스템을 본격적으로 만드시기 시작했는데 (내가 디자이너 시절에 만들었던 시안을 보고 작업하셨다ㅋㅋ..)다른 컴포넌트에 비해 버튼이 특히 매우 다양한 variants가 존재하는 걸 알 수 있다.이렇게 많은 variants들은 단순 prop들로만 관리하기 힘들었고, 나는 대안으로 컴파운드 컴포넌트 패턴을 활용하기로 했다. 이번 글에서는 컴파운드 컴포넌트 패턴과 디자인 시스템을 활용한 Button 컴포넌트를 어떻게 ..

배경오늘의 일기에 프리텐다드 폰트와 교보손글씨체2019 폰트를 스위칭 할 수 있는 기능을 만들었다.그러기 위해 일단 폰트를 리액트 네이티브에 추가하려고 했는데,웹처럼 웹폰트를 import하거나, global.css에 한 줄 추가로 해결이 안 되었다.(React Native에서 폰트 설정은 웹보단 조금 더 복잡함..) 하여튼 내가 경험해본 바로는 React Native에서 Text 컴포넌트에 커스텀 폰트를 적용하려면 다음 단계를 따르면 된다.1. 커스텀 폰트 파일 추가프로젝트에 폰트 파일을 추가한다..ttf 또는 .otf 파일 형식의 폰트를 프로젝트의 assets/fonts 폴더에 저장한다.2. react-native.config.js 파일 수정React Native가 폰트를 인식하도록 설정한다.프로젝트 ..

고차 컴포넌트와 컴파운드 컴포넌트 비교와 활용React를 사용하다 보면 컴포넌트 구조를 설계하는 방법으로고차 컴포넌트와 컴파운드 컴포넌트라는두 가지 패턴을 만나게 됩니다. 이 글에서는 두 패턴의 개념, 사용 사례, 그리고 장단점을 비교해 보며,각각을 언제 선택하면 좋은지 살펴보겠습니다.  고차 컴포넌트(Higher-Order Components)개념고차 컴포넌트(HOC)는 하나의 컴포넌트를 인자로 받아 새로운 컴포넌트를 반환하는 함수입니다.React에서 로직 재사용성을 높이기 위해 사용되는 패턴입니다.const withLoading = (WrappedComponent) => { return (props) => { if (props.isLoading) { return Loading...; ..

보호되어 있는 글입니다.

보호되어 있는 글입니다.

보호되어 있는 글입니다.

보호되어 있는 글입니다.

보호되어 있는 글입니다.

보호되어 있는 글입니다.