Ionic을 하기 위해서는 선수해야할것이 매우 많다.
이는 추상화 과정이 높은 프레임워크이기 때문이다.
먼저 TypeScript를 사용한다. 하다못해 JavaSciprt는 알아야한다.
그리고 angular에 대해서 알아야하며 SPA에 대해서 알아야한다.
당연히 기본적인 html과 web에 대한 이해도도 있어야한다.
그 아래에 돌아가는 cordova역시 알아야하며 android와 ios까지 알아야한다.
그러니 이에 대한 지식을 어느정도 선수하고 이 내용을 듣기 바란다.
참고:
ionic을 설치하기 위해서는 npm이 설치되어야한다.
npm을 설치하려면 nodejs가 설치되어야한다.
nodejs를 설치하는 방법은 여기를 참조하라.
npm install -g ionic cordova
이렇게 ionic과 cordova를 글로벌로 설치한다.
ionic --version
cordova --version
설치후에는 제대로 설치되었는지 확인하자.
ionic start <프로젝트 명> <템플릿 명>
아이오닉 프로젝트를 만드는 명령어는 위와같이 ionic start이다.
마지막에는 프로젝트의 템플릿을 정할 수 있다.
ionic start --list
위 명령어로 템플릿 리스트와 그에대한 설명을 볼 수 있다.
템플릿의 종류는 꽤 많다. 우리는 그중에서 blank를 사용할 것이다.
이 앱이 native앱을 타겟으로 하는지 물어본다. Yes라고 해주자.
또한 Ionic Pro SDK를 연결할건지 물어본다. 아직은 필요없으므로 No라한다.
제작이 끝나면 위와같은 구조를 얻는다.
ionic serve
프로젝트단에 가서 ionic serve라고 하면 프로젝트를 실행할 수 있다.
angular-cli나 vue-cli와 같은 개념이라고 할 수 있다.
그럼 웹을 열어서 확인해 보자.
웹에서 위와같이 만든 우리의 예제를 볼 수 있다.
지금은 웹화면에서 볼 수 있는데 모바일화면에서 어떻게 보이는지 확인하고 싶을 수 있다.
요즘 브라우저들은 이런 기능들을 지원하지만 찾기 조금 힘들게 되어있다.
여기서 찾아서 사용하는 방법에 대해서 알려 드리도록 하겠다.
'Programming > TypeScript-Ionic' 카테고리의 다른 글
| [Ionic-04]아이콘과 스플래시 생성 (0) | 2018.09.25 |
|---|---|
| [Ionic-03]ios프로젝트로 만들고 빌드하기 (0) | 2018.09.18 |
| [Ionic-02]Android프로젝트로 만들고 빌드하기 (0) | 2018.09.18 |