Awesome Ionic

A collection of awesome IonicFramework resources and shiny things.

Credits goes to

• https://github.com/theho/awesome-ionic2
• https://github.com/Alexintosh/Awesome-Ionic
• https://github.com/candelibas/awesome-ionic
• https://github.com/lanceli/awesome-ionic

Awesome Ionic

Ionic 3	Ionic 4	Description
General	General
v3	v4	Official Website
v3		Documents
v3		Github Repository
v3		Blog
v3		Getting Started Guide
v3		Ionic Native
v3		Showcase
v3		Learn Ionic
v3		Ionic on CodePen
v3		Community Forum
v3		Ionic IRC
v3		Ionic Youtube Channel
Links		Links
v3		List of interesting links - Ionic Adventures
Tools
v3		The Ionic command line utility
v3		Ionicons - The premium icon font for Ionic
v3		A collection of AngularJS extensions on top of the Cordova API
v3		Ionic View - Test and share your ionic app on iPhone without needing a Mac
v3		Yeoman generator for Ionic
v3		Vagrant box for ionic
v3		Sublime text Plugin
v3		Ionic2-vscode
v3		Vim-ionic2
Tutorials	Articles
v3		Adding Auth to your Ionic app in 5 mins with Auth0
v3		Build your own chat app
v3		Creating a Firebase Powered End to End Ionic Application
v3		Creating a Realtime Image Sharing App
v3		Custom URL Schemes
v3		Deploy Ionic Framework App With Pre-Filled SQLite DB
v3		How to play audio
v3		How we built our app in 2 weeks using Ionic Framework
v3		Internationalization of an Ionic App: Multilanguage Support
v3		Let Your Ionic App Move With Move.js
v3		Making a Lock Pattern Login
v3		Making a Signature Drawpad
v3		Mastering the Ionic Framework: Learn to Build & Deploy Native Speed HTML5 Based Apps
v3		Preload images in Ionic using $ImageCacheFactory
v3		Production ready apps with Ionic Framework
v3		Push Notifications Sample App with Ionic and ngCordova
v3		Structure of an Ionic App
v3		Sync Data Using PouchDB In Your Ionic Framework App
v3		Upload Files To A Remote Server
v3		Using Factories and Web Services
v3		Using Typescript with Ionic
v3		Ionic Framework Tutorial form ccoenraets
v3		Installing Ionic
v3		Starting the Node Server
v3		Creating an Ionic Application
v3		Creating the Session Service
v3		Creating the Session Controllers
v3		Creating Templates
v3		Routing
v3		Building the Project
v3		Facebook Integration
Ionic 2 Fundamentals
v3		Beginners Guide to Getting Started with Ionic 2
v3		Ionic 2 First Look Series: Your First Ionic 2 App Explained
v3		How to Convert an Ionic 1 Application to Ionic 2
v3		A Simple Guide to Navigation in Ionic 2
v3		10 Minutes with Ionic 2: Adding Pages and Navigation
v3		10 Minutes with Ionic 2: Calling an API
v3		How To Update Your Application Project and CLI
v3		How to Create a Data Model in Ionic 2
v3		Ionic 2 and External Libraries
v3		Understanding Zones and Change Detection
v3		Understanding Ionic 2: Pipe
Theming
v3		A Guide to Styling an Ionic 2 Application
v3		Use Font Awesome Icons In Your Ionic 2 Android And iOS App
Authentication
v3		Add Touch ID Authentication To An Ionic 2 Mobile App
v3		Authenticate Ionic 2 with WordPress
v3		Handling a Simple User Authorization
v3		Ionic 2 and Auth0
v3		Token-based AngularJS Authentication
v3		Successful OAuth Social Login with Firebase
v3		Using An Oauth 2.0 Service Within An Ionic 2 Mobile App
Unit Testing
v3		Ionic 2 Unit Testing
v3		How to Unit Test an Ionic 2 Application
v3		Article
v3		Karma UnitTest
v3		Appium - an open source test automation framework
Backend as a Service
v3		10 Minutes with Ionic 2: Calling an API
v3		Firebase Example
v3		Integrating Firebase with AngularFire2 into AngularJS & Ionic2
v3		Make HTTP Requests In An Ionic 2 Android And iOS App
v3		Making REST HTTP Requests Like a Pro
v3		Parse REST API tutorial
v3		Parse Sample App - using angular-parse lib
v3		Posting data from Ionic 2 app to a PHP server
v3		Syncing Data With Firebase
v3		Using Http to Fetch Remote Data from a Server in Ionic 2
v3		Sample todo list app storing data in windows azure
i18n	l10n
v3		Internationalize and Localize Your App With Angular 2
Video Tutorials
v3		Ionic 2 Quickstart
v3		Build a Todo App from Scratch with Ionic 2
v3		Ionic 2: How to Use Google Maps & Geolocation
v3		Ionic 2 in One Hour
Social login	oAuth
v3		auth.io
v3		Facebook Integration
Push Notifications
v3		Sample App
v3		Push Notification Sample App
Database
v3		SQLlite - Deploy App with prefilled Database
v3		Sync Data Using PouchDB
v3		Importing & exporting SQLite data for Ionic Framework mobile apps
v3		How to Store Data inside Ionic Apps
Components
v3		Date picker
v3		How to Create a Sliding Delete Button for Lists
v3		Creating a Sliding Introduction Component in Ionic 2
v3		How to Create a Custom Loading Component in Ionic 2
Apps	Examples
v3		Belgian Beer Explorer
v3		CNodeJS
v3		Convergence - A fun game
v3		Ionic 2 Push Notification
v3		Ionic 2 Weather app
v3		Chat application made using ionic and socketio
v3		Ionic Conference App based on Lanyrd API
v3		Ionic Conference App
v3		Ionic Ecommerce App
v3		Ionic Firebase Chat App
v3		Ionic Hacker News
v3		Ionic Media Player
v3		Ionic Social App
v3		Ionic Stock Tracking App
v3		Ionic Weather App
v3		Ionic Wordpress Client
v3		Ionic 2 Realty
v3		Transports app for Palma de Mallorca
v3		A prototype kit
v3		Push Notification Sample App
Starter	Template
v3		tabs
v3		sidemenu
v3		blank
v3		salesforce
v3		maps
Books
v3		Full Stack Mobile App with Ionic Framework
v3		Getting Started with Ionic
v3		Hybrid Mobile Development with Ionic
v3		Ionic Framework By Example
v3		Ionic in Action
v3		Ionic in Action
v3		learning ionic
Cordova	Plugins
v3		10 Minutes with Ionic 2: Using the Camera with Ionic Native
v3		Add Barcode Scanning Functionality To Your Ionic 2 App
v3		Adding Background Geolocation to an Ionic 2 Application
v3		Custom URL scheme
v3		Determine Network Availability
v3		Getting Familiar with Local Notifications in Ionic 2
v3		Having Fun With Cordova Geolocation Plugin
v3		How to Use Google Maps & Geolocation
v3		How To Use PouchDB + SQLite For Local Storage In Ionic 2
v3		How to Work With Cordova Plugins
v3		Launch Websites With Ionic 2 Using The InAppBrowser
v3		Monetize With Google Admob In An Ionic 2 Mobile App
v3		Share Things On Social Media Via An Ionic 2 Mobile App
v3		Show Native Toast Notifications In An Ionic 2 Mobile App
v3		Universal URL / Deep linking
v3		Use Google Analytics In An Ionic 2 Android And iOS App
v3		Use SQLite In Ionic 2 Instead Of Local Storage
v3		Using Cordova Plugins in Ionic 2 with Ionic Native
Customization
v3		Ionic material
v3		Header that shrinks
v3		Accordion list
v3		Material design
v3		Angular Material codepen example
v3		Automatically adding in list dividers for an ng-repeat.
v3		Tinder style swipe Cards
v3		Move.js CSS3 Animation framework
v3		Ionic Tabbed Slidebox
v3		Ionic directive for a location dropdown that utilizes google maps
v3		32 Ionic Modal Animations
v3		32 Ionic Popup Animations
v3		Ionic Photo Browser
Misc
v3		Internationalization
v3		Minifying source code
v3		Icons Subway
v3		Angular translate
v3		jsPDF - Generate pdf in javascript
Contribute
-	-	Contributions welcome! Read the contribution guidelines CONTRIBUTING.md first.

---

# Awesome Ionic v2 A Collection of Resources for Ionic v2

Table of Contents

---

• General
  • [Official Documentation] (http://ionicframework.com/docs/v2/)
  • [GitHub Repo] (https://github.com/driftyco/ionic/tree/2.0)
  • [Tutorial] (http://ionicframework.com/docs/v2/getting-started/tutorial/)
  • [Forum] (https://forum.ionicframework.com/c/ionic-2)
  • [ng-conf 2016] (https://www.youtube.com/playlist?list=PLOETEcp3DkCq788xapkP_OU-78jhTf68j)
• Tools
  • [Ionicons] (http://ionicframework.com/docs/v2/resources/ionicons/)
• Tutorials
  • [Angular2/Ionic2 - Promises & Observables ] (http://coenraets.org/blog/2016/02/angular2-ionic2-data-services-promises-observables/)
  • [Using REST Service] (http://coenraets.org/blog/2016/02/angular2-ionic2-rest-services/)
  • [App Structure] (http://www.joshmorony.com/ionic-2-first-look-series-your-first-ionic-2-app-explained/)
  • [Ionic2 JWT Auth] (https://auth0.com/blog/2016/02/18/ionic-2-authentication-how-to-secure-your-mobile-app-with-jwt/)
  • [Google Maps Tutorial] (http://www.joshmorony.com/ionic-2-how-to-use-google-maps-geolocation-video-tutorial/)
  • [Ionic2 with Salesforce] (http://coenraets.org/blog/2015/10/ionic2-salesforce-oauth-rest/)
  • [Cordova Plugin HOWTO] (http://www.gajotres.net/ionic-2-how-to-use-cordova-plugins/)
  • [OAuth 2.0] (https://www.thepolyglotdeveloper.com/2016/01/using-an-oauth-2-0-service-within-an-ionic-2-mobile-app/)
  • [Angular2 Pipe for Ionic2] (http://www.joshmorony.com/how-to-use-pipes-to-manipulate-data-in-ionic-2/)
• Sample Apps
  • [Ionic Realty] (https://github.com/ccoenraets/ionic2-realty)
  • [Ionic Conference] (https://github.com/driftyco/ionic-conference-app)
• Components
  • [Swiper Slider] (http://idangero.us/swiper/)
• Angular2
  • [Awesome-Angular2] (https://www.npmjs.com/package/awesome-angular2)
  • [Data Service with Observable] (https://coryrylan.com/blog/angular-2-observable-data-services)
  • [Rest Data Service] (http://coenraets.org/blog/2016/02/angular2-ionic2-rest-services)
  • [ngRx Store] (http://orizens.com/wp/topics/adding-redux-with-ngrxstore-to-angular-2-part-1/) ...more to come..

---

Awesome Ionic 2+ Components

For me Ionic 3 is one of the best Angular 2+ UI Frameworks for Mobile Apps in combination with Apache Cordova. This list contains no tutorials, external help pages, tips and tricks.

This list is only filled with real components and tools that you can use immediately. So enjoy it!

It should help you to get awesome components and plugins for Ionic2. It contains of course also a lot of Angular2 stuff.

Legend

• build for Angular 2+
• build for Ionic 2+

UI

Localization

• NgTranslate
• angular-I10n

Menu, Tabs

• Scrollabel Tabs
• Circular Tabs
• Fab Toolbar
• Multi Level Sidemenu
• Popover Sidemenu

Form / Input

• Autocomplete
• Form Generator based on JSON
• Dynamic Forms
• Form Builder
• Sidemenu tabs
• Tags Input

Input - Date/Calendar

• Calendar
  • Calendar
  • Calendar
  • Calendar
  • Calendar (very powerful)
  • Calendar - Fullcalendar
• Datepicker
  • Datepicker
  • Datepicker (selectable range dates calendar)
  • Datepicker
• Rating
• Inputfield Mask

Lists/Table

• Sortable/Filter Tables
• Smart table (sorting, filtering ...)
• Flexible and Light Table

Images

• Signatur works perfect with
• Image Fallback
• Lazy Load
• Image Loader
• Facebook Gallery
• Image Viewer
• Gallery Modal
• Image Zoom

Charts/Diagram

• Charts
• D3 Approaches
  • D3 Service
  • D3 Barchart
  • D3 Line/Bar/Pie Charts

Video/Audio

• Video Editor
• Audio Recorder
• Simple Audioplayer

Keyboards

• Digit Keyboard
• Pincode Keyboard

Dialog

• Dialogbox with Counter

Frames

• ng Lightning (for Salesforce Apps)

Picker

• Multi Picker

API

• Salesforce Rest API
• Firebase Rest API
• Google Maps
• JSON Web Token (JWT)
• Analytics (Google, Piwik, Kissmetrics and more)
• Github Auth
• PouchDB
• Wordpress
• Amazon - AWS
• Facebook Wrapper
• Microsoft Emotion API
• Pokémons API (Pokémons - no joke!)
• Codepush & Ionic2
• SQL Interface

Pipe

• Filtering Array
• Pipe Collection (around 20 pipes for strings etc)

Boilerplate/Demo Apps

• Redux
• Cordova File Transfer
• Update your App
• NFC Demo
• Fullscreen Content
• Card Layout
• Ionic 2
• Ionic 2 Advanced Components
• ORC Scan App based on ocrad.js

Build Stuff

• Ionic App Script

Code Stuff

• Redux

Projects

• App Evangelist my own Homepage/App with getdirectus.com (in progress)
• mHUD - Car App Speed tracking
• Restaurant App
• Conference App
• Realty
• Firebase Chat App
• Ecommerce App
• Conference App based on Lanyrd API
• Stock Tracking App
• Wordpress Client
• Media Player
• Social App
• Push Notification
• Weather app
• Reddit Reader
• YouTube
• Freshlypressed API App
• Geo Fence
• Image Gallery
• Real-World App
• Bwitter - Twitter
• Inoffical "Myki" App
• Timer App
• Component Examples
• Chat Examples
• Indexed Scroll Examples

Ionic 3 Crash Course

Javascript Books

http://openbook.rheinwerk-verlag.de/javascript_ajax/

http://openbook.rheinwerk-verlag.de/javascript/

https://github.com/loiane/javascript-datastructures-algorithms

http://htmldog.com/guides/javascript/beginner/

http://speakingjs.com/es5/index.html

Javascript Excercises

https://github.com/mrdavidlaing/javascript-koans

https://github.com/liammclennan/JavaScript-Koans

https://github.com/tylermcginnis/Javascript-Koans

Ionic Tutorials

https://www.ghadeer.io/ionic-3-screen-orientation/

https://thielcole.github.io/ionic2/2017/05/01/Ionic-Push-Notifications.html

Ionic Development Enrironments

https://blog.thejoin.it/ionic-build-ios-app-without-mac-virtual-machine.html

https://hub.docker.com/r/pam79/ionic-3-framework/