Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

https://github.com/candelibas/awesome-ionic

An "awesome" list of Ionic resources
https://github.com/candelibas/awesome-ionic

List: awesome-ionic

awesome awesome-list cordova ionic ionic-framework ionic2 ionic3 javascript

Last synced: 18 days ago
JSON representation

An "awesome" list of Ionic resources

Lists

README 

        
# Awesome Ionic [![Awesome](https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg)](https://github.com/sindresorhus/awesome)



An "awesome" list of the Ionic resources 



### Ionic

> "Ionic is the beautiful, open source front-end SDK for developing hybrid mobile apps with web technologies."



##### Current Ionic version: 

[![npm version](https://badge.fury.io/js/ionic-framework.svg)](https://badge.fury.io/js/ionic-framework)



#### Official Resources

* [Site](http://ionicframework.com/)

* [Blog](http://blog.ionic.io/)

* [Documentation](http://ionicframework.com/docs/v2/)

* [Getting Started Guide](http://ionicframework.com/docs/v2/getting-started/)

* [Ionic Native](https://github.com/driftyco/ionic-native/)

* [Community Forum](http://forum.ionicframework.com/)

* [Ionic IRC](http://webchat.freenode.net/?randomnick=1&channels=%23ionic&uio=d4)

* [Ionic Youtube Channel](https://www.youtube.com/channel/UChYheBnVeCfhCmqZfCUdJQw)

* [Showcase](http://showcase.ionicframework.com/)

* [GitHub Repo](https://github.com/driftyco/ionic/)



#### Ionic Fundamentals

* [Beginners Guide to Getting Started with Ionic](http://www.joshmorony.com/beginners-guide-to-getting-started-with-ionic-2/)

* [Ionic First Look Series: Your First Ionic App Explained](http://www.joshmorony.com/ionic-2-first-look-series-your-first-ionic-2-app-explained/)

* [How to Convert an Ionic 1 Application to Ionic](http://www.joshmorony.com/how-to-convert-an-ionic-1-application-to-ionic-2/)

* [A Simple Guide to Navigation in Ionic](http://www.joshmorony.com/a-simple-guide-to-navigation-in-ionic-2/)

* [10 Minutes with Ionic: Adding Pages and Navigation](http://blog.ionic.io/10-minutes-with-ionic-2-adding-pages-and-navigation/)

* [10 Minutes with Ionic: Calling an API](http://blog.ionic.io/10-minutes-with-ionic-2-calling-an-api/)

* [How To Update Your Application Project and CLI](http://www.gajotres.net/ionic-2-how-to-update-your-application-project-and-cli/)

* [How to Create a Data Model in Ionic](http://www.joshmorony.com/how-to-create-a-data-model-in-ionic-2/)

* [Ionic and External Libraries](http://mhartington.io/post/ionic2-external-libraries/)

* [Understanding Zones and Change Detection in Ionic & Angular 2](http://www.joshmorony.com/understanding-zones-and-change-detection-in-ionic-2-angular-2/)

* [Understanding Ionic: Pipe](http://mcgivery.com/understanding-ionic-2-pipe/)

* [How to Manipulate Data in Ionic: Part 1](http://www.joshmorony.com/how-to-manipulate-data-in-ionic-2-part-1/)

* [How to Manipulate Data in Ionic: Part 2](http://www.joshmorony.com/how-to-manipulate-data-in-ionic-2-part-2/)

* [Filtering, Mapping, and Reducing Arrays in Ionic](https://www.youtube.com/watch?v=A-4CLa05tp0)

* [Build a basic mobile app with Ionic 4](https://enappd.com/blog/how-to-create-an-ionic-4-app-for-beginners/13) ![](v4.png)

* [Read SMS in Ionic 4 apps](https://enappd.com/blog/automatically-read-sms-in-ionic-4-apps/42) ![](v4.png)

* [Geolocation, geocoding and reverse geocoding in Ionic 4](https://enappd.com/blog/using-geolocation-geocoding-and-reverse-geocoding-in-ionic-4/45) ![](v4.png)

* [Google Vision in Ionic 4 apps](https://enappd.com/blog/implement-google-vision-in-ionic-4/43) ![](v4.png)

* [RTL (right-to-left) layout in Ionic 4 apps](https://enappd.com/blog/rtl-right-to-left-use-in-ionic-4/50) ![](v4.png)

* [Push notifications in Ionic 4 apps](https://enappd.com/blog/implement-ionic-4-firebase-push/34) ![](v4.png)

* [Google Vision in Ionic 4 apps](https://enappd.com/blog/implement-google-vision-in-ionic-4/43) ![](v4.png)



#### Theming

* [A Guide to Styling an Ionic Application](http://www.joshmorony.com/a-guide-to-styling-an-ionic-2-application/)

* [Best practice when adding FontAwesome to an ionic2 app](http://luiscabrera.site/tech/2017/01/09/fontawesome-in-ionic2.html)

* [A List of Common CSS Utility Attributes in Ionic](http://www.joshmorony.com/a-list-of-common-css-utility-attributes-in-ionic-2/)

* [5 Animation Packages You Can Immediately Use Inside Your Ionic App](https://devdactic.com/5-animation-packages-ionic/)



#### Components

* [How to Create a Sliding Delete Button for Lists](http://www.joshmorony.com/ionic-2-how-to-create-a-sliding-delete-button-for-lists/)

* [Creating a Sliding Introduction Component in Ionic](http://www.joshmorony.com/creating-a-sliding-introduction-component-in-ionic-2/)

* [How to Create a Custom Loading Component in Ionic](http://www.joshmorony.com/how-to-create-a-custom-loading-component-in-ionic-2/)

* [Build a Simple Progress Bar Component in Ionic](http://www.joshmorony.com/build-a-simple-progress-bar-component-in-ionic-2/)

* [Create a News Feed with 360-Degree Photo Viewing in Ionic](http://www.joshmorony.com/create-a-news-feed-with-360-degree-photo-viewing-in-ionic-2/)

* [Build a Tap to Reveal Component in Ionic](https://www.joshmorony.com/build-a-tap-to-reveal-component-in-ionic-2/)



#### Authentication

* [Twitter Login in Ionic 4 App using Firebase](https://enappd.com/blog/twitter-login-in-ionic-4-apps-using-firebase/24) ![](v4.png)

* [Facebook Login in Ionic 4 App using Firebase](https://enappd.com/blog/facebook-login-in-ionic-4-apps-using-firebase/25) ![](v4.png)

* [Google Login in Ionic 4 App using Firebase](https://enappd.com/blog/google-login-in-ionic-4-apps-using-firebase/39) ![](v4.png)

* [Anonymous Login in Ionic 4 App using Firebase](https://enappd.com/blog/firebase-anonymous-login-in-ionic-4/37) ![](v4.png)

* [Basic Email Login in Ionic 4 App using Firebase](https://enappd.com/blog/email-authentication-with-firebase-in-ionic-4/38) ![](v4.png)

* [Add Touch ID Authentication To An Ionic Mobile App](https://www.thepolyglotdeveloper.com/2016/03/add-touch-id-authentication-ionic-2-mobile-app/)

* [Successful OAuth Social Login with Firebase](http://www.gajotres.net/ionic-2-succesfull-oauth-social-login-with-firebase/)

* [Using An Oauth 2.0 Service Within An Ionic Mobile App](https://www.thepolyglotdeveloper.com/2016/01/using-an-oauth-2-0-service-within-an-ionic-2-mobile-app/)

* [Ionic and Auth0](http://blog.ionic.io/ionic-2-and-auth0/)

* [Handling a Simple User Authorization](http://www.gajotres.net/ionic-2-handling-a-simple-user-authorization/)

* [Authenticate Ionic with WordPress](https://auth0.com/authenticate/ionic2/wordpress)



#### Unit Testing

* [Ionic Unit Testing](http://lathonez.github.io/2017/ionic-2-unit-testing/)

* [How to Unit Test an Ionic Application](http://www.joshmorony.com/how-to-unit-test-an-ionic-2-application/)

* [Test Driven Development in Ionic: An Introduction to TDD](https://www.joshmorony.com/test-driven-development-in-ionic-2-an-introduction-to-tdd/)



#### Ionic Native / Cordova Plugins

* [Playing music in Ionic 4 apps](https://enappd.com/blog/spotify-like-music-in-ionic-4-apps/48) ![](v4.png)

* [How to implement health plugin - Pedometer in Ionic 4](https://enappd.com/blog/best-fitness-plugins-for-ionic-4-how-to-use-pedometer/15) ![](v4.png)

* [Using Cordova Plugins in Ionic with Ionic Native](http://www.joshmorony.com/using-cordova-plugins-in-ionic-2-with-ionic-native/)

* [How to Work With Cordova Plugins](http://www.gajotres.net/ionic-2-how-to-use-cordova-plugins/)

* [10 Minutes with Ionic: Using the Camera with Ionic Native](http://blog.ionic.io/10-minutes-with-ionic-2-using-the-camera-with-ionic-native/)

* [How to Use Google Maps & Geolocation ](http://www.joshmorony.com/ionic-2-how-to-use-google-maps-geolocation-video-tutorial/)

* [Determine Network Availability](https://www.thepolyglotdeveloper.com/2016/01/determine-network-availability-in-an-ionic-2-mobile-app/)

* [Monetize With Google Admob In An Ionic Mobile App](https://www.thepolyglotdeveloper.com/2016/02/monetize-google-admob-ionic-2-mobile-app/)

* [Show Native Toast Notifications In An Ionic Mobile App](https://www.thepolyglotdeveloper.com/2016/01/show-native-toast-notifications-in-an-ionic-2-mobile-app/)

* [Having Fun With Cordova Geolocation Plugin](http://www.gajotres.net/ionic-2-having-fun-with-cordova-geolocation-plugin/)

* [Use SQLite In Ionic Instead Of Local Storage](https://www.thepolyglotdeveloper.com/2015/12/use-sqlite-in-ionic-2-instead-of-local-storage/)

* [Launch Websites With Ionic Using The InAppBrowser](https://www.thepolyglotdeveloper.com/2016/01/launch-websites-with-ionic-2-using-the-inappbrowser/)

* [Add Barcode Scanning Functionality To Your Ionic App](https://www.thepolyglotdeveloper.com/2016/02/add-barcode-scanning-functionality-to-your-ionic-2-app/)

* [Use Google Analytics In An Ionic Android And iOS App](https://www.thepolyglotdeveloper.com/2016/03/use-google-analytics-in-an-ionic-2-android-and-ios-app/)

* [Share Things On Social Media Via An Ionic Mobile App](https://www.thepolyglotdeveloper.com/2016/02/share-things-on-social-media-via-an-ionic-2-mobile-app/)

* [How To Use PouchDB + SQLite For Local Storage In Ionic](http://gonehybrid.com/how-to-use-pouchdb-sqlite-for-local-storage-in-ionic-2/)

* [Adding Background Geolocation to an Ionic Application](http://www.joshmorony.com/adding-background-geolocation-to-an-ionic-2-application/)

* [Getting Familiar with Local Notifications in Ionic](http://www.joshmorony.com/getting-familiar-with-local-notifications-in-ionic-2/)

* [Create a Nearby Places List with Google Maps in Ionic – Part 1](http://www.joshmorony.com/create-a-nearby-places-list-with-google-maps-in-ionic-2-part-1/)

* [Create a Nearby Places List with Google Maps in Ionic – Part 2](http://www.joshmorony.com/create-a-nearby-places-list-with-google-maps-in-ionic-2-part-2/)



#### Payment Gateway Integrations

* [Ionic 4 Stripe Payment Integration](https://enappd.com/blog/ionic-4-stripe-payment-integration-with-firebase-for-apps-and-pwa/17) ![](v4.png)

* [Ionic 4 PayPal Payment Integration](https://enappd.com/blog/ionic-4-paypal-payment-integration-for-apps-and-pwa/16) ![](v4.png)

* [Ionic 4 Apple Pay Payment Integration](https://enappd.com/blog/how-to-integrate-apple-pay-in-ionic-4-apps/21) ![](v4.png)

* [Ionic 4 Razorpay Payment Integration](https://enappd.com/blog/how-to-integrate-razorpay-in-ionic-4-apps-and-pwa/20) ![](v4.png)



#### Backend as a Service

* [10 Minutes with Ionic: Calling an API](http://blog.ionic.io/10-minutes-with-ionic-2-calling-an-api/)

* [Using Http to Fetch Remote Data from a Server in Ionic](http://www.joshmorony.com/using-http-to-fetch-remote-data-from-a-server-in-ionic-2/)

* [Making REST HTTP Requests Like a Pro](http://www.gajotres.net/ionic-2-making-rest-http-requests-like-a-pro/)

* [Posting data from Ionic app to a PHP server](http://www.nikola-breznjak.com/blog/ionic2/posting-data-from-ionic-2-app/)

* [Make HTTP Requests In An Ionic Android And iOS App](https://www.thepolyglotdeveloper.com/2016/01/make-http-requests-in-an-ionic-2-android-and-ios-app/)

* [Integrating Firebase with AngularFire2 into AngularJS & Ionic2](http://www.clearlyinnovative.com/integrating-firebase-with-angularfire2-into-angularjs-ionic2)



#### i18n & l10n

* [Internationalize and Localize Your Ionic 4 App](https://enappd.com/blog/how-to-translate-in-ionic-4-globalization-internationalization-and-localization/11) ![](v4.png)

* [Internationalize and Localize Your App With Angular 2](http://www.gajotres.net/ionic-2-internationalize-and-localize-your-app-with-angular-2/)

* [attranslate](https://github.com/fkirc/attranslate) - Semi-automated translation of JSON and other resource files



#### Tools

* [Ionic2-vscode](https://marketplace.visualstudio.com/items?itemName=jgw9617.ionic2-vscode)

* [Vim-ionic2](https://github.com/akz92/vim-ionic2)

* [Ionic Vetur Intellisense](https://github.com/moduslabs/ionic/tree/master/packages/ionic-vetur) - Vetur support for Ionic Components for tag and attribute autocompletion



#### Video Tutorials

* [Ionic Quickstart](https://www.udemy.com/ionic-2-quickstart/)

* [Build a Todo App from Scratch with Ionic](http://www.joshmorony.com/build-a-todo-app-from-scratch-with-ionic-2-video-tutorial/)

* [Ionic: How to Use Google Maps & Geolocation](http://www.joshmorony.com/ionic-2-how-to-use-google-maps-geolocation-video-tutorial/)

* [Ionic in One Hour](http://courses.devdactic.com/courses/ionic-2-in-one-hour?product_id=104238)

* [Build a Custom Flash Card Component in Ionic](https://www.youtube.com/watch?v=BKFQKywl_GM)

* [Hacking CSS in Ionic](https://www.youtube.com/watch?v=sXFmkdhOEVc)

* [Learn Ionic 3 From Scratch](https://www.youtube.com/watch?v=JcEGTektejA&list=PLYxzS__5yYQng-XnJhB21Jc7NW1OIaqct)



#### Books

* [Building Mobile Apps with Ionic](https://www.joshmorony.com/building-mobile-apps-with-ionic-2/)

* [Ionic Blueprints](https://www.packtpub.com/web-development/ionic-2-blueprints)

* [Hybrid Mobile Development with Ionic](https://www.packtpub.com/application-development/hybrid-mobile-development-ionic)



#### Open Source Projects

* [Ionic Conference App](https://github.com/driftyco/ionic-conference-app)

* [IonicRealty](https://github.com/ccoenraets/ionic2-realty)

* [Ionic Firebase Chat App](https://github.com/ionic2blueprints/firebase-chat)

* [Ionic Ecommerce App](https://github.com/ionic2blueprints/ionic2-marketcloud)

* [Ionic Conference App based on Lanyrd API](https://github.com/ionic2blueprints/conference-app)

* [Ionic Stock Tracking App](https://github.com/ionic2blueprints/ionic2-stockmarket)

* [Ionic Wordpress Client](https://github.com/ionic2blueprints/ionic2-wp-client)

* [Ionic Media Player](https://github.com/ionic2blueprints/media-player)

* [Ionic Social App](https://github.com/ionic2blueprints/social-app)

* [Ionic 5 WhatsApp clone](https://github.com/thenaim/ionic-whatsapp-clone) ![](v4.png) [NEW]

* [Ionic 5 Social Network Starter](https://github.com/thenaim/ion-tk-social-network) ![](v4.png) [NEW]

* [Ionic Push Notification](https://github.com/aggarwalankush/ionic2-push-base)

* [Ionic Weather app](https://github.com/aggarwalankush/ionic2-mosum)

* [Ionic Reddit Reader](https://github.com/smartapant/ionic2-reddit-reader)

* [Ionic Advanced Components](https://github.com/yannbf/ionic2-components)

* [Ionic aiEyes - Azure Computer Vision API](https://github.com/brenopolanski/aiEyes)

* [Ionic Soundboard](https://github.com/rkalis/ionic-soundboard)

* [Ionic Country Explorer](https://github.com/SKempin/ionic-country-explorer)

* [Firebase push notifications in Ionic 4](https://github.com/enappd/ionic-4-push) ![](v4.png) [NEW]

* [Receive SMS automatically in Ionic 4](https://github.com/enappd/Ionic-4-sms-receive) ![](v4.png) [NEW]

* [Playing music in Ionic 4](https://github.com/enappd/ionic-4-music) ![](v4.png) [NEW]

* [Ionic 4 Stripe Payment Integration](https://github.com/enappd/ionic4-stripe) ![](v4.png) [NEW]

* [Ionic 4 PayPal Payment Integration](https://github.com/enappd/ionic4-paypal) ![](v4.png) [NEW]

* [Ionic 4 Apple Pay Payment Integration](https://github.com/enappd/ionic4-applepay) ![](v4.png) [NEW]

* [Ionic 4 Razorpay Payment Integration](https://github.com/enappd/ionic4-razorpay) ![](v4.png) [NEW]

* [Ionic 4 Twitter login with Firebase](https://github.com/enappd/Ionic-4-Twitter-auth) ![](v4.png) [NEW]

* [Ionic 4 Facebook login with Firebase](https://github.com/enappd/ionic4-facebookAuth) ![](v4.png) [NEW]

* [Ionic 4 Google login with Firebase](https://github.com/enappd/Ionic-4-google-auth) ![](v4.png) [NEW]

* [Translation in Ionic 4 - Internationalization and localization](https://github.com/enappd/ionic4-i18n) ![](v4.png) [NEW]

* [Ionic 4 Free chat themes](https://store.enappd.com/product/free-chat-themes-ionic4/) ![](v4.png) [NEW]



#### Contribute

Contributions welcome! Read the [contribution guidelines](CONTRIBUTING.md) first.



#### License

[![CC0](http://i.creativecommons.org/p/zero/1.0/88x31.png)](http://creativecommons.org/publicdomain/zero/1.0/)