Hands-On App Development with Ionic

Video description

This hands-on course teaches you to build reactive, scalable, and dynamic cross-platform apps using Ionic 4 and 5

About This Video

  • Build performant, persistent, reactive, and scalable cross-platform apps using the Ionic 4 and 5 framework
  • Develop apps that use a single codebase and work on mobile platforms Android, iOS, and also the web using native APIs and in-device storage
  • Follow industry best practices and use MobX with Ionic (via device storage) to build a scalable architecture

In Detail

While Ionic is an easy and straightforward framework to learn, building Ionic apps can sometimes be hard. Designing its architecture and making sure that your application is high-performing, dynamic, and scalable are always tricky.

In this course, you will develop a feature-rich Notes app in a step-by-step process using the Ionic framework. You will be using web components, persistent storage, and APIs to ensure your app is high-performing. You'll use the MobX reactive state management tool to make your apps scalable. You'll then use a SQLite database to persist data onto your device. With the Ionic Native Camera API, you'll add, save pictures to your notes then edit and save them, set reminders in your notes, and have your device notify you of events using Ionic Native local notifications. You will deploy your app across iOS and Android devices and also on the web.

By the end of the course, you will have taken your Ionic 4 and 5 skills to the next level and will be equipped to build cross-platform hybrid mobile apps.

Publisher resources

Download Example Code

Table of contents

  1. Chapter 1 : Setting Up Ionic Project
    1. Course Overview
    2. Creating Ionic project and serving on browser
    3. Creating App Pages
    4. Theming Colors Using Ionic Color Generator
  2. Chapter 2 : Application State Management with MobX
    1. Introduction to MobX and Its Key Features
    2. Installing MobX Packages for Angular
    3. Subscribing to State Properties Using @observable
    4. Updating State with @action
    5. Using @computed Values
  3. Chapter 3 : Building the Notes Crud Using MobX
    1. Creating the Notes Store
    2. Listing Notes
    3. Adding and Editing Notes
    4. Adding and Editing Notes Part 2
    5. Adding and Editing Notes Part 3
    6. Deleting Notes
  4. Chapter 4 : Persisting Notes Using Cordova SQLite
    1. Installing Cordova SQLite Plugin
    2. CRUD Using Cordova SQLite
    3. CRUD Using Cordova SQLite - Part 2
    4. CRUD Using Cordova SQLite - Part 3
    5. Adding Abstraction over Cordova SQLite
    6. Using Ionic Storage as a Fallback for Web Browsers
  5. Chapter 5 : Adding Pictures Using Ionic Native Camera API
    1. Installing @ionic-native/Camera and Taking Pictures
    2. Saving Pictures to Database Along with the Notes
    3. Displaying Pictures with Notes
    4. Providing Different Options for Picture Selection
  6. Chapter 6 : Set Reminders Using Ionic Native Local-Notifications
    1. Installing the Local-Notifications Ionic Native Package and Cordova Plugin
    2. Understanding Local-Notifications in Depth
    3. Modifying the Database to Add Reminder Time
    4. Adding the Reminder Time Form Control
    5. Creating Notes with Reminders
    6. Updating Notes Reminders
    7. Removing Notes with Reminders
  7. Chapter 7 : Wrapping up Settings and about Tabs
    1. Changing the App's Name and Finalizing about Tab
    2. Clearing All Reminders Under the Settings Tab
  8. Chapter 8 : Upgrading to Ionic 5
    1. Updating Ionic CLI and Upgrading to Ionic 4.11.10
    2. Upgrading to Ionic 5 and Angular v9
    3. Breaking Changes
    4. Course Review

Product information

  • Title: Hands-On App Development with Ionic
  • Author(s): Ahsan Ayaz
  • Release date: May 2020
  • Publisher(s): Packt Publishing
  • ISBN: 9781789619904