리액트네이티브

마침내 앱 스토어에 앱 'T.o.T'가 출시되었다.  expo를 사용해서 빌드한 app이 앱스토어에 릴리즈 된 과정을 상세히 기록해두고 싶다는 욕심이 들었지만 한 단계씩 밟아갈수록 터지는 분노에 머리가 하얗게 변해서 기록을 많이 못 남긴 것 같다. 우선 앱을 제작하고 출시하면서 느낀 것들을 적어보려고 한다.  앱 제작하게 된 계기T.o.T의 시작은 단순하게 '하루에 30분은 집중해서 책을 읽어야겠다' 라는 다짐이었다. 스톱워치로 하루 동안하는 다양한 활동에 대한 시간을 기록해 보자는 취지였고 그 첫 스텝은 nextjs로 제작한 웹 플랫폼이었다. 어차피 내가 쓸 거니깐 필요한 기능을 더해서 빠르게 제작했고 계속 브레인스토밍을 하면서 목표를 잡아갔다. 어느 정도 내가 원하는 기능을 더한 결과물이 나왔고 처음..

만들고 싶은 앱이 있어서 리액트 네이티브를 설치하려고 하는데, ( -> 조만간 앱 구현 과정을 올릴 예정임돠) 계속 안 되는것이다!!!! 지져스.... 왜 안되는 것인지 이해불가. 필요한 모든 프로그램들을 설치해놨는데, 이때 뜬 에러 코드를 구글링해봤다. 넘나 다양한 곳에서 발견된 이 에러 알고보니 -g 를 붙여서 전역으로 설치를 하기 때문에 생기는 에러라고 한다. 이런 명령어를 쓸 때는 sudo를 앞에 붙여주면 된다. 이때. 컴의 비번을 적으라고 한다. 적어주면 해결~~~~! ---------------------------------------------------------------------- 위에 글을 올린지 1-2시간 만에 정정한다. global 로 react-navtive 설치 하지 마세욤..

[React Native] React Nativgation 적용하기 - 1 react native cli로 빌드해서 expo로 install을 해도 되지만 npm이라는 자바스크립트를 위한 패키지 관리자를 사용했다. npm install @react-navigation/native npm install react-native-screens react-native-sa.. mindevlog.tistory.com 1편에 이어서 bottom tabs 메뉴와 stack 메뉴를 함께 사용하는 법을 설명하려고 합니다! 어플리케이션에서 두가지 메뉴가 따로따로 사용될 일은 없겠지요? 폴더구조 Nav -Tab -Stack Screen -Movie -Tv -Search NavigationContainer 에 두 메뉴를 모두..

react native cli로 빌드해서 expo로 install을 해도 되지만 npm이라는 자바스크립트를 위한 패키지 관리자를 사용했다. npm install @react-navigation/native npm install react-native-screens react-native-safe-area-context 공식 문서 (https://reactnavigation.org/docs/getting-started/) 를 보면 잘 설명되어있다! Mac에서 IOS 빌드를 위한 무언가를 설치해야하는데 나는 해당사항이 없어서 스킵! 1. NavigationContainer 상위 navigator를 감싸는 적어주는 container를 써줘야한다. navigator에 더해서 쓸 수 있는 props들이 있는데 나..

AppLoading 언제 쓰느냐? 사용자가 앱을 실행하면 데이터를 불러오기 시작하는데, 이때 시간이 많이 걸릴수도 있고 이 데이터를 기다리는 동안 사용자가 그 과정을 볼 수도 있을 것이다. 이런 부분을 보완하기 위해서 있는게 AppLoading이다 사용자 경험적인 부분을 보완하기 위해서 사용하는 것이다. 어떻게 보이느냐 로딩이 완료될 때까지 아이콘이라던가, 이미지라던가 대체를 할 수 있는 무언가를 보여준다. AppLoading Props 다양한 Prop이 있는데, 이를 이용해서 api호출 등 다양한 부분에서 활용할 수 있다. startAsync (function) : Promise를 반환하는 함수를 전달하는데 AppLoading이 시작될 때 실행된다. onError (function) : 데이터를 로드할..

리액트 네이티브란? 리액트 네이티브(React Native)는 iOS와 안드로이드 앱 개발을 위한 라이브러리입니다. 자바스크립트로 구현된 기존의 모바일 앱들은 웹뷰를 이용한 하이브리드 방식이였습니다. 하지만 리액트 네이티브는 자바스크립트로 개발하지만, 화면 인터페이스는 네이티브 위젯으로 컴파일하여 빌드됩니다. 리액트 네이티브는 네이티브 UI를 사용하여 빠른 사용자 경험을 제공합니다. 개발환경 안드로이드 앱을 만들고 있다면 안드로이드 스튜디오를 다운 받아야합니다. 그리고 컴퓨터에 java를 다운받아야합니다. 시뮬레이터도 다운받아야하고요. 정말 받아야하는 소프트웨어가 많습니다. IOS도 Xcode를 다운받아야하고요. 하지만 저는 다 생략을 하고 프로토타이핑과 테스트를 목적으로 만들어진 간단한 툴을 이용할 것..