최근 NativeScript + Vue3 로 하이브리드 앱을 개발하려고 준비하다가, 다양한 이슈 및 기술적 장벽에 부딪혀 결국은 ReactNative로 방향을 선회하고 스터디를 진행하고 있다. 최종 선택한 프레임워크 환경은 ReactNative + Expo 이다. CLI가 AOS/iOS 양쪽의 네이티브 소스 코드 수정도 가능하고 심도 있는 개발이 가능하다지만, 현재 개발할 앱의 경우 규모가 크지 않은 상태이고, 빠른 개발이 필요하며, 윈도우 환경에서도 iOS 가 커버되어야 하는 상황인지라 Expo 플랫폼으로 결정하였다. Expo 의 장점으로는 빠른 개발환경 셋팅과 수많은 필수/부가 기능이 잘 동작하는 라이브러리를 이미 갖추고 있다는 부분이다. 실제로 스터디를 해보니 가이드 사이트도 잘되어 있어서 큰 어려..

React Native를 공부해보며 겪었던 이슈들을 하나씩 정리해보고자 한다. Expo 플랫폼으로 진행하고 있으며, 최초 프로젝트 생성 후 기기에서 실행하는 부분에서 발생할 수 있는 이슈에 대한 얘기를 적어본다. https://docs.expo.dev/tutorial/build-a-screen/ Build a screen In this tutorial, learn how to use React Native components such as Image, Pressable, and Vector icons to build a screen. docs.expo.dev 위의 공식 홈페이지에서 기초 프로젝트를 코딩한 후 기기에서 실행하려고 야심차게... npx expo run:android 명령어를 친 후 여러 가지..

환경 : NativeScript Vue3 beta9 + TypeScript 기반 본격적인 모바일 하이브리드 베이스 앱을 만들고 있다. 저번에는 Navigation Drawer(Side Menu) 를 만들어 보았으니, 이번에는 하단 탭 구조(BottomNavigation)를 만들어 볼 차례가 되었다. 하단 탭 구조는 네이티브 스크립트에서 기본 제공하는 TabView / TabViewItem 등을 이용해서 만들거나, ui-material-component 플러그인, Vuetify 플러그인 등을 이용해서 만들 수 있는데, 이번에는 ui-material-component 플러그인으로 만들어 보도록하겠다. ui-material-component 플러그인으로 선택한 이유는 실제로 되기 때문이다. Vuetify는 아..

디바이스와 연결하여 디버깅을 한참 하고 있는데, 갑자기 Error is: Invalid Version: null. 이런 에러가 나면서 디버깅이 제대로 안되기 시작했다. 구글링을 해보니 안드로이드 앱 버전 0으로 설정되어 발생하는 에러라는데, 나의 경우는 package.json 에 버전이 잘 설정되어 있었기 때문에 해당되지 않았다. Searching for devices... Preparing project... Using @nativescript/android which requires nsconfig.json to be present. Writing nsconfig.json based on the values set in nativescript.config.(js|ts). You may add nsco..

현재 NativeScript 에서 공식적으로 지원하는 것은 Vue2 이다. 물론 다른 언어들도 공식 지원하지만, 여기서는 Vue 만으로 얘기한다. 뷰2 기반으로 만들어도 다양한 하이브리드 앱을 만드는 것에는 문제가 없다. 다만 코딩상 뷰2가 갖는 비효율성으로 인해 유지보수가 어려워지는 경우들이 쌓이다 보면 나중에 어려운 상황이 올 수 있다. NativeScript 와 Vue3의 조합은 현재 베타 버전이 진행중인 상태이며, 크롬 뷰 데브툴 사용도 안드로이드 에뮬레이터 or iOS 시뮬레이터 환경에서만 가능하고 실제 디바이스에서는 사용이 불가함 등등 몇 가지 제약이 있다. 그럼에도 불구하고 Vuex 와 같은 필수적인 라이브러리를 활용하고 싶다면 반드시 뷰3 기반으로 프로젝트를 생성해야 한다. 뷰2 기반의 프..

뷰에서 코딩하다 보면 간혹 TypeError: (0 , vue__WEBPACK_IMPORTED_MODULE_0__.effectScope) is not a function 에러를 맞딱뜨리는 경우가 있다. System.err: An uncaught Exception occurred on "main" thread. System.err: Unable to create application com.tns.NativeScriptApplication: com.tns.NativeScriptException: Error calling module function System.err: TypeError: (0 , vue__WEBPACK_IMPORTED_MODULE_0__.effectScope) is not a functi..