ionic-framework ट्यूटोरियल
आयनिक-ढांचे के साथ शुरुआत करना

टिप्पणियों

संस्करण

स्थापना या सेटअप

1. npm (नोड पैकेज मैनेजर) का उपयोग करके आयोनिक फ्रेमवर्क और कॉर्डोवा स्थापित करें (चूंकि आयोनिक ऐप्स कॉर्डोवा पर आधारित हैं):

सुनिश्चित करें कि आपके पास आपके सिस्टम पर Node.js का अद्यतित संस्करण है। यदि आपके पास Node.js स्थापित नहीं है, तो आप इसे यहाँ से स्थापित कर सकते हैं ।

इसके अलावा, मैक उपयोगकर्ताओं के लिए, आपके सिस्टम पर स्थापित नवीनतम Xcode संस्करण आपके लिए कमांड-लाइन-टूल्स और आईओएस सिम्युलेटर लाता है, यहां डाउनलोड करें ।

एक टर्मिनल विंडो (मैक) या एक कमांड विंडो (विंडोज) खोलें, और कॉर्डोवा और आयोनिक स्थापित करें:

$ npm install -g cordova ionic

Mac पर, आपको अपने सिस्टम कॉन्फ़िगरेशन के आधार पर sudo का उपयोग करना पड़ सकता है:

$ sudo npm install -g cordova ionic

यदि आपके पास पहले से ही कॉर्डोवा और आयोनिक आपके कंप्यूटर पर स्थापित है, तो सुनिश्चित करें कि आप नवीनतम संस्करण में अपडेट करें:

$ npm update -g cordova ionic

या

$ sudo npm update -g cordova ionic

आवश्यक प्लेटफॉर्म निर्भरता स्थापित करने के लिए एंड्रॉइड और आईओएस प्लेटफॉर्म गाइड का पालन करें।

नोट: iOS विकास के लिए Mac OS X की आवश्यकता है। Ionic CLI के माध्यम से iOS सिम्युलेटर को ios-sim npm पैकेज की आवश्यकता है, जिसे कमांड के साथ स्थापित किया जा सकता है:

$ sudo npm -g install ios-sim

2. एक नई ईओण परियोजना शुरू करें:

नए सिरे से तैयार ऐप टेम्प्लेट में से किसी एक का उपयोग करके या खाली करने के लिए एक आयोनिक प्रोजेक्ट बनाएं।

$ ionic start myApp blank

या

$ ionic start myApp tabs

या

$ ionic start myApp sidemenu

3. Ionic एप्लिकेशन का परीक्षण करें:

IOS और Android दोनों प्लेटफ़ॉर्म पर डेस्कटॉप ब्राउज़र में अपने Ionic ऐप का परीक्षण करने के लिए:

$ ionic serve --lab

जहाँ ionic serve --lab कई प्लेटफार्मों पर ऐप यूआई का परीक्षण करने के लिए बहुत अच्छा है, यह जावास्क्रिप्ट कंसोल या तत्व निरीक्षण के लिए कुछ समस्याओं का कारण बन सकता है, उस स्थिति में आप क्या पसंद कर सकते हैं:

$ ionic serve

एक एमुलेटर में अपने ईओण ऐप का परीक्षण करने के लिए:

$ cd myApp
$ ionic platform add ios android
$ ionic build ios
$ ionic emulate ios

Android एमुलेटर परीक्षण के लिए Android के साथ स्थानापन्न आईओएस:

$ ionic build android
$ ionic emulate android

USB के माध्यम से एंड्रॉइड डिवाइस में अपने Ionic ऐप का परीक्षण करने के लिए:

$ ionic run android

USB के माध्यम से कनेक्ट किए गए iOS डिवाइस में अपने Ionic ऐप का परीक्षण करने के लिए:

$ ionic run ios --device

आयोनिक फ्रेमवर्क परिचय और स्थापना और सेटअप

आयनिक रूपरेखा

कोणीय जेएस और फ्रंट एंड वेब प्रौद्योगिकियों का उपयोग करके एक क्रॉस-प्लेटफ़ॉर्म मोबाइल एप्लिकेशन डेवलपमेंट फ्रेमवर्क।

आधिकारिक वेबसाइट : http://ionicframework.com/

दस्तावेज़ीकरण : http://ionicframework.com/docs/

स्थापना और सेटअप

स्थापना Ionic के लिए NPM (नोड पैकेज मैनेजर) और कॉर्डोवा की आवश्यकता है।

आप यहां से Npde JS डाउनलोड और इंस्टॉल कर सकते हैं जो NPM के साथ बॉक्स से बाहर आता है।

Apache Cordova डाउनलोड करने के लिए आप कमांड लाइन से NPM का उपयोग कर सकते हैं

npm install -g cordova

यदि आपके पास पहले से एनपीएम और कॉर्डोवा है तो आप निम्न आदेश का उपयोग करके कमांड लाइन से आयनिक फ्रेमवर्क स्थापित कर सकते हैं।

npm install -g ionic

यह आपको कमांड लाइन से इसका उपयोग करने के लिए आयनिक फ्रेमवर्क स्थापित और सेटअप करेगा।

नोट * आपके सिस्टम वातावरण के आधार पर आपको व्यवस्थापक विशेषाधिकारों के साथ निष्पादित करने की आवश्यकता हो सकती है।

एक नई परियोजना शुरू करना

एक नया आयोनिक फ्रेमवर्क प्रोजेक्ट शुरू करने के लिए आप निम्नलिखित कमांड का उपयोग कर सकते हैं

ionic start myproject

या

ionic start myproject [template_name]

टेम्पलेट:

Ionic आपको कुछ बिल्ट इन टेम्प्लेट का उपयोग करके प्रोजेक्ट बनाने की अनुमति देता है

tabs (डिफ़ॉल्ट): जो टैब दृश्य के साथ एक सरल ऐप बनाएगा।

sidemenu : जो साइड मेनू के साथ आयनिक ऐप बनाएगा।

blank : जो एक रिक्त आयनिक ऐप बनाएगा।

जो सभी आयनिक परियोजना फाइलों के साथ myproject नाम से एक नया फ़ोल्डर बनाएगा।

अपने ब्राउज़र में प्रोजेक्ट का परीक्षण करने के लिए आप निम्नलिखित कमांड का उपयोग कर सकते हैं

ionic serve --lab

या

ionic serve

एमुलेटर चलाएं या एमुलेटर या फोन पर ऐप को टेस्ट करने के लिए सबसे पहले आपको इसके लिए प्लेटफॉर्म जोड़ना होगा

ionic platform [Platform Name]
ionic build [Platform Name]
ionic emulate [platform name]

प्लेटफ़ॉर्म नाम आप संबंधित प्लेटफ़ॉर्म के लिए सीधे एंड्रॉइड और आईओएस का उल्लेख कर सकते हैं, आप कई प्लेटफ़ॉर्म नामों का भी उल्लेख कर सकते हैं जिन्हें अंतरिक्ष द्वारा अलग किया गया है।

अपने ऐप को चलाने के लिए आप इसका उपयोग कर सकते हैं

ionic run [platform name]

मदद के लिए आप उपयोग कर सकते हैं

ionic --help

या

ionic help

आयनिक क्लि के विस्तृत विवरण के लिए इस लिंक को देखें।

आयनिक में उपलब्ध सीएसएस घटकों के लिए इस लिंक को देखें।

आयनिक के लिए जावास्क्रिप्ट एपीआई संदर्भ के लिए इस लिंक को देखें।

आयनिक के साथ त्वरित विकास के लिए आप आयनिक प्लेग्राउंड भी आज़मा सकते हैं।

आयनिक ढांचे के साथ शुभकामनाएँ ...

Ionic फ्रेमवर्क हैलो वर्ल्ड ऐप

सभी सेटअप के बाद, हैलो वर्ल्ड ऐप बनाने के लिए

• सिंपल ब्लैंक ऐप बनाने के लिए, टर्मिनल पर कमांड के नीचे दौड़ें:

ionic start HelloWorld blank  // create new project

cd HelloWorld                 // get into HelloWorld directory

• सबलाइन / वेबस्ट्रीम IDE में HelloWorld प्रोजेक्ट खोलें:
  • Index.html, www / ditectory में संपादित करें

 <body ng-app="starter">
   <ion-pane>
     <ion-header-bar class="bar-stable">
       <h1 class="title">Ionic Hello World App</h1>
     </ion-header-bar>
     <ion-content>
        <div class="center">Hello World..!</div>
     </ion-content>
    </ion-pane>
 </body>

• टर्मिनल से ब्राउज़र में चलाने के लिए:

ionic serve                  // run the app in browser

• प्लेटफ़ॉर्म जोड़ने के लिए:

ionic platform add android   // add android platform
ionic platform add ios       // add ios platform

• डिवाइस पर चलाने के लिए:

adb devices                  // to check devices is connected
ionic run android            // to run on android devices
ionic run ios                // to run on ios devices

• लिवरेलड में चलाने के लिए:

ionic run android -c -s -l    // to check app in live reload with console. 

यो (येओमान) आयनिक परियोजनाओं के लिए आयोनिक प्लेटफ़ॉर्म (आयोनिक क्लाउड)

आयोनिक प्लेटफार्म :

निर्माण, धक्का, तैनात, और अपने ईओण क्षुधा, आसान तरीका पैमाने।

शीर्षक वर्णन:

आयोनिक प्लेटफ़ॉर्म क्रॉस-प्लेटफ़ॉर्म मोबाइल ऐप के प्रबंधन और स्केलिंग के लिए एक क्लाउड प्लेटफ़ॉर्म है। एकीकृत सेवाएं आपको और आपकी टीम को आपके ऐप्स को कुशलता से बनाने, तैनात करने और विकसित करने में सक्षम बनाती हैं।

दस्तावेज़ उद्देश्य:
आयोनिक प्लेटफार्म मानक आयोनिक परियोजनाओं के साथ अच्छी तरह से काम करता है। लेकिन किसी भी गैर-मानक निर्देशिका संरचना का पालन करने वाली परियोजनाओं को कुछ बाधाओं का सामना करना पड़ सकता है। यह दस्तावेज़ योमन का उपयोग करके बनाई गई ईओण परियोजनाओं में आयोनिक प्लेटफ़ॉर्म का उपयोग करने के चरण प्रदान करता है।

दस्तावेज़ स्कोप:
यह दस्तावेज़ योमन का उपयोग करके आयोनिक परियोजना बनाने के लिए मूल चरणों को कवर करता है और इसे आयोनिक प्लेटफ़ॉर्म वेब क्लाइंट का उपयोग करके आयोनिक प्लेटफ़ॉर्म के साथ एकीकृत करता है। यह दस्तावेज़ Ionic Deploy, Ionic Analytics और Ionic Push का उपयोग करने के लिए बुनियादी चरणों को शामिल करता है।

अपेक्षित दर्शक:
इस दस्तावेज़ के लिए लक्षित दर्शक वेब / मोबाइल ऐप डेवलपर्स हैं, दोनों शुरुआती और विशेषज्ञ स्तर की विशेषज्ञता के साथ, जो नीचे दिए गए आवश्यक गुणों से परिचित हैं।

आवश्यक शर्तें:
इस दस्तावेज़ को आज़माने से पहले आपको निम्नलिखित रूपरेखाओं / उपकरणों से परिचित होना चाहिए।

• AngularJs: https://docs.angularjs.org/guide
• IonicFramework: http://ionicframework.com/docs/guide
• योमन: http://yeoman.io/codelab/index.html
• आयोनिक जेनरेटर: https://github.com/diegonetto/generator-ionic
• आयोनिक प्लेटफॉर्म: https://ionic.io/platform

आयनिक फ्रेमवर्क जनरेटर

योमन से आयोनिक फ्रेमवर्क के लिए एक जनरेटर, आधुनिक वेबैप के लिए वेब का मचान उपकरण

Node.js क्रोम के V8 जावास्क्रिप्ट इंजन पर निर्मित एक जावास्क्रिप्ट रनटाइम है। npm जावास्क्रिप्ट के लिए पैकेज मैनेजर है। Http://nodejs.org से नोड (और npm) डाउनलोड और इंस्टॉल करें

$ npm install npm –g
$ npm install -g yo

येओमान आपको नई परियोजनाओं को किक-स्टार्ट करने में मदद करता है, जो आपको उत्पादक बने रहने में मदद करने के लिए सर्वोत्तम प्रथाओं और उपकरणों को निर्धारित करता है।

$ yo ionic [app-name]

Package.json में devDependencies में निम्नलिखित शामिल हैं

"grunt-string-replace": "^1.2.1"

Bower.json में निर्भरता में निम्नलिखित शामिल हैं

"ionic-platform-web-client": "^0.7.1"

Gruntfile.js में स्क्रिप्ट फ़ोल्डर को 'js' में बदलें। यदि आवश्यक हो तो index.html में भी बदलाव करें।

grunt.initConfig({   yeoman: {…………
    scripts: 'js',
    ………… } })

फिर भागो

$ bower install && npm install
$ grunt
$ grunt serve

$ cordova platform add android 
$ grunt build:android --debug

आयनिक मंच-वेब-ग्राहक

एक वेब क्लाइंट जो आयोनिक प्लेटफॉर्म के साथ बातचीत प्रदान करता है।

हमें अपने ऐप को आयोनिक प्लेटफ़ॉर्म पर बात करने के लिए कुछ कोड की आवश्यकता है। हमें प्लगइन्स और Ionic.io प्लेटफ़ॉर्म के साथ इंटरफ़ेस करने के लिए Ionic ऐप वेब क्लाइंट के लिए Ionic प्लेटफ़ॉर्म क्लाइंट जोड़ना होगा।

$ ionic io init

अपने app.js में 'ionic.service.core' मॉड्यूल निर्भरता जोड़ें। Gruntfile.js में नीचे दिए गए अनुसार ग्रंट कार्य 'आयनिकसेटिंग्स' जोड़ें।

grunt.initConfig({
ionicSettings: JSON.stringify(grunt.file.readJSON('./.io-config.json')),

ionicIoBundlePath: 'www/bower_components/ionic-platform-web-client/dist/ionic.io.bundle.min.js',

'string-replace': {
  ionicSettings: {
    files: {
      '<%= ionicIoBundlePath %>': '<%= ionicIoBundlePath %>',
    },
    options: {
      replacements: [
        {
          pattern: 
        '"IONIC_SETTINGS_STRING_START";"IONIC_SETTINGS_STRING_END"',
          replacement: 
        '"IONIC_SETTINGS_STRING_START";var settings =<%= ionicSettings %>; return { get: function(setting) { if (settings[setting]) { return settings[setting]; } return null; } };"IONIC_SETTINGS_STRING_END";'
        }
      ]
    }
  }
},
       copy: {
    ionicPlatform:{
                expand: true,
                cwd: 'app/bower_components/ionic-platform-web-client/dist/',
                src: ['**'],
                dest: 'www/bower_components/ionic-platform-web-client/dist'
               }
    }
});

grunt.registerTask('ionicSettings', ['copy:ionicPlatform','string-replace:ionicSettings']);

Init में 'ionicSettings' जोड़ें और कॉपी के बाद कार्यों को कंप्रेस करें । Index.html में सभी टैग घोषणाओं के बाद नीचे दिए गए टैग को स्थानांतरित करें।

<script src="bower_components/ionic-platform-web-client/dist/ionic.io.bundle.min.js"></script>

फिर भागो

$ Grunt serve

आयोनिक डिप्लॉय

अपने प्रोडक्शन ऐप में रियल-टाइम अपडेट को पुश करें और वर्जन हिस्ट्री को मैनेज करें।

ईओण डिप्लॉय आपको किसी भी बदलाव के लिए मांग पर अपने ऐप को अपडेट करने की सुविधा देता है, जिसमें आपको बाइनरी संशोधनों की आवश्यकता नहीं होती है, जो आपको दिनों की बचत करते हैं, या यहां तक कि सप्ताह, प्रतीक्षा समय की भी। अपने App के लिए Ionic Deploy को कॉन्फ़िगर करने के लिए नीचे दी गई प्रक्रिया का पालन करें।

Gruntfile.js में नीचे दिए गए अनुसार ग्रन्ट कार्य 'परिनियोजन' जोड़ें।

grunt.registerTask('deploy', function () {
  return grunt.task.run(['init', 'ionic:upload' + this.args.join()]);
});

फिर भागो

$ ionic plugin add ionic-plugin-deploy

आयोनिक डिप्लोड कोड:

var deploy = new Ionic.Deploy();

// Check Ionic Deploy for new code
deploy.check().then(function(hasUpdate) {
}, function(err) {
});

// Update app code with new release from Ionic Deploy
deploy.update().then(function(result) {
}, function(error) {
}, function(progress) {
});

अपडेटिंग अपडेट:

अपने ऐप के लिए नया कोड भेजें।

एक एपीके बनाएं और अपना ऐप इंस्टॉल करें। अपने कोड में कुछ बदलाव करें और ' ग्रंट फ़ाइनल ' का उपयोग करके परिवर्तनों को तैनात करें। फिर इसे अपने ऐप से अपडेट करें।

आप इसे apps.ionic.io डैशबोर्ड से भी तैनात कर सकते हैं। आप तैनात पैरामीटर के बिना एप्लिकेशन को तैनात कर सकते हैं। फिर, डैश बोर्ड में आप मेटाडेटा और संस्करण विवरण जोड़ सकते हैं और वहां से ऐप को तैनात कर सकते हैं।

$ grunt build:android --debug

$ grunt deploy --note "release notes"
$ grunt deploy --note "release notes" --deploy=production

आयनिक विश्लेषण

समय के साथ घटनाओं या उपयोगकर्ताओं की कच्ची / अनूठी संख्या का लाइव फीड देखें।

अभी आपके ऐप पर कितने उपयोगकर्ता हैं? उनमें से कितने लोग कल या अगले सप्ताह आपके ऐप का उपयोग करेंगे? जानकारी के बिना, आपके पास यह बताने का कोई तरीका नहीं है कि क्या आपके ऐप का उपयोग उन तरीकों से किया जा रहा है जिनकी आप अपेक्षा करते हैं। अपने App के लिए Ionic Analytics को कॉन्फ़िगर करने के लिए नीचे दी गई प्रक्रिया का पालन करें।

अपने app.js में ionic.service.core के बाद ' ionic.service.analytics ' मॉड्यूल निर्भरता जोड़ें। हमारे मॉड्यूल के रन फ़ंक्शन में एनालिटिक्स रजिस्टर विधि चलाएँ।

$ionicAnalytics.register();

आयोनिक एनालिटिक्स में, आपके ऐप में उपयोगकर्ता द्वारा की गई प्रत्येक ट्रैक की गई कार्रवाई को एक ईवेंट ऑब्जेक्ट द्वारा दर्शाया जाता है। एक घटना समय में एक विशिष्ट बिंदु पर की गई एकल क्रिया है। अपने स्वयं के ईवेंट को ट्रैक करने के लिए, जब भी कोई क्रिया होती है, तब $ionicAnalytics.track(eventType, eventData) कॉल करें।

$ionicAnalytics.track('User Login', {
  user: $scope.user
});

आयन-ट्रैक-टैप निर्देश एक घटना भेजता है जब इसका होस्ट तत्व टैप किया जाता है। संबंधित आयन-ट्रैक-डेटा निर्देश घटना डेटा संलग्न करता है।

<button ion-track-tap="eventType" ion-track-data="expression"></button>

Apps.ionic.io डैशबोर्ड में आप निम्नलिखित विश्लेषिकी डेटा देख सकते हैं,

ईवेंट: समय के साथ ईवेंट की कच्ची संख्या या किसी इवेंट को पूरा करने वाले अनन्य उपयोगकर्ताओं की संख्या देखें। एक ईवेंट ऐप लोड करने वाले उपयोगकर्ता से कुछ भी हो सकता है, खरीदारी की पुष्टि करने के लिए।

फ़नल: फ़नल एक क्रियाओं का एक क्रम है जो आप उपयोगकर्ताओं से अपने ऐप में लेने की अपेक्षा करते हैं, जो एक निर्धारित लक्ष्य तक ले जाते हैं। फ़नल के भरपूर उपयोग से आपको रूपांतरण दरों में सुधार करने में मदद मिलेगी।

खंड: समय के साथ घटनाओं को देखें, एक निर्दिष्ट संपत्ति द्वारा समूहीकृत। या, दी गई संपत्ति से मेल खाने वाले घटनाओं के प्रतिशत की गणना करें। सेगमेंट आपको अपने उपयोगकर्ता आधार को समझने में मदद करते हैं और देखते हैं कि समय के साथ कैसे गुण बदलते हैं।

अवधारण: ट्रैक करें कि उपयोगकर्ता आपके ऐप का उपयोग करने से पहले कितने समय तक सक्रिय हैं। या, निर्धारित बिक्री तक पहुंचने के लिए उपयोगकर्ताओं को परिभाषित लक्ष्य तक पहुंचने में कितना समय लगता है, इसकी पहचान करें।

पल्स: अपने उपयोगकर्ताओं से आने वाली घटनाओं का लाइव फीड।

आयनिक पुश

अपने उपयोगकर्ताओं को लक्षित और स्वचालित पुश सूचनाएं भेजें।

आयोनिक पुश आपको एक साधारण डैशबोर्ड के माध्यम से लक्षित पुश सूचनाएं बनाने देता है जो उपयोगकर्ताओं द्वारा विशिष्ट मानदंडों से मेल खाने पर स्वचालित रूप से भेजे जाएंगे, और अपने स्वयं के सर्वर से पुश सूचनाएं भेजने के लिए एक सरल एपीआई प्रदान करते हैं।

Android पुश प्रोफ़ाइल:

Android पुश सूचनाएं Google क्लाउड मैसेजिंग (GCM) सेवा का उपयोग करती हैं। Google डेवलपर्स कंसोल खोलें और एक प्रोजेक्ट बनाएं। अपने प्रोजेक्ट नंबर को कॉपी करें। यह जीसीएम प्रेषक आईडी या जीसीएम प्रोजेक्ट नंबर होगा ।

एपीआई प्रबंधक अनुभाग में, Google क्लाउड मैसेजिंग एपीआई को सक्षम करें। फिर क्रेडेंशियल अनुभाग पर जाएं और क्रेडेंशियल्स बनाएं चुनें, फिर एपीआई कुंजी, फिर सर्वर कुंजी चुनें। अपनी API कुंजी को नाम दें ... से रिक्त अनुरोध स्वीकार करें ... फ़ील्ड रिक्त करें और बनाएँ पर क्लिक करें । अपनी API कुंजी सहेजें!

प्रमाणीकरण:

Ionic प्लेटफॉर्म पर अपने ऐप के डैशबोर्ड पर जाएं और सेटिंग्स पर जाएं -> प्रमाण पत्र । यदि आपने पहले से नहीं बनाया है, तो एक नया सुरक्षा प्रोफ़ाइल बनाएं, फिर संपादित करें । प्रोफ़ाइल टैग को नोट करें।

अब, एंड्रॉइड टैब पर क्लिक करें और Google क्लाउड मैसेजिंग के रूप में चिह्नित अनुभाग ढूंढें, Google डेवलपर कंसोल पर आपके द्वारा बनाई गई एपीआई कुंजी दर्ज करें, फिर सहेजें पर क्लिक करें । सेटिंग्स -> एपीआई कीज पर जाएं । एपीआई टोकन के तहत, एक नया टोकन बनाएं और इसे कॉपी करें। यह आपका एपीआई टोकन होगा ।

$ ionic plugin add phonegap-plugin-push --variable SENDER_ID="GCM_PROJECT_NUMBER"
$ ionic config set gcm_key <your-gcm-project-number>
$ ionic config set dev_push false
$ ionic io init

नोट: फोनगैप-प्लगइन-पुश के लिए Android समर्थन रिपॉजिटरी संस्करण 32+ की आवश्यकता है

अपने app.js में ionic.service के बाद ' ionic.service.push ' मॉड्यूल निर्भरता जोड़ें।

आयनिक पुश कोड:

सेवा को प्रारंभ करें और अपने डिवाइस को अपने मॉड्यूल के रन फ़ंक्शन में पंजीकृत करें। आपको उपयोगकर्ता द्वारा सूचना भेजने के लिए उपयोगकर्ता द्वारा पंजीकृत डिवाइस टोकन की आवश्यकता होगी।

$ionicPush.init({
  debug: true,
  onNotification: function (notification) {
    console.log'token:', notification.payload);
  },
  onRegister: function (token) {
    console.log('Device Token:', token);
    $ionicPush.saveToken(token); // persist the token in the Ionic Platform
  }
});

$ionicPush.register();

फिर भागो

$ grunt build:android --debug

आयोनिक पुश आपको डैशबोर्ड के माध्यम से लक्षित पुश सूचनाएं बनाने देता है। आप नीचे दिए गए प्रारूप में सर्वर से सूचनाएं भी भेज सकते हैं।

curl -X POST -H "Authorization: Bearer API_TOKEN" -H "Content-Type: application/json" -d '{
    "tokens": ["DEVICE_TOKEN"],
        "profile": "PROFILE_TAG",
        "notification": {
                "message": "Hello World!"
        "android": {
                  "title": "Hi User",
                  "message": "An update is available for your App",
                  "payload": {
                        "update": true
                  }
            }
    } }' "https://api.ionic.io/push/notifications"

नोट: IOS पुश को iOS के लिए कॉन्फ़िगर करने के चरण पुश प्रोफाइल बनाने के अलावा समान हैं। IOS पुश प्रोफाइल बनाने के लिए http://docs.ionic.io/v2.0.0-beta/docs/ios-path-foriles देखें

नमूना अनुप्रयोग

यहां सैंपल एप डाउनलोड करें ।

संदर्भ के लिए एक नमूना ऐप यहां संलग्न है।

IonicApp:
│
│   bower.json
│   Gruntfile.js
│   package.json    
│       
└───app
    │   index.html
    │   
    ├───js
    │       app.js
    │       controllers.js
    │       
    └───templates
            home.html
            menu.html

नोट: यह एक स्टैंडअलोन प्रोजेक्ट नहीं है। दिए गए कोड किसी भी मुद्दे या त्रुटियों के मामले में, इस दस्तावेज़ में ऊपर दी गई प्रक्रियाओं का उपयोग करके बनाई और कार्यान्वित की गई परियोजना के खिलाफ तुलना करने के लिए ही है।