book

Mobile App Development with Ionic, Revised Edition

by Chris Griffith

August 2017

Intermediate to advanced

290 pages

6h 32m

English

O'Reilly Media, Inc.

Read now

Unlock full access

Who Should Read This BookNavigating This BookOnline ResourcesConventions Used in This BookUsing Code ExamplesO’Reilly SafariHow to Contact UsAcknowledgments
What Is the Ionic Framework?What’s New in Ionic?Comparing Mobile SolutionsNative Mobile ApplicationsMobile Web ApplicationsHybrid Mobile ApplicationsUnderstanding the Ionic StackIonic FrameworkAngularCordovaPrerequisites for Ionic Application DevelopmentSummary
Installing the Ionic FrameworkInstalling Node.jsInstalling GitInstalling the Apache Cordova CLIInstalling Ionic CLIStarting a New Ionic ProjectIonic Project Folder StructurePlatform Tools InstallationsiOSAndroidWindows UniversalSetting EmulatorsiOSAndroidSetting Up Your DevicesiOSAndroidAdding Mobile PlatformsPreviewing on EmulatorPreviewing on DeviceSummary
Define Your Build PlatformsManaging Cordova PluginsIonic GeneratorPreviewing Your ApplicationThe Ionic lab CommandSpecifying an IP Address to UseEmulating Your Ionic AppEmulating iOS DevicesEmulating Android DevicesRunning Ionic App on a DeviceLoggingCLI informationSummary
Why Angular?ComponentsInputsTemplatesEventsPipes@ViewChildUnderstanding ES6 and TypeScriptVariablesClassesPromisesObservablesTemplate StringsArrow FunctionsTypesSpecial TypesTyping Functions:voidSummary
The History of Cordova (aka PhoneGap)Apache Cordova versus Adobe PhoneGapA Deep Dive into CordovaConfiguring Your Cordova AppDevice Access (aka Plugins)Interface Components: The Missing PieceWhy Not Cordova?Understanding Web StandardsSummary
HTML StructureIonic ComponentsUnderstanding the SCSS FileUnderstanding TypeScriptSummary
Adding Our Build PlatformsPreviewing Our Ionic2Do AppUnderstanding the index.html FileExploring the app DirectoryUpdating the Page StructureAdding Full-Swipe GestureSimple ThemingProper TypingSaving DataCreating a Firebase accountInstalling Firebase and AngularFire2Ionic Build SystemAdding AngularFire to Our app.module.ts FileUsing Firebase DataUsing Ionic NativeSummary
Bootstrapping Our AppLoading Data via the HTTP ServiceDisplay our DataExtending parklist.tsGenerating New PagesUnderstanding the Ionic Navigation modelPassing Data Between PagesUpdating the Park Details PageAdd a Google MapAdding Additional TypingsAdding Our Content Security PolicyAdjust the CSS to support the Google MapRendering the Google MapAdd Map MarkersMaking the Markers ClickableAdding SearchTheming Our ApplicationVirtual ScrollingCustom List HeadersSummary

Getting StartedExploring the Side Menu TemplateExploring the app.component.ts FileSide Menu OptionsDisplaying the MenuConverting the TemplateMocking Up Our Weather ProviderLaying Out the Weather DataLoading Feedback: Loading Dialogs and Pull to RefreshAdding GeoLocationAccessing Live Weather DataConnecting the Geolocation and Weather ProvidersGetting Other Locations’ WeatherPull to Refresh: Part 2Editing the LocationsDeleting a CityAdding a CityUsing a Geocoding ServiceDynamically Updating the Side MenuIonic EventsObservablesStyling the AppAdd a Weather IconNext StepsSummary
Dealing with CORS IssuesDebugging Through an iOS or Android SimulatorAndroidDebugging On-DeviceAndroidiOSDebugging Ionic InitializationAdditional ToolsSummary
Adjusting the config.xml FileApp Icons and Splash ScreensBuilding Your Android APKGenerating the Signing KeySubmitting to the Google Play StoreBuilding Your iOS AppRequest a Distribution CertificateCreate a Distribution Provisioning ProfileCreating the App ListingBuilding the App for ProductionCreating an Archive of the ApplicationUsing TestFlight Beta TestingReleasing to the App StoreSummary
Setting Up Ionic ServicesGenerating Your Ionic App IDConfiguring Your ApplicationIonic DeploySetting Up Ionic DeployTesting Ionic DeploySecurity ProfilesCreating a ProfileiOS SetupSupporting iOS Push NotificationsAndroid SetupAndroid Push NotificationsIonic PackagePreparing a Release BuildGetting Build InformationGetting Your Build ResultsDownloading Your BuildUpdating Your Cordova Plug-insIonic ViewSupported Plug-insUploading Your AppViewing Your AppIonic CreatorSummary
But What, Exactly, Is a Progressive Web App?The manifest.json FileService WorkersPush NotificationsWhat’s Next?
Components You Should Know AboutSlidesDate-TimePopoverReorder ListDeepLinkerStorageNext StepsIonic ForumsIonic Worldwide Slack ChannelGitHubConclusion
Create a New Ionic ApplicationCreate Your Page StructureUpdate the ThemingReplacing Your Controllers and ViewsReplace Your Factories/ServicesConvert the Application InitializationUpdate the RoutingSwitching to Ionic NativeConclusion
Essential PropertiesPreferencesCommon General PreferencesCommon iOS PreferencesCommon Android PreferencesCommon Windows PreferencesIconsAndroidiOSWindowsSplashscreensAndroidiOSWindowsPlug-insFeaturesReference

Overview

Learn how to build app store-ready hybrid apps with Ionic, the framework built on top of Apache Cordova (formerly PhoneGap) and Angular. This revised guide shows you how to use Ionic’s tools and services to develop apps with HTML, CSS, and TypeScript, rather than rely on platform-specific solutions found in Android, iOS, and Windows Universal.

Author Chris Griffith takes you step-by-step through Ionic’s powerful collection of UI components, and then helps you use it to build three cross-platform mobile apps. Whether you’re new to this framework or have been working with Ionic 1, this book is ideal for beginning, intermediate, and advanced web developers.

Understand what a hybrid mobile app is, and what comprises a basic Ionic application

Learn how Ionic leverages Apache Cordova, Angular, and TypeScript to create native mobile applications

Create a Firebase-enabled to-do application that stores data across multiple clients

Build a tab-based National Park explorer app with Google Map integration

Develop a weather app with the Darksky weather API and Google’s GeoCode API

Debug and test your app to resolve issues that arise during development

Walk through steps for deploying your app to native app stores

Learn how Ionic can be used to create Progressive Web Apps

Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.

Start your free trial

Mobile App Development with Ionic 2, 1st Edition

Publisher Resources

ISBN: 9781491998113Errata Page Supplemental Content

Mobile App Development with Ionic, Revised Edition

by Chris Griffith

Overview

Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.

You might also like

Mobile App Development with Ionic 2, 1st Edition

Ionic : Hybrid Mobile App Development

Build Mobile Apps with Ionic 4 and Firebase: Hybrid Mobile App Development

Hands-On App Development with Ionic

Publisher Resources

Overview

Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,and much more.

You might also like

Mobile App Development with Ionic 2, 1st Edition

Ionic : Hybrid Mobile App Development

Build Mobile Apps with Ionic 4 and Firebase: Hybrid Mobile App Development

Hands-On App Development with Ionic

Publisher Resources

Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.