자체 어플개발을 하면서 네이티브로 개발하거나 웹앱, 하이브리드 앱등 여러가지 방식 중 어떤 것을 결정하면 좋을지 고민을 하다가 expo 프레임워크를 이용하기로 하였습니다. expo프레임워크는 하이브리드 앱으로 expo로 개발했을시 조금더 쉽게 ios 어플이나, android 어플 개발하기가 쉬워진다는 이야기가 있었습니다. 그래서 expo를 결정하게 되었고, expo에 대해 깊이 정리를 해볼예정입니다.
Expo
Expo 프레임워크란 React Native를 조금 쉽게 만들 수 있게 도와주는 프레임워크입니다. RN(React Native)도 똑같이 하이브리드 앱으로 작동하며, RN or Expo 개발시 ios와 android어플을 더 쉽게 제작을 할수있습니다. 원래는 네이티브로 개발 할 때는 android와 iso 언어가 각각 다르기 때문에, 개발언어 2개에 맞춰서 공부해줘야하며, 세팅환경도 다 다르기에 Navtive로 개발하기에는 시간이 많이 걸립니다. 그래서 요즘 추세는 하이브리드 앱으로 개발로 많이 하기도 합니다.
하이브리드 앱 RN의 구조는 다음시간에 알려드리도록 하겠습니다.
Expo
Expo is an open-source platform for making universal native apps for Android, iOS, and the web with JavaScript and React.
expo.dev
Expo 세팅
우선 세팅을 하기위해서는 Node.js 설치가 필요하며, npx를 이용하여 expo 프로젝트를 생성해줍니다.
npx create-expo-app my-app
Node.js랑 npm, npx가 세팅이 되어있다면, 바로 작동이 될것입니다. 만약에 안된다고 하시면 환경변수 설정 꼭 체크하시고 다시 확인해보시기 바랍니다.
그러면 아래의 이미지처럼 프로젝트가 생성이 되며, 여기 프로젝트에서 나머지 부분을 세팅하면 완료입니다.
그리고나서 테스트해볼 ios나 android에서 꼭 설치해야할 어플이이 있는데, 아래의 이미지 어플입니다.
이걸이용하여 프로젝트를 미리보기로 테스트해보거나 어플의 기능을 테스트할때 Expo 어플 통해서 실행이 됩니다.
Expo 실행
그다음 아래의 명령어를 통해서 프로젝트를 실행해봅니다.
npx expo start
실행하게되면??
위에 이미지처럼 QR이 나오게되는데요??? 다들 테스트 하려고하는 ios 폰이나 android폰으로 QR를 찍어본다면 정상적으로 내가 만든 어플이 생산되는 것을 볼 수 있습니다.
처음으로 하이브리드 앱을 개발을해보고 싶거나, 어플을 간단하게 제작을 하고싶다라는 사람들에게는 Expo를 추천드립니다. 어플을 개발하면서 저는 Flutter 프레임워크나 RN, 코르도바를 이용해봤지 이렇게 간단한 Expo 프레임워크는 처음이였고, 사용하면서 아직까지는 불편한점이 없었습니다.
이야기듣기로는 Expo가 모두가 참여한 소스가 아니라 회사 소속으로 소스가 제작되어있기에 아직은 Expo 회사 소속에서 라이브러리나 업데이트를 안해준다면 마냥 기다려야하는 불편함은 있다고 이야기 들었습니다. 하지만 이런 불편한점도 Expo 쪽에서도 그냥 두지는 않을거라 생각하면 더욱 기대하면 Expo로 여러가지 어플을 제작해볼 예정입니다.
정보
- expo 어플을 사용하는 어플과 PC가 같은 네트워크망이여야 실행이 됩니다.!!!
초보이신분들은 한번 같은 네트워크망을 어떻게 연결하는지 찾아봐주세요 - https://expo.dev/ : 공식 문서
- https://snack.expo.dev/ : Expo 프레임 워크를 내 PC에 세팅안하고 바로 클라우드에서 실행해보는 사이트