This course focuses on developing multiplatform mobile applications using the Web technologies (HTML5, CSS and Javascript). In particular we make use of the Cordova hybrid application framework to develop and target multiple mobile platforms with a single codebase. We make use of the Ionic framework (Ionic Ver 3.x), one of the most popular mobile application frameworks, that is built with mobile-optimized HTML5 and CSS based components and Angular. You will learn about UI development with Ionic and then using Cordova's modules to access the native mobile platform's capabilities from Javascript. You should have already completed the Bootstrap 4 and the Angular courses in this specialization before proceeding with this course.
This course is part of the Full Stack Web and Multiplatform Mobile App Development Specialization
Offered By
Full Stack Web and Multiplatform Mobile App Development SpecializationThe Hong Kong University of Science and TechnologyAbout this Course
19,891 recent views
Learner Career Outcomes
38%
started a new career after completing these courses
33%
got a tangible career benefit from this course
18%
got a pay increase or promotion
Shareable Certificate
Earn a Certificate upon completion
100% online
Start instantly and learn at your own schedule.
Course 3 of 5 in the
Flexible deadlines
Reset deadlines in accordance to your schedule.
Approx. 33 hours to complete
English
Subtitles: Arabic, French, Portuguese (European), Chinese (Simplified), Italian, Vietnamese, Korean, German, Russian, Turkish, English, Spanish
Skills you will gain
Ionic (Mobile App Framework)Apache CordovaAngularjsMobile Application Development
Learner Career Outcomes
38%
started a new career after completing these courses
33%
got a tangible career benefit from this course
18%
got a pay increase or promotion
Shareable Certificate
Earn a Certificate upon completion
100% online
Start instantly and learn at your own schedule.
Course 3 of 5 in the
Flexible deadlines
Reset deadlines in accordance to your schedule.
Approx. 33 hours to complete
English
Subtitles: Arabic, French, Portuguese (European), Chinese (Simplified), Italian, Vietnamese, Korean, German, Russian, Turkish, English, Spanish
Offered by
The Hong Kong University of Science and Technology
HKUST - A dynamic, international research university, in relentless pursuit of excellence, leading the advance of science and technology, and educating the new generation of front-runners for Asia and the world.
Syllabus - What you will learn from this course
12 hours to complete
Hybrid Mobile App Development Frameworks: An Introduction
This module introduces you to hybrid mobile application development. You will learn about the Ionic framework and explore some of the features of the Ionic framework to implement an Ionic app based on the Angular application that was implemented in the previous course on Angular.
12 hours to complete
19 videos (Total 313 min), 28 readings, 2 quizzes
19 videos
How to Use the Learning Resources10m
What is Full-Stack Web Development?6m
Exercise (Video): Setting up Git6m
Exercise (Video): Basic Git Commands18m
Exercise (Video): Online Git Repositories12m
Node.js and NPM3m
Exercise (Video): Setting up Node.js and NPM2m
Exercise (Video): Basics of Node.js and NPM23m
Hybrid Mobile App Development24m
Introduction to the Ionic Framework7m
Exercise (Video): Setting up the Ionic Framework9m
Exercise (Video): Setting up a Server using json-server6m
Ionic and Angular21m
Exercise (Video): Getting Started with your Ionic App23m
Exercise (Video): Ionic and Angular56m
Ionic Navigation19m
Exercise (Video): Ionic Navigation42m
Assignment 1 Requirements (Video): Introduction to Ionic Framework5m
28 readings
Welcome to Multiplatform Mobile App Development with Web Technologies: Ionic and Cordova: Additional Resources10m
Full Stack Web Development: The Big Picture: Objectives and Outcomes10m
Full Stack Web Development: Additional Resources10m
Setting up Your Development Environment: Git and Node: Objectives and Outcomes10m
Setting up your Development Environment10m
Exercise (Instructions): Setting up Git10m
Exercise (Instructions): Basic Git Commands10m
Exercise (Instructions): Online Git Repositories10m
Exercise (Instructions): Setting up Node.js and NPM10m
Exercise (Instructions): Basics of Node.js and NPM10m
Setting up your Development Environment: Git and Node: Additional Resources10m
Hybrid Mobile App Development: An Overview: Objectives and Outcomes10m
Exercise (Instructions): Setting up the Ionic Framework10m
Hybrid Mobile App Development: An Overview: Additional Resources10m
Setting up a Simple Server: Objectives and Outcomes10m
Exercise (Instructions): Setting up a Server using json-server10m
Setting up a Simple Server: Additional Resources10m
Ionic and Angular: Objectives and Outcomes10m
Exercise (Instructions): Getting Started with your Ionic App10m
Exercise (Instructions): Ionic and Angular10m
Ionic and Angular: Additional Resources10m
Ionic Navigation: Objectives and Outcomes10m
Exercise (Instructions): Ionic Navigation10m
Ionic Navigation: Additional Resources10m
Assignment 1: Introduction to Ionic Framework: Additional Resources10m
Ideation: Objectives and Outcomes10m
Ideation Report Template10m
Ideation: Additional Resources10m
8 hours to complete
Ionic Components
This module explores the Ionic support for forms. Advanced features of Ionic lists are discussed. In addition all the different methods of overlaying information on the screen like modals, popups, popovers, action sheets, and loading are examined. Ionic support for gestures is also briefly considered.
8 hours to complete
11 videos (Total 153 min), 18 readings, 2 quizzes
11 videos
Exercise (Video): Floating Action Button13m
Exercise (Video): FAB and Favorites13m
Ionic Lists: Advanced Features4m
Exercise (Video): Ionic Lists: Advanced Features37m
Ionic Forms and Modals12m
Exercise (Video): Modal13m
Exercise (Video): Forms16m
Alerts, Toasts, Popovers, ActionSheets and Loading6m
Exercise (Video): Alerts, Toasts and Loading19m
Assignment 2: Ionic Components9m
18 readings
Floating Action Buttons: Objectives and Outcomes10m
Exercise (Instructions): Floating Action Button10m
Exercise (Instructions): FAB and Favorites10m
Floating Action Buttons: Additional Resources10m
Ionic Lists: Advanced Features: Objectives and Outcomes10m
Exercise (Instructions): Ionic Lists: Advanced Features10m
Ionic Lists: Advanced Features: Additional Resources10m
Ionic Forms and Modals: Objectives and Outcomes10m
Exercise (Instructions): Modal10m
Exercise (Instructions): Forms10m
Ionic Forms and Modals: Additional Resources10m
Alerts, Popovers, ActionSheets, Loading and Gestures: Objectives and Outcomes10m
Exercise (Instructions): Alerts, Toasts and Loading10m
Alerts, Popovers, ActionSheets, Loading and Gestures: Additional Resources10m
Assignment 2: Ionic Components: Additional Resources10m
UI Design and Prototyping: Objectives and Outcomes10m
UI Design and Prototyping Report Template10m
UI Design and Prototyping: Additional Resources10m
6 hours to complete
Ionic Split Pane, Grid and Storage, and Deploying your App
In this module you will learn about using local storage within your app. You will then learn about configuring your machine for building your app for various platforms, and deploying your app to emulators and devices.
6 hours to complete
11 videos (Total 127 min), 16 readings, 1 quiz
11 videos
Exercise (Video): Ionic Split Pane13m
Exercise (Video): Ionic Grid9m
Ionic Storage6m
Exercise (Video): Ionic Storage27m
Installing Android Studio and Android SDK13m
Installing Xcode on Mac and iOS SDK4m
Introduction to Cordova12m
Exercise (Video): Building and Deploying to Android Emulator10m
Exercise (Video): Building and Deploying to iOS Emulator4m
Assignment 3 Requirements: Grid and Storage4m
16 readings
Adapting to Large Screens: Objectives and Outcomes10m
Exercise (Instructions): Ionic Split Pane10m
Exercise (Instructions): Ionic Grid10m
Adapting to Large Screens: Additional Resources10m
Ionic Storage: Objectives and Outcomes10m
Exercise (Instructions): Ionic Storage10m
Ionic Storage: Additional Resources10m
Installing Android and iOS SDK and Platforms: Objectives and Outcomes10m
Installing Android Studio and Android SDK: Ionic and Cordova Guides10m
Installing Xcode on Mac and iOS SDK: Ionic and Cordova Guides10m
Installing Android and iOS SDK and Platforms: Additional Resources10m
Ionic Adding Platforms, Building and Deploying the App: Objectives and Outcomes10m
Exercise (Instructions): Building and Deploying to Android Emulator and Android Device10m
Exercise (Instructions): Building and Deploying to iOS Emulator10m
Ionic Adding Platforms, Building and Deploying the App: Additional Resources10m
Assignment 3: Grid and Storage: Additional Resources10m
8 hours to complete
Accessing Native Capabilities of Devices: Cordova and Ionic Native
In this module you will explore Cordova and the Ionic Native wrappers that enable you to access the native capabilities of the mobile devices. You will use a few plugins in order to understand the general concepts and the patterns for using these plugins within your Ionic application
8 hours to complete
13 videos (Total 143 min), 20 readings, 2 quizzes
13 videos
Exercise (Video): Customizing the SplashScreen16m
Notifying the User3m
Exercise (Video): Notifying the User10m
Social Sharing8m
Exercise (Video): Sending Email9m
Exercise (Video): Social Sharing11m
Using the Camera7m
Exercise (Video): Using the Camera39m
Network Status6m
Exercise (Video): Network Status13m
Assignment 4 (Requirements): Ionic Native and Cordova4m
Conclusions3m
20 readings
Introduction to Ionic Native: Objectives and Outcomes10m
Exercise (Instructions): Customizing the SplashScreen10m
Introduction to Ionic Native: Additional Resources10m
Notifying the User: Objectives and Outcomes10m
Exercise (Instructions): Notifying the User10m
Notifying the User: Additional Resources10m
Social Sharing: Objectives and Outcomes10m
Exercise (Instructions): Sending Email10m
Exercise (Instructions): Social Sharing10m
Social Sharing: Additional Resources10m
Using the Camera: Objectives and Outcomes10m
Exercise (Instructions): Using the Camera10m
Using the Camera: Additional Resources10m
Network Status: Objectives and Outcomes10m
Exercise (Instructions): Network Status10m
Network Status: Additional Resources10m
Assignment 4: Ionic Native and Cordova: Additional Resources10m
Conclusions: Additional Resources10m
Project Implementation: Objectives and Outcomes10m
Final Report Template10m
Reviews
TOP REVIEWS FROM MULTIPLATFORM MOBILE APP DEVELOPMENT WITH WEB TECHNOLOGIES: IONIC AND CORDOVA
by VMMay 20, 2018
Content of course is informative and flow is well maintained. Only pain point has been the peer review process. Thanks to support team for answering my queries on assignment review!
by PPOct 26, 2020
Enjoyed learning and included all details as required by course. If require content can be updated as per ionic latest v5.4 as of now.
by GQMay 30, 2018
Another great course! Enjoyed how it builds upon the previous Angular course to show you how to create a multiplatform mobile app!
by SHOct 27, 2019
Ionic has new updated framework which has new methodology. It would be nice if course can be updated to cover new version
About the Full Stack Web and Multiplatform Mobile App Development Specialization
Learn front-end and hybrid mobile development, with server-side support, for implementing a multi-platform solution.
Frequently Asked Questions
When will I have access to the lectures and assignments?
What will I get if I subscribe to this Specialization?
Is financial aid available?
Will I earn university credit for completing the Course?
More questions? Visit the Learner Help Center.
