Ionic End to End

Ionic is a hybrid mobile development platform. In this course, you'll learn exactly how to use Ionic and its included components to build your own release ready mobile application.
Course info
Rating
(35)
Level
Beginner
Updated
Nov 6, 2017
Duration
3h 8m
Table of contents
Course Overview
Introduction
Introduction to Ionic
Starting the App
Configure the Rewards Program and Push Notifications
Creating the Menu
Building the App
Description
Course info
Rating
(35)
Level
Beginner
Updated
Nov 6, 2017
Duration
3h 8m
Description

When attempting to build a mobile app you often don't know where to start. In this course, Ionic End to End, you'll learn to use the Ionic framework to create a mobile application. First, you'll discover how to generate a project and add an authentication system to register your users. Next, you'll explore how to create a rewards system to entice users to login to your application. Finally, you'll learn how to add an ordering system that uses Paypal to process payments. When you're finished with this course, you'll have the necessary skills to build your own mobile applications for release on the app store. Software required: NodeJS.

About the author
About the author

After over 16 years in IT, Reggie finally decided to follow a long-term dream of learning to code. The path Reggie chose led him to pick up JavaScript, and building Web and mobile apps.

More from the author
React Native Fundamentals
Intermediate
2h 38m
Jun 18, 2018
Angular 2 End-to-end
Beginner
2h 40m
Apr 17, 2017
Section Introduction Transcripts
Section Introduction Transcripts

Course Overview
Hi everyone! My name is Reggie Dawson, and welcome to my course, Ionic End to End. I am a freelance web developer who enjoys building a variety of projects. Ionic is a hybrid mobile development platform that uses Angular and allows you to build mobile apps using the existing skills you already have. In this course, we're going to build a complete mobile app ready for release to the respective app store. Some of the major topics that we cover include Configuring a User Registration system, Creating a Rewards Program, Enabling Push Notification, Enabling Online Ordering, and Processing Payments with PayPal. By the end of the course, you'll know the basics of using Ionic and how to build your own mobile app. Before beginning the course, you should be familiar with JavaScript and Angular. I hope you'll join me on this journey to learn Ionic with the Ionic End to End course at Pluralsight.

Starting the App
Welcome back to the Ionic End to End course. Now that we have the conceptual phase of the course out of the way, we can get started building our app. Sometimes the concepts without practical examples can be a bit much, but the information will help you understand what we will go over better. We are going to be building the app for the fictional Wired Coffee Company. This app will allow users to order online, as well as obtain rewards for just using the app. The first thing we will do is generate our project. After that, we will configure the splash pages and icons for our app. This will control the image displayed as the app is starting, as well as the icon that represents the app on the device. Once we have that finished, we will then configure the menu that will be displayed when users launch the app. We will use the Ionic cards to form this menu, which will be the main navigation around the app. After that, the rest of the module consists of configuring the user registration and login system. As an incentive to sign up and use the app, creating an account and logging in will be how our user will generate rewards that offer discounts on their orders. As a reward for the business owner, they will obtain the email addresses of all the end users of their app. Some other metrics about the end user will also be saved such as how many times they have logged in and how many rewards they have generated. After this module is finished, the authentication system will be in place that other features such as the rewards program depend on.

Configure the Rewards Program and Push Notifications
Hello everyone! Welcome back to the Ionic End to End course. Now it may seem odd at times how I'm building this project since we haven't made it to the main feature of the app yet, the menu with online ordering. For end users, this will probably be the most important feature for them. But for us as the developer, the parts of the app we have added so far have to be in place first. That's the thing--every part of the app that we have added so far is because the next piece will need it to work properly. First, we started with the authentication system because the next part, the rewards system, will depend on this to work properly. In exchange for some discount, we want to obtain the email addresses of our users, so we needed authentication before we could even start on anything else. In this module, we still won't be configuring the menu, but we will be setting up the rewards system that will generate rewards for the users of the app. After that, we will configure the account page of the app so our users will be able to view the rewards that they have generated. Now once we finish with the account page, we will configure our app to accept push notifications. And then after that, we will finish off the About Us and the Location pages. Once we are done with this module, the last thing we will need to add will be the menu system for our app to be complete.

Creating the Menu
Welcome back to the Ionic End to End course. Now that we have all of the pieces in place, in this module, we will add the menu and online ordering system. The first thing we will do is set up the service that provides the items for the menu. The data will be hardcoded inside of the app so we don't have to use the customer's bandwidth. Now after that, we will use the service to populate the menu that we will display to end users. Now after we get the menu set up, the next part we add will be the shopping cart to hold the items the customers want to purchase. As with the other parts of this app, this will be a completely independent system that will simply store the items from the menu. After that, we will add a checkout page that we will use to process the order. Now this will be a three-part process, and at first we just have to display the items to purchase. Then after that, we will need to apply the rewards to the order. Regular users of the app will generate these rewards, but what is the point if they can't use them? Then after we get the rewards working, the last part will be processing payments through PayPal. Working with payment processors can be complicated, but PayPal will make our lives easier. After this module is finished, you'll have a complete app ready for release to the App Store.

Building the App
Hello everyone! Welcome back to the Angular End to End course. Now that we have completed our app, all that is left is to produce a production build of it. After all, we have been building a mobile app, so it should be run on a mobile device. In this module, the only thing we will do is look at the process for compiling our app into a production build. The local build requires that you have the SDK of the platform you are compiling for installed on your machine. As long as you have that, you will be able to compile your app. Ionic Package has the advantage of being able to compile for any platform. Unfortunately, we are limited in the kind of releases that we can generate with Ionic Package under the free plan. The good news is that the Ionic Pro Services are really affordable so won't be that much of a setback to invest in them. At any rate, the journey is almost at an end. After one more clip, you'll have an operational mobile app ready to install on a device.