안녕하세요. 이번 시간은 아파치코도바로 하이브리드앱을 만들어보겠습니다.
하이브리드앱이란?
프론트 개발을 위해 사용하는 html, css ,js 코드로 만든 모바일앱입니다. 프로젝트에서 사용한 모바일웹 코드(html,css,javascript)를 하이브리드앱 프로젝트로 옮기면 그 화면 그대로 하나의 앱을 만들어서 앱스토어에 출시도 가능합니다.
하이브리드앱에서 이용되는 대표적 프레임워크는 아파치코도바, 아이오닉이 있습니다.
아이오닉은 아파치코도바랑 거의 비슷한데, SPA 프레임워크(리액트,앵귤러) 이용 이 가능합니다.
아파치코도바 프로젝트 생성 방법
-
코도바가 없다면 터미널에서 설치해줍니다.
npm install -g cordova
2. 원하는 경로에 코도바 프로젝트를 만들어줍니다.
cordova create helloworld com.example.helloworld helloworld
3. 해당 폴더에 helloworld 폴더명을 지닌 코도바 프로젝트 잘 생겨났는지 확인합니다.
4. 해당 폴더로 들어가서 android와 ios의 플랫폼을 추가해줍니다.
cd helloworld
cordova platform add android
cordova platform add ios
5. helloworld 폴더 내 platform 폴더가 있는데 android와 ios 폴더가 생긴지 확인합니다.
-----
## 프론트 코드 build하여 하이브리드앱(안드로이드, ios)에 적용시키기
1. helloword 폴더 내 www 폴더로 들어갑니다.
2. 그곳에다가 html, css, js 폴더 및 파일을 넣습니다.
3. 다음 명령어를 터미널에 입력합니다(경로는 helloworld 프로젝트에 유지되어있어야합니다)cordova build
이렇게 해주면 그 파일들이 자동으로 안드로이드와 ios프로젝트에 넣어줍니다.
이후 안드로이드 스튜디오나 Xcode에서 해당 플랫폼의 폴더를 import하여 개발을 진행해주면 됩니다!
-----
참고자료
https://cordova.apache.org/docs/ko/latest/guide/cli/index.html
