weekend

Watch User Created Playlist (5)

This playlist is user created.

pro-course-rss-logo

PRO RSS Feed

Convert a Web Application into an Ionic App

P

Build, Emulate, and Debug an Ionic App

P

Prepare an Ionic App for Ionic Components and Styling

P

Device Interaction in an Ionic App with Cordova Plugins

P

Build a Sidebar Layout with Ionic

P
angularjs tutorial about Convert a Web Application into an Ionic App

Convert a Web Application into an Ionic App

2:24 angularjs PRO

In this lesson, we are going to demonstrate how easy it is to copy existing Angular code into an Ionic app. It is literally as simple as removing unnecessary code from the Ionic app and pasting in the guts of our Angular application. Along the way, we will update some dependencies and discover a gotcha for including assets from a CDN.

angularjs tutorial about Build, Emulate, and Debug an Ionic App

Build, Emulate, and Debug an Ionic App

2:53 angularjs PRO

In this lesson, we are going to build an Ionic app for the iOS platform, and then emulate iOS on our computer. We are going to cover some important command-line options when emulating an Ionic application. We will then see how these options play a critical role in debugging our applications.

angularjs tutorial about Prepare an Ionic App for Ionic Components and Styling

Prepare an Ionic App for Ionic Components and Styling

2:12 angularjs PRO

In this lesson, we are going to include the necessary assets for the functionality and styles of the Ionic directives we will include in our app.

angularjs tutorial about Device Interaction in an Ionic App with Cordova Plugins

Device Interaction in an Ionic App with Cordova Plugins

4:59 angularjs PRO

In this lesson, we are going to learn how to interact with native components through Cordova plugins. We will walk through how to add a Cordova plugin to our application and use it to interact with our native device. In this case, we are going to install a plugin that will allow us to open URLs in a mobile browser from within our Ionic app.

  • item
  • item
angularjs tutorial about Build a Sidebar Layout with Ionic

Build a Sidebar Layout with Ionic

8:49 angularjs PRO

In this lesson, we learn how to build a sidebar layout using only Ionic directives. Ionic provides some powerful functionality with very few semantics. Here are all the directives we will learn about:
- ion-side-menus - A container element for side menu(s) and the main visible content.
- ion-side-menu-content - A container for the main visible content, sibling to one or more ionSideMenu directives.
- ion-side-menu - A container for a side menu, sibling to an ionSideMenuContent directive.
- ion-nav-view - Used to render templates in your application. Each template
is part of a state. States are usually mapped to a url, and are defined programatically
using angular-ui-router (see their docs for reference).
- ion-view - A container for view content and any navigational and header bar information. Used as a child of ionNavView.
- ion-nav-bar - If we have an ionNavView directive, we can also create an
ionNavBar, which will create a topbar that updates as the application state changes.
- ion-nav-buttons - Use nav buttons to set the buttons on your ionNavBar
from within an ionView.
- ion-content- Provides an easy to use content area that can be configured
to use Ionic’s custom Scroll View, or the built in overflow scrolling of the browser.
- ion-list - The List is a widely used interface element in almost any mobile app, and can include
content ranging from basic text all the way to buttons, toggles, icons, and thumbnails.
- ion-item - Used to create items inside of an ionList.

HEY, QUICK QUESTION!
Joel's Head
Why are we asking?