12P by xguru 8일전 | favorite | 댓글과 토론
  • Belt는 새로운 React Native 앱을 시작할 때 추측을 배제하도록 설계된 opinionated CLI 도구
  • 오랫동안 실전에서 검증된 모범 사례와 도구를 기반으로 많은 결정을 내려줌
  • Belt는 아직 개발 초기 단계에 있고 API가 변경될 수 있지만, 커뮤니티에서 살펴볼 준비가 되었다고 생각

Belt가 무엇을 구성해주는가?

  • Belt로 새 앱을 시작하면 다음이 설정됨:
    • Expo: 플랫폼 간 개발 및 테스트를 간소화함
    • ESLint & Prettier: 코드를 깨끗하고 일관되게 유지함
    • TypeScript: 정적 입력을 추가하여 초기에 오류를 잡는 데 도움이 됨
    • Jest & React Native Testing Library: 앱 테스트를 위한 견고한 기반을 제공함
    • MSW: 네트워크 요청을 모의실험하여 API 테스트를 단순화함
    • 하단 탭이 있는 React Navigation: 검증된 설정으로 탐색을 시작할 수 있음
    • REST API용 Tanstack Query: REST API에 대한 강력한 데이터 가져오기 및 캐싱. GraphQL용 Apollo Client는 준비 중임
    • 전역 상태를 위한 Redux Toolkit: 앱 전체의 상태 관리를 단순화하기 위해 곧 제공될 예정임
  • 또한 프로젝트 설정 중에 포함될 수 있는 선택적 도구 세트를 포함하여 생성된 앱을 특정 사용 사례에 더 잘 적응시킬 계획임
  • 이를 통해 시작부터 고유한 요구 사항에 맞게 앱을 조정할 수 있음

Belt 사용 방법

  • 개발자들은 선호하는 도구가 있으며, 패키지 관리자도 예외는 아님
  • Belt는 npm, Yarn, pnpm, Bun 등 선호하는 패키지 관리자와 원활하게 작동하도록 설계되었음
  • 이러한 유연성 덕분에 Belt가 제공하는 간소화된 설정의 이점을 누리면서도 가장 편안한 워크플로우를 고수할 수 있음
  • Belt를 사용하여 React Native Expo 앱을 생성하려면 선호하는 패키지 관리자를 사용하여 다음을 실행하면 됨:
# NPM 사용  
npx create-belt-app MyApp  
  
# Yarn 사용   
npx create-belt-app MyApp --yarn  
  
# pnpm 사용 (실험적)  
npx create-belt-app MyApp --pnpm  
  
# Bun 사용 (실험적)  
npx create-belt-app MyApp --bun  
  • Belt로 프로젝트를 만들면, 최소한의 노력으로 앱의 기능을 확장할 수 있는 핸들을 추가함
  • 예를 들어 푸시 알림 기능을 추가하려는 경우 Belt는 앱에 알림을 표시하는 데 필요한 코드를 주입하여 프로세스를 단순화함
  • 알림 서비스 구성과 같은 코드 외부 설정을 처리하기만 하면 됨. 다음 처럼:
# Yarn 사용  
yarn belt add notifications  
  
# NPM 사용  
npx belt add notifications  
  
# PNPM 사용  
pnpm belt add notifications  
  • Belt는 React Native 앱을 시작하고 개선하는 프로세스를 단순화하고 표준화하므로 설정에 시달리지 않고 멋진 앱 구축에 집중할 수 있음