software

왜 나는 모든 것을 React Native로 래핑하기 시작했는가?

발행: (2026년 2월 6일 오후 01:10 GMT+9)
6 min read
원문: Dev.to

Source: Dev.to

React Native에서 모든 것을 래핑하기 시작한 이유에 대한 표지 이미지

🚀 나는 이제 React Native를 약 4년 정도 사용해 왔으며, 그 과정에서 힘들게 배운 것이 있다:

  • 영구적인 것은 없다.
  • 라이브러리는 폐기된다.
  • 베스트 프랙티스는 변한다.
  • 작년에 “추천”되던 것이 오늘은 갑자기 잘못된 것처럼 느껴진다.

어느 순간 나는 스스로에게 물었다:

왜 라이브러리가 바뀌었다는 이유만으로 같은 문제를 반복해서 고치고 있는 걸까? 🤔

내가 계속 보던 패턴

솔직히 말하자면, React Native 앱은 금방 사라지지 않는다. 몇 년씩 살아남는다.
그 기간 동안:

  • FlatList는 성능 문제가 생기기 시작한다.
  • FlashList가 등장하고 새로운 표준이 된다.
  • react-native의 SafeAreaView만으로는 충분하지 않다.
  • 우리는 react-native-safe-area-context로 옮긴다.

갑자기 수십 개의 파일을 건드려야 하는 하나의 결정 변경이 된다.

그때 나는 깨달았다 — 실수는 라이브러리 선택이 아니라, 내 앱이 그에 너무 의존하고 있었다는 점이다.

지금 따르는 간단한 규칙

  • 코어 혹은 서드파티 컴포넌트를 앱 전체에서 직접 사용하지 않는다.
  • 한 번만 래핑하고, 직접 소유한다.

나는 기본 컴포넌트들의 최상위 레이어를 만들기 시작했다.

예시 1: 리스트 (FlatList → FlashList)

중단한 방식

FlatList를 어디서든 직접 사용:

import { FlatList } from 'react-native';

이제 하는 방식: AppFlatList

// AppFlatList.tsx
import React from 'react';
import { FlatList, FlatListProps } from 'react-native';

export function AppFlatList(props: FlatListProps) {
  return (
    
  );
}

사용법은 그대로 간단하다:

 item.id}
/>

이제 성능 문제가 생기면 (분명 생길 것이고) 당황하지 않는다.

나중에… FlashList로 교체

// AppFlatList.tsx
import { FlashList, FlashListProps } from '@shopify/flash-list';

export function AppFlatList(props: FlashListProps) {
  return ;
}

그게 전부다. 화면을 바꾸지도, 주말에 리팩터링도, 스트레스도 없다.

예시 2: 기본 컴포넌트 폐기 (SafeAreaView)

예전엔 모두 이렇게 사용했다:

import { SafeAreaView } from 'react-native';

나중에 “react-native-safe-area-context를 사용하라”는 말을 들었다.

이제 SafeAreaView가 곳곳에 사용된다고 상상해 보라—고통스럽지 않은가?

// AppSafeAreaView.tsx
import React from 'react';
import { SafeAreaView } from 'react-native-safe-area-context';

export function AppSafeAreaView({ children, style }) {
  return (
    
      {children}
    
  );
}

사용법:

이제 API가 바뀌든, 패딩 로직이 바뀌든, Android/iOS 동작이 달라지든 상관없다—나는 그것을 격리시켰다.

이것이 서서히 내 기본 스타일이 되었다

이제 거의 모든 것에 대해 이렇게 한다:

  • AppText → 폰트 스케일링, 타이포그래피 업데이트
  • AppButton → 디자인 시스템 변경
  • AppInput → 검증, 포커스 처리
  • AppImage → 캐싱, 플레이스홀더
  • AppPressable → 나중에 분석 훅 추가

매번 “그냥 바로 써도 될까?” 하고 머뭇거릴 때마다, 나는 그 결정을 얼마나 많이 후회했는지 떠올린다.

왜 중요한가 (솔직히 말해서)

React Native는 빠르게 진화한다. 앱은 그렇지 않다. 그래서 선택은 두 가지:

  • 매년 변화를 쫓아가 하거나,
  • 앱을 설계해 변화를 차분히 흡수하도록 하거나.

컴포넌트를 래핑한다고 해서 개발 속도가 느려지는 것이 아니다. 나중에 리팩터링하는 것이 느려진다.

마무리 생각

이것은 과잉 엔지니어링이 아니다. 변화가 보장된다는 사실을 존중하는 것이다.

나는 오늘 문제가 생길까 봐 컴포넌트를 래핑하는 것이 아니라, 미래의 나가 피곤해질 것을 대비해 래핑한다.

솔직히? 미래의 나는 더 나은 대우를 받을 자격이 있다.

Back to Blog

관련 글

더 보기 »