Ionic
Cross-platform mobile SDK with native-style UI components.
Quick Start
npm install -g @ionic/cli
ionic start my-app blank --type=angular
cd my-app && ionic serve
Pages
import { Component } from '@angular/core'
@Component({
selector: 'app-home',
template: `<ion-header><ion-toolbar><ion-title>Home</ion-title></ion-toolbar></ion-header>
<ion-content><ion-list><ion-item *ngFor="let item of items">{{ item.name }}</ion-item></ion-list></ion-content>`
})
export class HomePage { items = [{name: 'Item 1'}, {name: 'Item 2'}] }
Navigation
import { NavController } from '@ionic/angular'
this.navCtrl.navigateForward('/details', { state: { id: 1 } })
When to Use
- Rapid cross-platform development
- Web-to-mobile conversion
- Enterprise mobile apps
- Prototypes with native feel
Validation
- App runs in browser with ionic serve
- Platform builds succeed for iOS/Android
- UI components render with correct styling