CodeCanyon

Ionic 2 App - Angular 2 + Ionic 2 + i18n Full App

Ionic 2 App - Angular 2 + Ionic 2 + i18n Full App


What’s new in version 1.6.0:
Charts integration, New Charts Module and Component (Bar, Line, Radar, Polar, Pie, Bubble, Doughnut, Mixed Charts). Ionic Native Email Composer integration, New Contact Form with Email Composer. Ionic 2 Framework update to 2.0.1 and app-scripts update to 1.1.0. New Tutorial: How to add a Wordpress Menu <id> to the App Sidebar Menu.
What’s new in version 1.5.0:
Wordpress Menus support (WP API Menus integration). Unlimited Menu Levels support. New Wordpress Menus, Wordpress Menu and Wordpress Menu Item Components in the Wordpress Module. In App navigation from Wordpress Menus to Categories, Posts and Pages.
What’s new in version 1.4.0:
Ionic 2 Framework update to 2.0.0
What’s new in version 1.3.0:
New Facebook Connect Module. Facebook Login/Logout. Access to the Facebook Graph API. Ionic 2 Framework update to 2.0.0-rc.5. Ionic 2 app-scripts update to 1.0.0.
What’s new in version 1.2.0:
Wordpress Login / JWT Authentication for WordPress REST API Version 2. New Wordpress Home Component (modern design). New Login Module/Component.
What’s new in version 1.1.0:
WordPress REST API Version 2 Pages integration. RTL Support Documentation.

Features

  • Angular 2 + Ionic 2 + Typescript + i18n Full App (Latest Ionic v2.0.0)
  • Announcing Ionic 2.0.0 Final http://blog.ionic.io/announcing-ionic-2-0-0-final/
  • Professional Module Architecture (20+ Modules) – Module-based Architecture Ionic 2 App as each App Page is a Module (@ngModule). Architecture is following the official Angular 2 Modularity patterns (AppModule, CoreModule, SharedModule, Feature Modules) https://angular.io/docs/ts/latest/guide/ngmodule.html
  • Component declarations/exports in Modules (35+ Components)
  • Placeholder Module as a basis for your new App Modules
  • Multiple Languages (i18n) – An implementation of Angular 2 translate (ng2-translate) with unlimited languages support (global translate pipe support)
    • Introducing a custom Translate Loader for Ionic 2
  • UI Language Switcher – Change the Ionic 2 App Language through the Settings Component (Settings Module)
  • Angular 2 HTTP Requests with Observables
  • WordPress REST API Version 2 (or WordPress >= 4.7 core REST API) integration https://wordpress.org/plugins/rest-api/ (with Wordpress >=4.7 you don’t need to install the plugin as this is coming in the core)
    • Wordpress Login / JWT Authentication for WP REST API
    • Wordpress Posts
    • Wordpress Favorite Posts (Ionic Storage)
    • Wordpress Post
      • Wordpress Post Preview (Ionic 2 Native InAppBrowser)
      • Wordpress Post Social Share (Ionic 2 Native Social Share)
    • Wordpress Post Comments
    • Wordpress Categories
    • Wordpress Search (Searchbar: ion-searchbar)
    • Wordpress Feature Media (Component)
    • Wordpress Pages
    • Wordpress Menus Support based on the WP API Menus
  • Facebook Connect (Facebook Connect Module)
    • Facebook Login/Logout
    • Access to the Facebook Graph API
  • Charts (Charts Module)
  • Google Maps (Google Maps Module)
  • Unlimited RSS Feeds with the extra support/feature of Categorized Feeds (Feeds Module)
    • Get Unlimited Atom, RSS, or Media RSS Feeds, Micro Formats and more using the Yahoo Query Language (YQL)
    • Define all your Feed Categories and Feed Sources just by editing a JSON file (assets/data/json/feeds.json)
  • Youtube Videos with Username or Playlist Id (Youtube Module)
    • Angular 2 Trusting safe values (IFrame source) by injecting Dom Sanitizer
  • Contact Form with Email Composer
  • Ionic 2 Storage
    • Favorite implementation with Set/Get/Remove/Clear from Storage (part of the Wordpress module)
  • Ionic 2 Native
    • InAppBrowser
    • Social Sharing
    • Barcode Scanner
  • Barcode Scanner
    • This plugin provides cross-platform BarcodeScanner for Cordova / PhoneGap. The following barcode types are currently supported from the plugin: Android: QR_CODE, DATA_MATRIX, UPC_E, UPC_A, EAN_8, EAN_13, CODE_128, CODE_39, CODE_93, CODABAR, ITF, RSS14, PDF417, RSS_EXPANDED – iOS: QR_CODE, DATA_MATRIX, UPC_E, UPC_A, EAN_8, EAN_13, CODE_128, CODE_39, ITF
  • Ionic Components implementations
    • Navigation, Menu, List, Searchbar, Loading Controller, Toast Controller, Infinite Scroll, Item Options, Storage, Datetime, Slides, Tabs
  • Side-menu navigation support – Menu is a side-menu navigation that can be dragged out or toggled to show. The content of a menu will be hidden when the menu is closed.

Ionic 2 + Angular 2 Modules (20+ modules)

Angular 2 + Ionic 2 Modules help organize an application into cohesive blocks of functionality.

An Angular Module is a class adorned with the @NgModule decorator function. @NgModule takes a metadata object that tells Angular how to compile and run module code. It identifies the module’s own components, directives and pipes, making some of them public so external components can use them.

Modules: IonicModule, SharedModule, HomeModule, TabsModule, GoogleMapsModule, WordpressModule, SlidesModule, GridModule, SettingsModule, FeedsModule, YoutubeModule, AboutModule, ContactModule, DatetimeModule, RangesModule, ActionSheetModule, BarcodeScannerModule, PlaceholderModule

Multiple Languages (i18n)

Ionic 2 App comes with Multi Languages support. Best practices and proven techniques are packed together so as to implement a real case scenario providing by default (English/German/French) a great implementation for the Internationalization of your App.
You can translate your App to multiple languages in parallel. The Ionic 2 App comes by design with the en.json, de.json and fr.json files providing you a full translation mechanism.

RTL Support

Ionic 2 and therefore Ionic 2 App comes with RTL support. Just enable the RTL by placing the code this.platform.setDir('rtl', true) in the app.component.ts as you can see below.
this.platform.ready().then(() => { this.platform.setDir('rtl', true); StatusBar.styleDefault(); Splashscreen.hide(); });

WordPress REST API Version 2 ( or WordPress >= 4.7 core REST API)

Ionic 2 App comes with WordPress REST API Version 2 Integration (/wp-json/wp/v2) https://wordpress.org/plugins/rest-api/ (with Wordpress >=4.7 you don’t need to install the plugin as this is coming in the core):
  • Wordpress Posts
  • Wordpress Favorite Posts (Ionic Storage)
  • Wordpress Post
    • Wordpress Post Preview (Ionic 2 Native InAppBrowser)
    • Wordpress Post Social Share (Ionic 2 Native Social Share)
  • Wordpress Post Comments
  • Wordpress Categories
  • Wordpress Search (Searchbar: ion-searchbar)
  • Wordpress Feature Media (Component)
  • Wordpress Pages
  • Wordpress Menus Support based on the WP API Menus


Wordpress Menus / WP API Menus

Ionic 2 App comes integrated with the WP API Menus https://wordpress.org/plugins/wp-api-menus/ through the Wordpress Menus Component, Wordpress Menu Component and Wordpress MenuItem Component in the Wordpress Module. You have all your Wordpress Menus available in your App with unlimited nested levels support. The WP API Menus extends the WP REST API with new routes pointing to WordPress menus.

Wordpress Login / JWT Authentication for WP REST API

Ionic 2 App (>=1.2.0) comes integrated with the JWT Authentication for WP REST API through the Wordpress Login Component in the Wordpress Module. The JWT Authentication extends the WP REST API using JSON Web Tokens Authentication as an authentication method.
JSON Web Tokens are an open, industry standard RFC 7519 method for representing claims securely between two parties.



Facebook Login / Access to Graph API

Ionic 2 App comes with Facebook Login / Logout and with a full implementation (Facebook Connect Module / Facebook Connect Component) for accessing the Facebook Graph API.




Charts

Ionic 2 App comes with Charts integration (Chart.js) and it contains also the Charts module that declaring/exposing the Charts Component. You can find also implementations of the Bar, Doughnut, Line, Radar, Polar, Pie, Bubble, Mixed Chart types in the Charts Component.


Unlimited RSS Feeds (with extra support of Categorized Feeds)

Ionic 2 App implements a Feeds Module a based on the Yahoo Query Language (YQL). Yahoo Query Language (YQL) https://developer.yahoo.com/yql/ allows you to access atom, rss, micro formats and more. YQL is an alternative to Google Feed API https://developers.google.com/feed/ as this is officially deprecated.



Youtube Videos with Username or Playlist Id

Ionic 2 App comes with full Youtube Videos integration. Additionally you can share your videos through the Ionic Native Social Sharing. All the Youtube configuration is exposed to the main App Configuration app.config.ts:
export class Config { public youtubeKey = 'AIzaSyClMa-MaKro_m95tb--4LaAorl-NmGPJxc'; public youtubeApiUrl = 'https://www.googleapis.com/youtube/v3/'; public youtubeUsername = 'ColdplayVEVO'; public youtubeResults = 50; }

Contact Form with Email Composer

Ionic 2 App comes with a new Contact Form under the Contact Module/Component. In addition, it comes integrated with the Ionic Native Email Composer in order to send directly this Email. The email recipient (Email To) could be configured to the main App Configuration src/app/app.config.ts.


Google Maps

Ionic 2 App comes with Google Maps integration and it contains also the Google Maps module declaring/exposing Angular 2 components for Google Maps. Please you just need to define your Google Map key into the google-maps/google-maps.module.ts module. The Google Map key should be created here https://developers.google.com/maps/documentation/javascript/get-api-key

Ionic 2 App Tutorials

Installation

#Install Ionic 2 $ npm install -g ionic@latest #Browse the App $ cd ioni2app #Install package.json dependencies $ npm install #Install Cordova/PhoneGap plugins (cordovaPlugins pakage.json branch dependencies) $ ionic state restore #Test your app on multiple screen sizes and platform types by starting a local development server $ ionic serve or $ ionic serve --lab #Build iOS $ ionic platform add ios $ ionic build ios #Build Android $ ionic platform add android $ ionic build android #Deploying/Running on emulator $ ionic run android --prod

Ionic View

You have always the option to try the Ionic 2 App by downloading the Ionic View (http://view.ionic.io/). Then, use the following App Id to fetch a preview of the app: 52d9a6a0

APK

Download Android APK

Ionic 2 + Angular 2 + Typescript UAC: Useful Articles Collection

https://docs.google.com/document/d/1DGka2qg5bacJw_jgVvsXDo-2g7AW0ffjjxNUtGlcEqM

Releases

Ionic 2 App 1.6.0
- Charts integration, New Charts Module and Charts Component (Bar, Line, Radar, Polar, Pie, Bubble, Doughnut, Mixed Charts)
- Ionic Native Email Composer integration, New Contact Form with Email Composer
- Ionic 2 Framework update to 2.0.1
- Ionic 2 app-scripts update to 1.1.0
- New Ionic 2 App Tutorial: How to add a Wordpress Menu <id> to the App Sidebar Menu
Ionic 2 App 1.5.0
- Wordpress Menus support (WP API Menus integration)
- Unlimited Menu levels support
- New Wordpress Menus, Wordpress Menu and Wordpress Menu Item Components in the Wordpress Module
- In App navigation from Wordpress Menus to Categories, Posts and Pages 
Ionic 2 App 1.4.0
- Ionic 2 Framework update to 2.0.0
Ionic 2 App 1.3.0
- New Facebook Connect Module
- Facebook Login/Logout
- Access to the Facebook Graph API
- Ionic 2 Framework update to 2.0.0-rc.5
- Ionic 2 app-scripts update to 1.0.0
Ionic 2 App 1.2.0
- Wordpress Login / JWT Authentication for WordPress REST API Version 2.
- New Wordpress Home Component (modern design).
- New Login Module/Component.
Ionic 2 App 1.1.0
- WordPress REST API Version 2 Pages integration
Ionic 2 App 1.0.0
- Initial release
by
by
by
by
by
by