- 2.5 hours on-demand video
- Full lifetime access
- Access on mobile and TV
- Certificate of Completion
Get your team access to 4,000+ top Udemy courses anytime, anywhere.Try Udemy for Business
- Build apps with Ionic Framework and Angular
- Use Ionic Components and Features to build UI
- Build and deploy apps on Android and iOS
- Build competely cross platform apps for Android and iOS
- Use commands to create a build for release
- Release the apps to the Google Play Store
In this module, we will start our journey slowly and get ready for the ride ahead. We will setup our system by installing required tools and packages on our computer so that we can get started with developing an Ionic app. We will also learn about the Ionic CLI.
In this lecture, we will install the required tools and packages we will in our journey with Ionic. We will install NodeJS and VS Code. Once we have these two installed, we will need to install the Ionic CLI and Cordova.
In this lecture, we will create our very first Ionic App using the Ionic CLI. It is just too simple. Once the project is created, we will open the project in our favourite text editor, VS Code.
In this lecture, we will learn how a typical Ionic app looks like. We will learn what each file does for a project and roles of most important pieces of an App. We will learn what each folder in an app contains and where we will be focussing for the rest of the course.
Time to get our hands dirty! In this lecture, we will run our Ionic app in a we browser.
A web browser is good to test your app while in development but ultimately, you might want to run your app on a real device or emulator. So, in this lecture, we will learn how to run an Ionic app on an Android emulator.
From this lecture onwards, we are going to learn how to build the UI of a mobile app using the Ionic Framework. We will be using the same HelloWorld! Application for now. Open the same project in VS Code and follow along. In this lecture, we will learn about creating Buttons and FABs in Ionic.
In this lecture, we are going to learn about lists that we have already touched on a little bit before. But in this video, we are going to dive into more detail as lists are one of the most used components in real world apps. Ionic offers of lot lists types and styles and we will look at simple lists in this video and we will learn an advanced list type in the next one. So let's get started.
In this lecture, we will learn how to create Grids in Ionic. Grid lets you define rows and columns. You have the flexibility of defining how you want your rows and columns. It adopts the Bootstrap 12 column grid system— which is a popular web design framework. The grid is composed of three units — grid, rows and columns.
In the last lecture, we learned about how to use the TS code to interact with buttons and text input fields. We learned how to use
ngModel and global variables to access and modify the values in the view as well. In this lecture, we are going to do the same with some more Ionic components like Checkboxes, Selects and Radio buttons.
In this lecture, we are going to learn about using the AlertController in Ionic. AlertController is used to display alerts, confirmations and prompt dialogs to the user. There are multiple ways you can use alerts in your apps. We will look at the ways we can create and display alerts, prompts and confirmations to the user.
In this lecture, we will learn about using the ToastContoller in Ionic. ToastController is used to display nice and small toast notifications to the user. These notifications are generally used to display very small bits of information to the user and typically, they disappear after a few seconds.
In this lecture, we are going to learn another of the wonderful components that Ionic has. We will learn about
ActionSheetController. Action Sheets slide up from the bottom edge of the device screen, and display a set of options with the ability to confirm or cancel an action.
So far in the course, we have learned about the Ionic CLI and just used it to create the Ionic App that we have been using since the beginning. We have learned about various components in Ionic and we did all that in one single page. In real apps, there are multiple pages serving different purposes. In this lecture, we will learn how create new pages in Ionic using the Ionic CLI.
In this lecture, we will learn how we can send data from one page to another. In real world apps, we need to send information between pages to create good user experiences. We can send data to a page when we push that page on the navigational stack and then receive that data in the page's constructor and use it however we want.
In this lecture, we will learn how to fetch data from a Web API and display the information retrieved in the app. Nowadays, all mobile apps use Web APIs, so this lecture is a very important one and will help you understand how real apps work.
- Understand of how mobile devices and apps work
- Introductory knowledge of HTML, CSS and JS
- Basic knowledge of TypeScript/Angular would be an advantage but not required
- A computer with an active internet connection
Ionic Framework is one of the most popular frameworks for cross-platform mobile app development. It lets you build truly hybrid mobile apps for both Android and iOS using web technologies like HTML, SCSS and TypeScript. This course covers the latest version of Ionic, Ionic Framework v3 which uses Angular as the backing framework.
This course is an essential for Web Developers, Professionals and Students who wish to develop Mobile Apps using the web development skills they have (HTML, SCSS and TypeScript).
At the end of this course, you will be able to develop mobile apps for Android and iOS using the web development skills you already have. We will start by understanding the basics of Ionic and Cordova. We will also understand the role of Angular in Ionic Apps and then move on to learning to create and run Ionic Apps. You will learn to create user interfaces using basic and advanced Ionic Components. You will learn to use basic components like Buttons, Lists, Cards, Icons, RadioButtons, CheckBoxes, Inputs and much more. You will also learn to add interactivity to these components using Angular and TypeScript. Lastly, we will move on to using more advanced components like Loading, Toast, Alerts, Popovers and Modals. You will also learn about navigation between different pages within the app.
While the course, you will learn how to use Angular to build apps that work on Android and iOS. Later in the course you will work on a real app called, "WeatherIonic", that tells weather information for any city in the world. Cool right?
Finally, we will learn to build and publish Ionic Apps to the Google Play Store.
And once you have started, sky is the limit.
- Eventerpreneurs with an idea but no knowledge of complex app development
- Students willing to build mobile apps for Android, iOS and Windows using Web Technologies
- Professionals willing to build apps for multiple platforms in least amount of time
- Everyone who has web skills and wants to build mobile apps using web technologies
- Professionals who want to expand their skill set and learn to develop apps.