Ionic 4 - Build PWA and Mobile Apps with Angular
4.2 (219 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
970 students enrolled

Ionic 4 - Build PWA and Mobile Apps with Angular

Build Progressive Web Apps, Native Android and iOS Apps with Ionic 4 and Angular
4.2 (219 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
970 students enrolled
Created by Baljeet Singh
Last updated 8/2019
English
Current price: $31.99 Original price: $49.99 Discount: 36% off
21 hours left at this price!
30-Day Money-Back Guarantee
This course includes
  • 3.5 hours on-demand video
  • 5 articles
  • 11 downloadable resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • Build Native Mobile Apps with Ionic 4
  • Build PWA with Ionic 4
  • Getting to know Ionic 4
Course content
Expand all 61 lectures 03:39:09
+ Getting Started
4 lectures 08:06
About Angular
01:57
About Ionic
03:13
Setup Development Environment
01:22
+ Angular Fundamentals
9 lectures 34:39
Introduction
00:35
Creating New Project
04:03
Adding Components
04:31
Angular Routing
04:23
Note Regarding Lazy Loading Routes
00:20
Adding and Lazy Loading Components
06:36
Adding Services
08:07
+ Ionic Fundamentals
12 lectures 01:09:48
Introduction
00:43
Installing Ionic CLI
00:54
Creating New Project
03:08
Note Regarding Lazy Loading Routes
00:22
Understanding the Structure of Ionic Project
05:55
Ionic Generator
07:05
Adding Shared Component
06:22
Adding Tabs Inside the Sidemenu Template
11:27
Adding Sidemenu Inside the Tabs Template
06:04
+ Creating News Application With Rest API
27 lectures 01:33:19
Introduction
00:28
Creating New Project
01:02
Generating New Pages and Updating Tabs Menu
05:58
Adding UI For The Top News Page
03:30
Using Ionic Lab
01:20
Creating News Service and Fetching Top News
08:58
Using async Operator
02:15
Moves Pages to Pages directory Similar to Ionic 3
01:50
Creating Shared Components
05:57
Using HttpParamas to Pass the apiKey
01:15
Finalize Top News Page
02:31
Show Loading Spinner While Fetching Data
05:48
Adding Pull To Refresh Functionality
02:55
Headlines Page UI - Horizontal Scrolling List
03:51
Getting Data Based on a Specific Category
05:00
Getting Category Data on the First Load
02:26
Using Skeleton Screens For Perceived Performance
03:11
Working on the Sources Page
05:16
Adding Search Pipe to Filter Between Different Sources
05:19
Adding Single Source Page and Back Button
03:52
Showing Selected Source Articles
03:54
Using Sliding Options to Add to Favorites
01:45
Using Ionic Storage
06:07
Adding Refresh Button To The Favorites
01:46
Showing Toast Message
01:52
Removing The Source From Favorites
02:02
Adding Settings Page
03:11
+ Building and Publishing Application
8 lectures 12:55
Introduction
00:51
Adding PWA Support and Building App For Production
02:13
Deploying PWA on Firbase Hosting
02:01
Installing PWA on The Mobile Device
02:17
Running Application Inside the Android Emulator
01:07
Publishing Application on Android Play Store
01:48
Publishing Application on iOS App Store
01:57
Publishing Application as Electron Desktop App
00:39
Requirements
  • Basic HTML, CSS, JS knowledge
  • Typescript, Angular Fundamentals
Description

We can use Angular to create powerful frontend web applications powered by TypeScript / JavaScript. What if we can use the Angular knowledge to build applications that can be published as progressive web apps, native mobile apps running on any iOS or Android device and electron desktop apps with the same codebase.

Ionic 4 allows you to do just that.  We can use your existing Angular, HTML, JS and CSS knowledge and build PWA, native mobile apps. This allows you to focus on the things you know and release your application on all possible devices (desktop and mobile) without having to learn different technologies to build apps for different platforms.

Ionic 4 is completely based on web components (Using Stencil).

This course takes you from zero to published app, taking a very practice-orientated route. We'll build a news app throughout this course, we'll see how we can use the Ionic component library, how to fetch and handle user input, how to store data and much more!

We will touch on various topics like Architecture, Components, Navigation, Tabs, Sidemenus, User Input, Native Device Features, Storage, Http, etc...

And since building apps is only part of the fun, you'll of course also learn how to run your apps either in the browser, on an emulator or on your own device!

What exactly are you going to learn then?

  • Angular Refresher

  • Ionic Fundamentals

  • How to set up your Ionic 4 projects

  • Using different Ionic 4 templates Blank, Tabs, and Sidemenus

  • The basics about Ionic 4 - How navigation works, how your project is structured and you use its rich component library

  • Ionic 4 project architecture

  • Creating a user interface with the Beautiful Ionic 4 Components

  • Show Modals, Alerts, Toasts and many more useful UI components

  • Test the app in the browser, on emulators and real devices

  • Using Ionic storage

  • Building PWA and deploy on Firebase Hosting

  • and much more ...

So Let's Get Started.

Who this course is for:
  • Web developers and specifically Angular developers who want to build Native Mobile Apps and Progressive Web Apps (PWA)