모바일/Hybrid

Cordova(코르도바 앱 개발) - (1).기초강의 - 개발 환경 설정

2017. 11. 3. 16:17

Cordova - 기본 플랫폼(Platform) 지원 설명

 

① 프로젝트 진행 중 Cordova를 활용하여 수월하게 앱 개발이 가능했다.

② 아래 그림과 개발 계획 수립 시 플랫폼(Platform) 별 기능 지원 여부를 꼭 확인해야 한다.

③ Cordova 개발 환경 설정에 요구되는 도구(프로그램)는 아래에서 설명한다.

 

 

Cordova - 기본 프로그램 설치 확인


Cordova 개발 환경 설정을 위해서는 아래 프로그램이 필요하다.
 - jdk(sdk)

 - npm(Node.js)

 - cordova

 - git (cordova Plug-in 설치)

 - 안드로이드 스튜디오 - 안드로이드 개발 시

 - Xcode - iOS 개발 시

 - 단말기(안드로이드폰, 아이폰 등)

 

(1). 개발환경에 맞는 Mac 또는 윈도우 환경에서 개발해야 한다.

(2). 위 프로그램들은 인터넷에 많은 설치 방법 자료가 있으므로, 타 블로그를 참조해서 설치 하자.

(3). 설치 완료 후 아래 콘솔 명령어를 통해서 제대로 설치되었는지 확인(윈도우, Mac 공통)


 

Cordova - 빌드(Build) 및 폴더 확인

 

- 윈도우 또는 맥(Mac) 콘솔에서 아래와 같이 실행 한다.

- 개발 예정인 플랫폼을 추가 (안드로이드, iOS 등)

- 안드로이드의 경우에는 안드로이드 스튜디오 설치하면 OK

- iOS의 경우에는 xcode 설치 후 실행 가능

- 본 포스팅에서는 안드로이드 기준으로 설명한다.

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
#npm 업데이트
npm update -g
 
#Cordova 설치
npm install -g cordova 
 
#Cordova 프로젝트 생성
#cordova create helloworld com.test.helloworld Helloworld
cordova create 경로 패키지 프로젝트명
 
#Cordova Platform 추가(선택)
cordova platform add ios
cordova platform add amazon-fireos
cordova platform add android
cordova platform add blackberry10
cordova platform add firefoxos
 
#Cordova Platform 제거(선택)
cordova platform remove ios
cordova platform remove amazon-fireos
cordova platform remove android
cordova platform remove blackberry10
cordova platform remove firefoxos
cs

 

실행화면

 

 

 

 

 

Cordova - 빌드(Build) 및 폴더 확인

 

아래 명령어를 환경에 맞게 실행한다.

 

1
2
3
4
5
6
7
8
#Cordova Platform 빌드(선택)
cordova build                   #디버그 
cordova build android           #디버그
cordova build --release android #릴리즈
 
#Cordova 실행
cordova emulate android #에뮬레이터 실행
cordova run android     #실제 단말기 실행
cs


 

실행화면

 

 

 

빌드 후 결과 폴더 확인

 

 

  다음 포스팅에서는 빌드(Build) 완료 후 안드로이드 스튜디오 및 실 단말기 에서 실행 하는 법을 알아본다.

 

 


 


저작자표시 동일조건 (새창열림)

'모바일 > Hybrid' 카테고리의 다른 글

Cordova(코르도바 앱 개발) - (2).실행 - 안드로이드 스튜디오 연동  (4) 2017.11.04
[Mobile] PhoneGap(폰갭) vs Cordova(코르도바) vs Ionic(아이오닉) 차이  (1) 2017.10.31
'모바일/Hybrid' 카테고리의 다른 글
  • Cordova(코르도바 앱 개발) - (2).실행 - 안드로이드 스튜디오 연동
  • [Mobile] PhoneGap(폰갭) vs Cordova(코르도바) vs Ionic(아이오닉) 차이
[좋은사람]
[좋은사람]
좋은사람의 개발 노트 입니다.
[좋은사람]
좋은사람의 개발 노트
[좋은사람]
전체
오늘
어제
  • 전체보기 (189)
    • 언어 (68)
      • Java (12)
      • Python (39)
      • C# (5)
      • PHP (4)
      • Go (8)
    • OS (18)
      • Linux (7)
      • Windows 10 (5)
      • Etc (6)
    • 빅데이터 & 분석 (8)
      • R (0)
      • Machine Learning (8)
    • 네트워크 (4)
      • Etc (4)
    • 웹 프론트 (25)
      • Javascript & ECMA (8)
      • Vue (13)
      • React (4)
    • 웹 백엔드 (15)
      • Spring (3)
      • Django & Flask (7)
      • Npm & Express (5)
    • 개발도구 (18)
      • Jetbrains (3)
      • Eclipse (5)
      • Git (4)
      • Atom & VScode (6)
    • 데이터베이스 (7)
      • Oracle (2)
      • MariaDB & MySQL (2)
      • Etc (3)
    • 모바일 (6)
      • Android (3)
      • Hybrid (3)
    • 라이프 (20)
      • 여행 & 일상 (6)
      • 취미 (14)

블로그 메뉴

  • 홈으로
  • 블로그소개
  • 태그
  • 방명록

공지사항

인기 글

태그

  • php
  • ubuntu
  • Database
  • ps4
  • Linux
  • centos
  • 2DS
  • Thread
  • Algorithm
  • C#
  • Django
  • 이클립스
  • flask
  • 윈도우10
  • 인텔리j
  • ATOM
  • SpringSTS
  • vue.js
  • go
  • 미뮤
  • windows10
  • python
  • 아톰 에디터
  • npm
  • 코딩 면접
  • 디자인패턴
  • javascript
  • Java
  • OCR
  • react
  • Eclipse
  • Anaconda
  • Git
  • nodejs
  • 3DS
  • 리액트
  • 커펌
  • 개발자 면접
  • CFW
  • 머신러닝

최근 댓글

최근 글

hELLO · Designed By 정상우.
[좋은사람]
Cordova(코르도바 앱 개발) - (1).기초강의 - 개발 환경 설정
상단으로

티스토리툴바

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.