Foreword |
|
xi | |
Preface |
|
xv | |
1 Hybrid Mobile Apps |
|
1 | (8) |
|
What Is the Ionic Framework? |
|
|
2 | (1) |
|
|
2 | (1) |
|
Comparing Mobile Solutions |
|
|
3 | (2) |
|
Native Mobile Applications |
|
|
3 | (1) |
|
|
4 | (1) |
|
Hybrid Mobile Applications |
|
|
4 | (1) |
|
Understanding the Ionic Stack |
|
|
5 | (2) |
|
|
5 | (1) |
|
|
6 | (1) |
|
|
6 | (1) |
|
Prerequisites for Ionic Application Development |
|
|
7 | (1) |
|
|
7 | (2) |
2 Setting Up Our Development Environment |
|
9 | (14) |
|
Installing the Ionic Framework |
|
|
9 | (3) |
|
|
10 | (1) |
|
|
11 | (1) |
|
Installing the Apache Cordova CLI |
|
|
11 | (1) |
|
|
11 | (1) |
|
Starting a New Ionic Project |
|
|
12 | (3) |
|
Ionic Project Folder Structure |
|
|
12 | (3) |
|
Platform Tools Installations |
|
|
15 | (1) |
|
|
15 | (1) |
|
|
15 | (1) |
|
|
16 | (1) |
|
|
16 | (2) |
|
|
16 | (1) |
|
|
17 | (1) |
|
|
18 | (1) |
|
|
18 | (1) |
|
|
19 | (1) |
|
|
19 | (1) |
|
|
20 | (1) |
|
|
21 | (1) |
|
|
22 | (1) |
3 Understanding the Ionic Command-Line Interface |
|
23 | (10) |
|
Define Your Build Platforms |
|
|
25 | (1) |
|
|
26 | (1) |
|
|
26 | (1) |
|
Previewing Your Application |
|
|
27 | (1) |
|
|
28 | (1) |
|
Specifying an IP Address to Use |
|
|
28 | (1) |
|
|
29 | (1) |
|
|
29 | (1) |
|
Emulating Android Devices |
|
|
30 | (1) |
|
Running Ionic App on a Device |
|
|
30 | (1) |
|
|
30 | (1) |
|
|
31 | (1) |
|
|
31 | (2) |
4 Just Enough Angular and TypeScript |
|
33 | (16) |
|
|
33 | (9) |
|
|
34 | (1) |
|
|
35 | (1) |
|
|
35 | (2) |
|
|
37 | (4) |
|
|
41 | (1) |
|
|
41 | (1) |
|
Understanding ES6 and TypeScript |
|
|
42 | (6) |
|
|
42 | (1) |
|
|
43 | (1) |
|
|
44 | (1) |
|
|
45 | (1) |
|
|
45 | (1) |
|
|
46 | (1) |
|
|
46 | (1) |
|
|
47 | (1) |
|
|
48 | (1) |
|
|
48 | (1) |
|
|
48 | (1) |
5 Apache Cordova Basics |
|
49 | (8) |
|
The History of Cordova (aka PhoneGap) |
|
|
51 | (1) |
|
Apache Cordova versus Adobe PhoneGap |
|
|
51 | (1) |
|
|
52 | (1) |
|
Configuring Your Cordova App |
|
|
52 | (1) |
|
Device Access (aka Plugins) |
|
|
53 | (1) |
|
Interface Components: The Missing Piece |
|
|
53 | (1) |
|
|
54 | (1) |
|
Understanding Web Standards |
|
|
54 | (1) |
|
|
55 | (2) |
6 Understanding Ionic |
|
57 | (6) |
|
|
57 | (2) |
|
|
59 | (1) |
|
Understanding the SCSS File |
|
|
60 | (1) |
|
|
61 | (1) |
|
|
62 | (1) |
7 Building Our Ionic2Do App |
|
63 | (36) |
|
Adding Our Build Platforms |
|
|
64 | (1) |
|
Previewing Our Ionic2Do App |
|
|
64 | (11) |
|
Understanding the index.html File |
|
|
66 | (2) |
|
Exploring the app Directory |
|
|
68 | (7) |
|
Updating the Page Structure |
|
|
75 | (11) |
|
Adding Full-Swipe Gesture |
|
|
86 | (1) |
|
|
87 | (1) |
|
|
87 | (1) |
|
|
88 | (1) |
|
Creating a Firebase account |
|
|
88 | (1) |
|
Installing Firebase and AngularFire2 |
|
|
89 | (1) |
|
|
90 | (2) |
|
Adding AngularFire to Our app.module.ts File |
|
|
92 | (1) |
|
|
92 | (2) |
|
|
94 | (4) |
|
|
98 | (1) |
8 Building a Tab-Based App |
|
99 | (34) |
|
|
104 | (1) |
|
Loading Data via the HTTP Service |
|
|
105 | (2) |
|
|
107 | (3) |
|
|
109 | (1) |
|
|
110 | (2) |
|
Understanding the Ionic Navigation model |
|
|
112 | (2) |
|
Passing Data Between Pages |
|
|
113 | (1) |
|
Updating the Park Details Page |
|
|
114 | (1) |
|
|
115 | (1) |
|
Adding Additional Typings |
|
|
115 | (1) |
|
Adding Our Content Security Policy |
|
|
116 | (1) |
|
Adjust the CSS to support the Google Map |
|
|
116 | (1) |
|
|
116 | (2) |
|
|
118 | (5) |
|
Making the Markers Clickable |
|
|
120 | (3) |
|
|
123 | (3) |
|
|
126 | (2) |
|
|
128 | (2) |
|
|
130 | (2) |
|
|
132 | (1) |
9 Building a Weather Application |
|
133 | (46) |
|
|
133 | (1) |
|
Exploring the Side Menu Template |
|
|
134 | (3) |
|
Exploring the app.component.ts File |
|
|
136 | (1) |
|
|
137 | (1) |
|
|
138 | (1) |
|
|
138 | (3) |
|
Mocking Up Our Weather Provider |
|
|
141 | (1) |
|
Laying Out the Weather Data |
|
|
142 | (3) |
|
Loading Feedback: Loading Dialogs and Pull to Refresh |
|
|
145 | (3) |
|
|
148 | (2) |
|
Accessing Live Weather Data |
|
|
150 | (1) |
|
Connecting the Geolocation and Weather Providers |
|
|
151 | (2) |
|
Getting Other Locations' Weather |
|
|
153 | (3) |
|
|
156 | (1) |
|
|
157 | (5) |
|
|
161 | (1) |
|
|
162 | (1) |
|
Using a Geocoding Service |
|
|
162 | (3) |
|
Dynamically Updating the Side Menu |
|
|
165 | (1) |
|
|
166 | (1) |
|
|
167 | (4) |
|
|
171 | (4) |
|
|
175 | (3) |
|
|
178 | (1) |
|
|
178 | (1) |
10 Debugging and Testing Your Ionic Application |
|
179 | (10) |
|
|
184 | (1) |
|
Debugging Through an iOS or Android Simulator |
|
|
185 | (1) |
|
|
185 | (1) |
|
|
186 | (1) |
|
|
186 | (1) |
|
|
187 | (1) |
|
Debugging Ionic Initialization |
|
|
187 | (1) |
|
|
187 | (1) |
|
|
188 | (1) |
11 Deploying Your Application |
|
189 | (18) |
|
Adjusting the config.xml File |
|
|
189 | (1) |
|
App Icons and Splash Screens |
|
|
190 | (1) |
|
Building Your Android APK |
|
|
190 | (3) |
|
Generating the Signing Key |
|
|
191 | (1) |
|
Submitting to the Google Play Store |
|
|
192 | (1) |
|
|
193 | (13) |
|
Request a Distribution Certificate |
|
|
193 | (1) |
|
Create a Distribution Provisioning Profile |
|
|
193 | (6) |
|
|
199 | (3) |
|
Building the App for Production |
|
|
202 | (1) |
|
Creating an Archive of the Application |
|
|
202 | (2) |
|
Using TestFlight Beta Testing |
|
|
204 | (1) |
|
Releasing to the App Store |
|
|
205 | (1) |
|
|
206 | (1) |
12 Exploring the Ionic Services |
|
207 | (20) |
|
Setting Up Ionic Services |
|
|
207 | (1) |
|
Generating Your Ionic App ID |
|
|
208 | (1) |
|
Configuring Your Application |
|
|
208 | (1) |
|
|
209 | (7) |
|
|
210 | (1) |
|
|
210 | (6) |
|
|
216 | (5) |
|
|
217 | (1) |
|
|
218 | (1) |
|
Supporting iOS Push Notifications |
|
|
219 | (1) |
|
|
219 | (1) |
|
Android Push Notifications |
|
|
220 | (1) |
|
|
221 | (2) |
|
Preparing a Release Build |
|
|
222 | (1) |
|
Getting Build Information |
|
|
222 | (1) |
|
Getting Your Build Results |
|
|
222 | (1) |
|
|
223 | (1) |
|
Updating Your Cordova Plug-ins |
|
|
223 | (1) |
|
|
223 | (3) |
|
|
224 | (1) |
|
|
224 | (1) |
|
|
225 | (1) |
|
|
226 | (1) |
|
|
226 | (1) |
13 Progressive Web Apps |
|
227 | (8) |
|
But What, Exactly, Is a Progressive Web App? |
|
|
228 | (1) |
|
|
229 | (1) |
|
|
230 | (3) |
|
|
233 | (1) |
|
|
233 | (2) |
14 Conclusion |
|
235 | (10) |
|
Components You Should Know About |
|
|
235 | (7) |
|
|
235 | (1) |
|
|
236 | (1) |
|
|
237 | (2) |
|
|
239 | (1) |
|
|
240 | (1) |
|
|
240 | (2) |
|
|
242 | (1) |
|
|
242 | (1) |
|
Ionic Worldwide Slack Channel |
|
|
242 | (1) |
|
|
242 | (1) |
|
|
243 | (2) |
A Migrating From Ionic 1 |
|
245 | (4) |
B Understanding the Config.xml File |
|
249 | (10) |
C Ionic Component Library |
|
259 | (4) |
Index |
|
263 | |