Buying for a Team? Gift This Course
Wishlisted Wishlist

Please confirm that you want to add Ionic Framework 101: A Quickstart to Building Mobile Apps to your Wishlist.

Add to Wishlist

Ionic Framework 101: A Quickstart to Building Mobile Apps

A quickstart to learning how to make great looking Android and iOS apps in no time using Ionic Framework.
4.5 (44 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
233 students enrolled
Created by Nic Raboy
Last updated 9/2015
$10 $25 60% off
4 days left at this price!
30-Day Money-Back Guarantee
  • 2.5 hours on-demand video
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Have a coupon?

This course will teach you how to develop web-hybrid mobile applications for Android and iOS using Ionic Framework. We'll look at what is necessary to configure Ionic Framework on your Windows, Linux or Macintosh computer and develop visually pleasing applications with minimal amounts of code and design skills necessary.

Ionic Framework 101 is designed to be a quickstart for beginners looking to develop mobile applications. As a course goal, we'll create a fully functional URL shortener using the skills we developed through the span of the course.

Who is the target audience?
  • This Ionic Framework course is meant for people with at least some knowledge of HTML5 and JavaScript
  • This course is NOT meant for people looking to develop Windows Phone or BlackBerry applications
Students Who Viewed This Course Also Viewed
What Will I Learn?
Build Android and iOS applications
Know how to use Ionic Framework for mobile application development
View Curriculum
  • Must have the free to download Atom editor by GitHub installed for writing application code
  • Must have a Macintosh computer to build iOS applications as Linux and Windows can only build Android applications
  • A Macintosh computer is NOT required to participate in this course
Curriculum For This Course
Expand All 29 Lectures Collapse All 29 Lectures 02:41:30
Course Introduction
3 Lectures 08:48

Students will know more about the instructor and his background on developing mobile Android and iOS applications with Ionic Framework.

Preview 01:50

Students will learn about what Ionic Framework is and how it relates to other technologies like Apache Cordova or PhoneGap.

Preview 03:55

Students will learn how to start an Ionic Framework project from scratch and further develop it into a feature-rich mobile application. By the end of the course students will have developed a URL shortening application that uses the free TinyURL RESTful API.

Preview 03:03

What do we know about Ionic Framework and how it relates to other technologies? How will this course benefit any future mobile development that we do?

Ionic and our Expectations
5 questions
Getting Started
3 Lectures 23:29

Students will learn how to install Ionic Framework and all the dependencies necessary for building applications. Such dependencies include Apache Cordova and the Node Package Manager (NPM).

Preview 05:28

Students will download the latest Android SDK as well as any related platform tools necessary for building Android applications.

Installing the Android SDK

Students learn how to create a new Ionic Framework project from one of the existing templates using a Terminal or Command Prompt.

Creating a New Ionic Project

Test if you remember how to configure Ionic Framework on a new machine as well as other things like creating a new project.

Getting Started with a New App
4 questions
Available Components & CSS
4 Lectures 15:28

Students will be knowledgeable about what Ionic Framework components exist beyond the scope of this course and how to get information about them.

An Overview of the Ionic Framework Available Components

Students will learn how to add list items to the Ionic Framework list view component.

A Closer Look at the List View Component

Students will learn how to make list items swipe-able in an Ionic Framework list view component.

Add Swipe Gestures To List View Items

Students will learn how to use the IonIcons font package provided by Ionic Framework to add icons to their project that closely resemble those in standard Android and iOS applications.

Using IonIcons in Your Application
Functionality with AngularJS
5 Lectures 34:51

Students will learn how to design AngularJS controllers to better meet the needs for logic in their Ionic Framework application.

Adding AngularJS Controllers for Separating Logic

Students will learn how to take JavaScript object or array and loop through the data via the UI portion of their application, displaying each element on the screen.

Looping Through Objects and Arrays in the UI

Students will learn how to add multiple views (screens) to their application and navigate between them in an appropriate fashion.

Navigating to Different Views Using the UI-Router

Students will learn how to asynchronously perform tasks and return data based on their success.

Understanding $q and the AngularJS Promise

Students will learn how to make GET and POST HTTP requests to available RESTful APIs.

Performing RESTful Requests with the $http Service
Including Functionality Through External Plugins
3 Lectures 18:42

Students will learn that most JavaScript libraries can be included into an Ionic Framework mobile application. For example, students will see how to include the ngStorage JavaScript library into their project for easier management of their local storage data.

Manage Data Easier with the ngStorage JavaScript Library

Not all data can or should be accessed via an API. Students will learn how to launch the device web browser to view websites external to the application.

Launching External Web Pages with the Apache Cordova InAppBrowser Plugin

Not all Apache Cordova plugins are easy to use with Ionic Framework because they are vanilla JavaScript. Students will learn about how ngCordova makes various Apache Cordova plugins more AngularJS friendly.

Use ngCordova to Wrap Apache Cordova Plugins in AngularJS

Student knowledge will be tested in regards to adding native devices features to their Ionic Framework application.

Added Functionality with External Plugins
4 questions
Building a URL Shortener App
7 Lectures 39:03

Students will learn how to use the minimalistic TinyURL RESTful API for shortening URLs that can be distributed on social media websites such as Twitter and Facebook.

Understanding the TinyURL API

The URLs we shrink need to be displayed somewhere. Students will take their knowledge of the Ionic Framework list view and put it to use.

Creating the URL List View

Students will learn how to create a basic form with data that gets sent to a function upon submit.

Creating a View for Shrinking URLs

Students will know how to take their knowledge on $http RESTful requests and apply it towards a real API. In this case, students will learn how to shrink URLs with the TinyURL API.

Shrink URLs Defined by the User

Students will learn how store API data to prevent having to continuously make requests that use cellular data or use up API request quotas.

Storing Information About the Long and Short URL Data

Students will learn how to validate saved website URLs and then launch them in the device web browser.

Launching Saved URLs in the Web Browser

Students will learn how to make use of the swipe-able list items to implement delete functionality for removing particular URLs from the list.

Deleting Saved URLs from the List

How do we do various tasks like removing items from a list view or shrinking URLs using the TinyURL API? Questions about what we've learned when building our first app.

Building a URL Shortener App
3 questions
Preparing the Final Product for Release
3 Lectures 17:17

Students will learn how to take their project and build a version of it for Android as well as iOS (provided they are using a Mac).

Building the Application for Android and iOS

Students will learn how to simulate the Android version of their application in a simulator superior to what ships with the Android SDK. Students will also learn how to test their application in an iOS simulator.

Testing the Application Using the Genymotion Android Simulator and iOS Simulator

Students will learn how to check for bugs or troubleshoot in the Android version of their Ionic Framework mobile application.

Debugging the Android Application with ADB

Be tested to see if you remember how to build and application, test it with tools like Genymotion, and troubleshoot it for bugs or errors.

Building, Testing, and Troubleshooting an Ionic Application
3 questions
Course Conclusion
1 Lecture 03:52
Summary of Course and Source Code
About the Instructor
4.5 Average rating
212 Reviews
1,050 Students
4 Courses
Developer Advocate & Software Engineer

Nic Raboy is an application developer who has released several mobile applications to both iTunes and Google Play and is a part of several major projects. He is a polyglot programmer that is proficient in Node, Java, Ionic Framework, AngularJS, NoSQL, and Android.

The applications he has released to iTunes and Google Play were developed using either native code or hybrid technologies like Ionic Framework making him qualified to share his experiences to other developers.

Report Abuse