Ionic Mastery Course

This course will provide an introduction to mobile application development using Ionic Framework to its participants. At the end of the course, the participants will be able to produce a mobile application via Android (apk) or iOS (Xcode installed) and will have a basic understanding of the Ionic Framework as well as a mobile application using a hybrid framework.

Course Overview

  • Identify the effects of mobile devices in our daily life
  • Identify the disruptions caused by mobile devices in traditional industries
  • Explain the concepts of the Ionic Framework
  • Distinguish the difference between native and hybrid app development
  • Set up the development environment and tools for Ionic Framework
  • Build an Ionic app with Ionic Angular
  • Use HTML and Angular commands
  • Use Ionic Mobile App UI components
  • Use Ionic Angular Services, Components and Pipes in Ionic development
  • Test Ionic App on a browser
  • Generate a mobile app for Android and Apple Mobile Devices with Capacitor
  • Design Mobile Apps and its methodology (UI/UX)
  • Use Ionic Native and Capacitor Plugins in Ionic Development
  • Use Canva to design and prepare App Icon and Splash screen
  • Integrate Google Firebase as a backend for Ionic Mobile Application
  • Integrate HTTP Capacitor for REST API call with Ionic Mobile App
  • Prepare Apps to be published

Part 1 - Mobile Apps in Our Daily Life

Learning Outcomes

Identify the effects of mobile devices in our daily life & Identifythe disruptions caused by mobile devices in traditional industries

Details

  • About mobile devices
  • Effects of mobile devices in our daily life
  • Mobile device disruptions in traditional industries

Part 2 - Methods of Mobile App Development

Learning Outcomes

Explain the concepts of Ionic Framework. Distinguish the difference between native and hybrid app development

Details

  • Methods of Mobile App Development and how Ionic mobile application development came about

Part 3 - Installing Ionic Framework & its tools

Learning Outcomes

Set up the development environment and tools for Ionic Framework

Details

  • Installing Command Line Interface (CLI)
  • Installing Integrated Development Environment (IDE)
  • Installing Ionic

Part 4 - Start & Run a Project

Learning Outcomes

Build an Ionic app with Ionic Angular & Test Ionic App on a browser

Details

  • Types Of Ionic Framework Projects
  • Create a “Hello World” Project
  • Serving and testing your app on a browser

Part 5 - Generating Pages & Navigating to it

Learning Outcomes

Use HTML and Angular commands. Use Ionic Mobile App UI components

Details

  • Generate an Ionic page and navigate to the page
  • Using HTML and TypeScript
  • Using Modal

Part 6 - Basic TypeScript & Angular HTML

Learning Outcomes

Use HTML and Angular commands

Details

  • Basic TypeScript commands and HTML

Part 7 - Generating Services, Components, Pipes and Modules

Learning Outcomes

Use Ionic Angular Services, Components and Pipes in Ionic development

Details

  • Using services, components and pipes in your application and their uses in a mobile application

Part 8 - Turning your project into an app

Learning Outcomes

Generate a mobile app for Android and Apple Mobile Devices with Capacitor

Details

  • Installing and setting up your system to turn your application into an Android (apk) or iOS App (via Xcode)

Part 9 - Designing Your Mobile Application

Learning Outcomes

Design Mobile Apps and its methodology (UI/UX)

Details

  • Basic design principles in mobile application design (UI/UX)
  • Note & Vote Design workshop