ionic-conference-app에서 소스를 다운 받는다.
압축을 풀고 해당 위치에서 커맨드를 실행한다.

먼저 필요한 모듈을 다운 받는다.

npm install

서버를 실행한다.

ionic serve --lab

아래와 같은 화면을 볼 수 있다.

bc99up

처음 앱을 시작하면 튜토리얼 페이지가 나오도록 한다. app.ts 파일에서 rootPage 를 설정한다.

snippet.js

import {TutorialPage} from './pages/tutorial/tutorial';
...
rootPage: any = TutorialPage;

app.html에 있는 [root]=“rootPage”를 통하여 메인 페이지가 변경된다.

snippet.html

<!-- main navigation -->
<ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav>

tabbarPlacement: 'bottom' 설정값을 입력하여 탭의 위치를 아래로 내린다. 탭의 위치를 아래로 내린다. iOS의 경우 탭이 위에 위치하지만, 안드로이드의 경우 기본 탭의 위치가 상단으로 되어 있다.

더 많은 설정 정보는 이곳을 참조한다.

snippet.js

ionicBootstrap(MyApp, [firebase], {
  tabbarPlacement: 'bottom'
})