rn

오늘은 앱 아이콘을 설정해 보겠다. 간단하다. 1. 아래 링크를 이용하여 빈 공간에 로고를 드래그한 후 Generate 버튼을 누른다 위 과정을 거치는 이유는 현재 개발하는 앱을 아이폰, 아이패드, 애플워치, 맥북에서 사용할 수 있기 때문에 각각의 기기에 적합한 사이즈의 로고가 필요하기 때문이다. https://www.appicon.co/ 사진이 추출되면 아래 사진과 같이 AppIcons 폴더 속에 2개의 사진과 하나의 폴더가 들어있을 것이다. 두 개의 사진은 ios, android 개발 후 각각의 애플리케이션 스토어(앱스토어, 플레이스토어)에 배포 시 필요한 크기의 사진이다. 폴더 속의 사진들은 로고 사진을 크기별로 추출한 것이다. ex) 16.png는 16*16 사이즈의 로고 2. Xcode에서 아이..

Splash Screen이란 무엇인가? 애플리케이션 실행 시 애플리케이션의 컨텐츠의 로딩이 완료될 때까지 일시적으로 보여주는 화면을 의미한다. 자 이제 splash screen을 설정해 보겠다. 1. 프로젝트 폴더 경로에서 터미널을 열어 아래 명령을 입력한다. 해당 과정은 splash screen 설정을 위한 라이브러리 설치 과정이다. npm i react-native-splash-screen --save 2. 설치가 완료되었다면 아래 명령을 입력한다. 여기서 주의할 점. 본 글쓴이는 IOS를 이용하기 때문에 입력하는 것이다. npx pod-install 3. App.tsx를 열어 아래와 같은 코드를 추가해 준다. import SplashScreen from 'react-native-splash-scre..

프로젝트 시작을 위해 개발 환경을 세팅했다. 내가 선택한 것은 create-react-natvie-app이다 Expo 사와 Meta 사의 협업으로 React Native, Expo 라이브러리 모두 사용 가능하다. 요번에 출시 할 앱의 높은 완성도와 퀄리티를 위해 선택했다. 이제부터 개발 세팅 단계를 설명하겠다. 1. 프로젝트를 설치할 폴더에서 터미널을 열어 아래 명령어를 입력한다. npx create-react-native-app 2. 아래와 같은 화면이 나오면 개발할 앱의 이름을 입력한다. 3. 앱 이름을 입력했다면 Default new app을 선택한다. 4. 아래와 같이 해당 과정들이 실행되며 프로젝트 파일들이 생성된다. 5. 설치가 끝나면 아래와 같은 화면이 나온다. 3가지 실행 옵션 중 자신의 ..