Creating Ionic Applications with Angular (formerly Building Mobile Apps with Ionic & Angular) is an all-in-one resource for learning the latest and greatest version of Ionic. It has been updated for every major release, so you can rest easy knowing that you're not learning outdated tech.
Completely updated for Ionic 5!
PDF, EPUB & MOBI
Expert package ~853 pages
In-depth coverage of basics
5 Full Example Applications
2 Premium Ionic Themes
Builds for iOS, Android, PWA
All Source Code Included
BONUS: 1.5 Hour Video Course
Updates always free
Ionic will change what you think about mobile apps and the future of the web forever
- Max Lynch
Ionic uses cutting edge web tech to create quality mobile user interface components that work on the web, in native applications, and even on desktop.
Throw Capacitor into the mix, and we can easily create native builds and access native iOS and Android APIs - all from a single codebase.
Learn all the theory you will need, build these 5 applications, and then learn how to create production builds and submit to app stores
If you haven't at least heard of Ionic, then you're probably completely new to native web application development - and that's completely okay, this eBook makes no assumption of skill levels and will walk you through basic concepts, to more advanced concepts and all the way to submitting your application on the Apple App Store and Google Play.
You've used Ionic before, but want to learn the latest version of Ionic
You've used other mobile development frameworks but want to switch to Ionic
You're completely new to mobile app development, and you may not have even developed an app before
Although we often refer to applications built with this tech stack as just Ionic applications, we will actually be using three frameworks in unison to create our applications. Even though we are using three different frameworks, they are all integrated together so it will mostly feel like you are just learning a single framework rather than three at once.
Ionic is what is mostly responsible for providing the mobile user interface components for the application. These are things like scrolling lists, toolbars, buttons, tabs, cards, and so on. As well as providing these elements of the application, Ionic also handles animating page transitions, adapting the style of the application to match the platform it is running on, and it also provides a lot of tooling to help make developing your applications easier.
Capacitor is what allows our applications to run on multiple platforms. It handles creating the native iOS and Android builds for us so that we can install the applications on our devices and submit them to app stores. It also provides us with a generic API to access, and then translates that into the appropriate requests for each platform. The way you interact with the Camera in an iOS application is different to how you interact with it in an Android application, but Capacitor allows us to just make a single call, to a single method, from our single codebase, and it will handle what needs to be done to use the Camera API behind the scenes.
You do not need prior knowledge of any of these technologies in order to use this book.
The image below is a visual representation of how these technologies work together. Ionic and Angular operate entirely in the "web zone", and Capacitor acts sort of like a translator that sits between our Ionic application and whatever platform it is currently running on.
One of the greatest benefits of using Ionic is that it runs entirely on web code, and this means that an Ionic application can run anywhere the web does without requiring modifications. This means that you can write a single application and have it work on multiple platforms.
We will be specifically covering building for three major mobile platforms in this book (iOS, Android, PWA) but that's not even the limit. You could run an Ionic application anywhere the web runs. You can even create native desktop applications with Ionic.
This is a powerful benefit, as creating an application using native code means developing a separate application for each platform (and will require developers who understand how to write code for that platform). Even the native cross platform options that allow you to write code using a single syntax to create applications for multiple platforms still require a certain degree of customisation for the different platforms, because that code is being converted into native code specific to a particular platform/device. The web works the same no matter what platform you are running on, so you don't need to worry about changing the code you are using.
This book will teach you how to create a single codebase using Ionic, and then deploy that as:
A progressive web application (PWA) that can be installed on the user's device directly from a website
A native iOS application that can be distributed through the Apple App Store
A native Android application that can be distributed through Google Play
The cool thing about this is that I don't need to teach you a separate set of skills for each of these platforms. The vast majority of the book will just teach you how to build generic Ionic/Angular/Capacitor applications. Distributing to various platforms is just a few extra steps at the end of the book.
The most recent version of Ionic (Ionic 5) is built using web components. You may be familiar with web components, or you may not, what is important to understand is that this now allows Ionic to work with any framework or no framework at all. We need Ionic to provide our mobile user interface components, and we need Capacitor to allow the application to run seamlessly on multiple platforms, but you might wonder why we are specifically using the Angular framework for this book.
First of all, there are a lot of benefits to using a framework in conjunction with Ionic. Whilst including a framework does add some extra weight to the application, the benefits far outweigh the relatively small increase in application size. When using a framework, you have most of the tools you need to build an application right out of the box, rather than having to build out common solutions yourself or find external packages to fill that role. Things that frameworks provide out of the box would take an enormous effort to build yourself (and it probably won't end up being as good).
In the past, Ionic only worked with the Angular framework. But now that we can use Ionic with any framework in the entire world (Ok... most people would be using either Angular, React, Vue, or StencilJS) why are we sticking with Angular in this book?
Since Ionic and Angular have been an inseparable pair in the past, there is already a lot of support for Angular both in the tooling and in the community that surrounds Ionic. Ionic provides additional libraries and tooling that make developing Ionic applications with Angular easier. Angular also has a heavy focus on optimising for mobile use, and this makes it a fantastic choice for Ionic development.
WHY SHOULD I READ THIS EBOOK?
If you are looking for a single resource that will teach you everything you need to know about Ionic in order to get your skills to a competent level, then this is it. The technologies that I have been discussing above are an absolute pleasure to build with, but it can be difficult trying to piece together how everything works initially.
I've been writing about and teaching Ionic for many years, and since the initial release of this book back during the Ionic 2 alpha I have rewritten, refined, and republished the book over 23 times (and these updates will always be released for free to those who purchase the book). Over a thousand people have purchased this book and its resources, and I've used their feedback to help improve the book further.
With my experience in teaching over the past few years, and the feedback that I have received for this book and my other learning resources, I strongly believe that this resource has everything you need to become a competent Ionic developer. There will be more to learn once you are finished with the book and its resources (there always is), but you will have a solid understanding of all of the important concepts, and a good sense of how to build the most common types of applications.
“ For anyone that needs a full guide to getting started with Ionic I recommend Josh's book. It's without a doubt one of the best technical books I've read. I went through it during the weekend and started building my first complex Ionic app on Monday, it's worth every $$. ”
Check out the book structure below to see exactly what you're in for.
More content is available in the higher tier packages, which is indicated by the Level 1, Level 2, and Level 3 tags.
Table of Contents
Section 1: Introduction
Level 1Level 2Level 3Lesson 1: Welcome
Level 1Level 2Level 3Lesson 2: An Overview of the Ionic Ecosystem
Quicklists is the de facto step-by-step tutorial application for this course - no matter which of the packages you purchased, you will have access to this lesson. The reason I chose Quicklists to fill this role is because it covers a broad range of the core concepts in Ionic, and the skills you learn throughout building this application will be used frequently in most other applications you create.
Topics covered include:
Forms and User Input
Passing Data Between Pages
Creating, Reading, Updating and Deleting Data
Data Storage and Retrieval
Level 2Level 3
Giflist is a pretty simple application, the general idea is that a user can enter in any subreddit from Reddit, and the app will fetch and display GIFs from that subreddit.
As well as just fetching GIFs from Reddit, users will also be able to supply some settings to configure the application to their preferences. Although the concept is pretty simple, there are a few interesting things that you will learn through building it, this will include:
Fetching JSON data from a 3rd party API
Level 2Level 3
Snapaday is based around everybody's favourite native plugin, the camera. I don't actually have any data to back that claim up, but the camera is definitely one of the coolest integrations.
In fact, Snapaday is pretty much the "native plugin app" in this eBook - as well as covering how to use the camera we'll also be integrating local notifications and social sharing (we've got to get those selfies on Facebook right?). Here's a summary of what you'll be learning:
How to integrate native plugins
How to use the Camera API
How to use the File API
How to use local notifications
How to use modals
How to create your own custom service
How to store files permanently on a device
Camper Mate is an interesting application to build because it doesn't really have one specific purpose like the other applications, it's a bit of a utility tool belt kind of app. It provides a bunch of different features to users that might be useful for them when going on caravan or camping trips.
The two most important concepts we'll be covering in this application are the integration and use of Google Maps and the use of forms for capturing user input.
Creating forms and capturing user data
Implementing Google Maps and creating a custom component to handle that
Creating a tabs layout with Angular routing
Saving and retrieving multiple sets of data
Camper Chat is a live chat application. Users will be able to log in with their Facebook account and chat all things caravan and camping with anybody else who is using the application. The coolest thing about this application is the integration with Firebase. We will use Firebase both for authentication and for storing data in a Firestore database that will allow for communication and live data updates. Here's what we will cover:
Navigation and restricting access to routes
Using a sliding menu
Using Firebase/Firestore to store data
Using Firebase for authentication
Using the Facebook API for native and web authentication
Configuring native projects for plugin integrations
Updating and displaying data in real-time
“ You've really delivered a lot of value for the price and to be honest, I can't say that about all the authors I've supported in the past. I'd like to wholeheartedly thank you. The book has been an invaluable resource while working on our current project. The reading on my Kindle has been a real blessing because I can literally read about Ionic in bed :) ”
The EXPERT package of Creating Ionic Applications with Angular also comes with an additional 1.5hr video course. The video course is intended to give you a brief overview of the most important Ionic and Angular features and concepts as we build a simple Todo application.
You can watch the following lesson for free to see what the video course is like:
“ Just wanted to say thank you - I started learning Ionic (and Angular) almost a year ago with your book, and I've learned everything I needed not only for developing several mobile apps, but also to become one of the top Ionic users on StackOverflow. Your book really helped me to learn the core concepts, and then go a step forward understanding what every piece of code does, and how. ”
Sebastián Ferreras - Information Software Engineer
“ I wanted to reach out to you and say thank you so much for putting this book together, as well as all of your videos on YouTube. I'm a single founder of an ed-tech startup, and while a software developer for 17 years, Ionic/Angular/Cordova was new to me. I honestly feel as though I have expert insight that I can tap into as I push forward to getting my app successfully deployed. Based on what I already knew, and coupled with your book, I'm now prepared and motivated to move forward. ”
Once you have purchased the package you want, you will receive a downloadable package that will contain all of the content for the book. The downloadable package will give you access to all of the content for your package, including all of the source code for the applications in your package. This will be available instantly after you make the purchase.
Can I use the example applications to build my own apps?
Yes, you may use the source code provided as you please (even commercially), however I ask that you do not submit an exact copy to app stores (we will walk through all of the steps for submitting an application, just don't hit that final submit button if you're using the example we have built).
Keep in mind that these examples are provided primarily for educational purposes, and no guarantees are provided for their functionality.
Will I need to pay for updates?
No - I typically update all of my Ionic books and courses for new major versions, and sometimes updates are also provided between major versions if necessary. Any updates to the package you have bought will always be free.
What version of Ionic/Angular was this created for?
The current version of the book has been written for Ionic 5.x (which currently uses Angular 10.x by default).
What if I don't like the book?
If you feel like the book was not worth your money, then I will gladly refund you the full price. Simply reply to your purchase receipt email requesting a refund within 14 days.
Still have a question?
Feel free to contact me at firstname.lastname@example.org and I'd be happy to answer any questions you have about the book.