Sample Application with Ionic 2 and Salesforce

A few weeks ago, I shared a version of the DreamHouse sample application built with the latest release candidate of Ionic 2. The app came with two interchangeable implementations of the data services: Mock and REST. Since then I’ve been working on ForceJS 2, a JavaScript library for the Salesforce REST APIs. ForceJS 2 is now built on ECMAScript 6, uses modules and promises, and integrates seamlessly with Angular 2 and Ionic 2.

In this post, I’ll share the same DreamHouse application using a Salesforce back-end, as an example of using ForceJS 2 to access Salesforce from an Ionic 2 application. The application is built with the Salesforce Mobile SDK and the latest release candidate of Ionic 2

Watch the video:

Source Code and 5 Minute Install

The source code and installation instructions are available in this GitHub repository.

91 Responses to Sample Application with Ionic 2 and Salesforce

  1. D Riley December 9, 2016 at 3:03 pm #

    Thank you for the example. I followed the (short of ionic cordova install, already installed) instructions and got the following error. Thoughts?
    ionic serve

    …[12:26:36] ionic-app-scripts 0.0.45
    [12:26:37] watch started …
    [12:26:37] build dev started …
    [12:26:37] clean started …
    [12:26:37] clean finished in 1 ms
    [12:26:37] copy started …
    [12:26:37] transpile started …
    throw er; // Unhandled ‘error’ event

    Error: listen EADDRINUSE
    at Object.exports._errnoException (util.js:1026:11)
    at exports._exceptionWithHostPort (util.js:1049:20)
    at Server._listen2 (net.js:1257:14)
    at listen (net.js:1293:10)
    at net.js:1403:9
    at _combinedTickCallback (internal/process/next_tick.js:77:11)
    at process._tickCallback (internal/process/next_tick.js:98:9)
    at Module.runMain (module.js:606:11)
    at run (bootstrap_node.js:394:7)
    at startup (bootstrap_node.js:149:9)…

    Ionic version 2.1.13
    npm version 3.10.8
    node version v6.9.1

    • khalid April 6, 2017 at 12:56 pm #

      @D R
      is there any problem using ionic 2.2.2 with salesforce. I encountered many problems.
      I can’t event display info using salesforce Mobile SDK with ionic. which versions you are using please.

  2. Oktay Seo February 4, 2017 at 11:44 am #

    Çocuklar klasik bale ve dans eğitimi ve modern dansın eğlenceli ve enerjik egzersizleriyle vücut becerilerini , esneklik kazanacaklar.

    İçimizdeki dans aşkını yağmur, kar hiçbir şey dindiremez. Çünkü dans etmeyi seviyoruz ve bu işi yaparken çok mutluyuz. Bahçeşehir bale kursu eğitimi, sağlıklı, güçlü bir bünyeye sahip olabilir, bağışıklık sisteminizi güçlendirebilirsiniz. Öğrencilerin duruşu, yürüyüşünü kendini ifade edebilme tarzını geliştirebilirsiniz. Fiziksel estetik sağlar. Ücretsiz deneme eğitimi için arayabilirsiniz.

  3. khalid April 6, 2017 at 12:52 pm #

    Mr. Christophe, Can you share updates please.
    I see Ionic 2.2.2 can’t work with Salesforce Mobile SDK . Can you tell us please tools version to use.
    I see even there is no adress to contact you. we are really stuck and wewant to know if it is possible to work with ionic 2 using Salesforce SDK.
    Best Regards

  4. Daniel Heller April 28, 2017 at 1:43 am #

    Very nice post. I absolutely appreciate this site.Keep it up!

  5. Hasan ATAR May 25, 2017 at 6:29 am #
    kayseride satılık daire ev ilanlarına ulaşmak artık çok kolay en geniş ve güncel portföy listemizle hizmetinizdeyiz.

  6. Kanav May 28, 2017 at 10:42 am #

    Hi Christophe,

    I am trying to run this with the latest version of ionic, but I get the following error:
    “TypeError: AppScripts.serve is not a function”. Can you please help?

    • Kanav June 5, 2017 at 12:34 am #

      Hi Christophe,

      I was able to get this to work, however now I’m facing some issues with App performance:
      1) On the Property and Broker List views, the images take some time to load
      2) On the Property and Broker Detail pages, the data placeholders load first, followed by a slight delay, and then the actual Data loads.

      Would you have any recommendations on getting around this please?


    • Hristo July 10, 2017 at 3:26 am #

      try this: npm install –save-dev @ionic/app-scripts@latest

      • fin shelby March 20, 2020 at 2:20 pm #

        Share this kinda educational information on Whatsapp sniffer and also use it for the best advanced features in sharing the data. Download Whatsappsniffer apk here.

  7. Vijay Chauhan June 16, 2017 at 8:07 am #


    I am trying to run this with the latest version of ionic, but I get the following error:
    “TypeError: AppScripts.serve is not a function”. Can you please help?

    • Hristo July 10, 2017 at 3:24 am #

      npm install –save-dev @ionic/app-scripts@latest

      • Vijay Chauhan July 11, 2017 at 7:56 am #


  8. Ravi Haibatti June 21, 2017 at 8:34 am #

    hi sir,
    when i login through the salesforce in app i am getting error cannot get oauthcallback.html. Can you please help about this issue.


  9. Rafael Delaflor Chumpitaz July 17, 2017 at 12:50 am #


  10. Prashant Kumar Srivastava September 6, 2017 at 2:28 am #

    Hi Christophe, I have an issue in authentication part. After authentication, my callback is not being called. I have done it as following:

    let appId = ‘value of Consumer Key’;
    let loginURL = ‘’;
    let oauthCallbackURL = ‘http://localhost:8100/callback’;

    let oauth = OAuth.createInstance(appId, loginURL, oauthCallbackURL);
    console.log(‘=============oauth: ‘, oauth)

    oauth.login().then(oauthResult => {
    //this part is not called after authentication
    console.log(“Logged Into Salesforce Successfully”);

    In pop-up URL i can see the access token but not able to use that because it is not going to callback part. Please suggest where i am missing. I am able to login through pop-up, but pop-up is not closing after successful/unsuccessful authentication.

    • Kanav February 21, 2018 at 2:02 pm #

      Hi Prashant,

      I am facing the same issue. My Auth callback is not being called. Were you able to find a solution?

      • Gautam Choudhary February 25, 2018 at 1:28 pm #

        Hi Prashant,

        Any solution?

    • Gautam Choudhary February 25, 2018 at 1:29 pm #

      Hi Prashant,
      I am facing same issue. If you find any solution please guide.

      • Prashant Kumar Srivastava February 27, 2018 at 8:29 am #

        Hi Gautam,
        I have resolved this issue by placing oauthcallback.html in root directory(in the same directory of index.html). You can find this file under app directory of this git repository.

        Content of this file is:

        var event = new CustomEvent(“oauthCallback”, {“detail”: window.location.href});

        • Gautam Choudhary February 28, 2018 at 4:59 am #

          Thanks Prashant for you response. It’s working find with iOS but not with android.


          • Prashant Kumar Srivastava February 28, 2018 at 5:20 am #

            You need this authcallback.html for desktop browsers. For mobile devices only callbackURL in your JS should match to the callbackURL mentioned at salesforce connected app(I am not sure, but make sure your callbackURL is same at both places).

  11. scigazer October 10, 2017 at 12:49 pm #

    Hi Christophe,

    I tried to run your app but I got this error:

    Runtime Error
    webpackJsonp is not defined

    ReferenceError: webpackJsonp is not defined at http://localhost:8101/build/main.js:1:1

    Can you please advise how to resolve this? Thanks!

    • Kanav February 21, 2018 at 10:45 pm #

      Hi @scigazer:disqus . Im facing the same issue. Were you able to resolve it?

      • Jacky Wang July 15, 2018 at 9:50 pm #

        Hi Kanav

        Have u find the soltion about this problem?

  12. Dibakar Sahoo November 21, 2017 at 6:51 am #

    Hi, I am Dibakar, working in a marketing team. We are looking for a salesforce influencer, who is technically strong and engaged in real paid reviews on salesforce related third party products.
    In case, you are interested please send your details like site URL, review links already done, site traffic and price per review. Looking forward for an early response.
    Thanks. Dibakar

  13. Damny January 26, 2018 at 9:59 am #

    Lovely Great post

    latest music here in Nigeria and South Africa

  14. Devesh Agarwal (IN) March 9, 2018 at 7:30 am #

    Hi All,

    Can anyone please help me. On running this app in the android emulator, I see a run time error, but no more info. The home screen opens to this error and the popup for login does not open. After the run time error occurs, the logs show this:

    [17:52:47] console.log: Angular 2 is running in the development mode. Call enableProdMode() to enable the production
    [17:52:48] console.warn: Native: deviceready did not fire within 2000ms. This can happen when plugins are in an
    inconsistent state. Try removing plugins from plugins/ and reinstalling them.
    [17:52:48] console.log: DEVICE READY FIRED AFTER 3149 ms

    After this the properties page and others don’t open due to salesforce not being logged in.

    Any help would be appreciated.

  15. ABDQUDUS DAMILARE March 11, 2018 at 7:44 am #


  16. Ayo Adekola March 12, 2018 at 12:43 pm #

    Thanks .

    • Jim Collins February 3, 2019 at 11:21 pm #

      furama da nang villa is best villa in da nang for 3 and 4 bedroom

  17. CIIT Noida April 19, 2018 at 3:14 am #

    Thanks for sharing this amazing post with us.

    Hadoop Training Institute in Noida

    Best Hadoop Training in Noida

  18. Devesh Agarwal (IN) April 30, 2018 at 9:45 am #

    Hi Christophe,

    I want to call the salesforce login at a different point in my app. This is after 3-4 pages. My app is using Angular 2 and Ionic. Can you please help me on how to achieve this? On calling the login function in oauth later, I get the following error:

    TIMING com.salesforce.oauth:getAuthCredentials failed

  19. Dinesh Kumar June 11, 2018 at 8:12 am #

    Very useful article. We are really thankful for this article.visit,
    app development
    for new techniques for boost your business.

  20. calfre1995 August 12, 2018 at 5:31 am #

    Great and really helpful article! Adding to the conversation, providing more information, or expressing a new point of view…Nice information and updates. Really i like it and everyday am visiting your training

  21. Web Development Company September 15, 2018 at 3:56 am #

    Wow, this is really good. I had no clue so far that IONIC too can work with salesforece SDK. Nice Blog Post

    Thanks on behalf of Team TechnoBrains (

  22. Shahbaz Sharif October 4, 2018 at 12:54 pm #

    nice web.



  23. David King October 7, 2018 at 9:23 pm #

    Thanks on behalf of Team Hypemedia (

  24. Why Telling You October 30, 2018 at 1:38 pm #

    Awesome posts. your website is awesome. keep up the good work. thank you. free network monitoring tools

  25. zubair hameed December 28, 2018 at 2:45 am #

    Great Blog With Full Information I Love This Blog Thanks To Sharing Keep It Up
    FL Studio Crack

    BlueSoleil Crack

    AnyDVD Crack

    VCE Exam Simulator Crack

    HMA Pro VPN Crack

  26. Sajid January 30, 2019 at 4:31 pm #

    Such a great site in the world, very helpful for me, thank you for sharing your great skills with us, keep it up.
    Stellar Phoenix Pro Crack

  27. Sajid January 30, 2019 at 4:31 pm #

    Such a great site in the world, very helpful for me, thank you for sharing your great skills with us, keep it up.
    SpyHunter 5 Crack

  28. Sajid January 30, 2019 at 4:32 pm #

    Such a great site in the world, very helpful for me, thank you for sharing your great skills with us, keep it up.
    Dr.Fone Crack

  29. Lilly Chen February 5, 2019 at 9:06 am #

    Can you please help me on how to achieve this? thanks

  30. TargbaBenjamin February 7, 2019 at 3:23 pm #

    nice job sir.

  31. Hopeyemi June 16, 2019 at 10:01 am #

    Jay Z Is Being Sued For Sampling A Track Released 1969
    read more

  32. Hopeyemi June 16, 2019 at 10:07 am #

    Jay Z Is Being Sued For Sampling A Track Released 1969Read more

  33. Serpil ÇİÇEKÇİ June 20, 2019 at 8:34 am #

    Marmaris tekne turu olarak hizmetlerimiz, marmaris efes turu | Dalyan tekne turu | kleopatra plajı | marmaris pamukkale turu gibi ve daha fazla avantajlardan yararlanmak için bizimle iletişime geçebilirsiniz.

  34. Cakiroglu Nakliyat June 22, 2019 at 2:55 am #

    Çakıroğlu Nakliyat olarak verilen başlıca hizmetlerimizden bir kaçı, Asansörlü nakliyat | Ofis taşımacılığı | Piyano taşımacılığı | Buca evden eve nakliyat | Karşıyaka evden eve nakliyat | İzmir eşya depolama vb. işlemleri en kaliteli ve profesyonel şekilde müşterilerine sunmaktadır.

  35. Opeyemi June 24, 2019 at 9:53 am #

    nice one here,a very useful information

  36. CRACKS [2020] December 24, 2019 at 5:23 am #

    excellent work is done here. thanks for sharing…

  37. sincanotokiralama February 6, 2020 at 3:30 am #

    Etimesgut oto kiralama bulunduğu konum itibariyle belli başlı müşteri potansiyeline sahip güncel araç kiralama firmasıdır.

    Etimesgut Oto KiralamaEtimesgut Rent A Car
    Etimesgut ve çevre illerinde kiralama firmaları arasında en önde gelen acar grup bünyesinde kurulan etimesgut oto kiralama firması diğer kiralama firmalarına nazaran daha uygun fiyat avantajları ile fark yaratmaktadır.

    Etimesgut Araç Kiralama – Etimesgut Oto Kiralama
    Etimesgut ilçesinin kurulduğu alanın ilk çağlarda önce Hitit daha sonra da Frig uygarlıklarının topraklan içinde yer alındığı bilimsel bir gerçektir. Tarihçi Afif Erzen “İlkçağda Ankara” adlı eserinde, Ahi Mesud adlı yerde bulunan aslanların Frigya Aslanı olduğunu yazmakta ve ilk çağda bu yörenin adının Amaksis olduğunu belirtmektedir. Haritacı Kiepert de çizdiği haritalarda, Etimesgut ilçesinin bulunduğu bölgeyi Amaksiz olarak anar. Osmanlı haritalarında bu isim Amaksus ve Akmasus olarak geçmiştir.

    Etimesgut yöresi, Cumhuriyetin ilanından sonra Batı Trakya’dan gelen göçmen Türkler için 1924-25 yıllarında Atatürk’ün emri ile 50 haneli bir köy olarak kurulmuştur. 1928 yılında iskâna açılarak belde olarak yeniden yapılandırılmıştır. Ata’nın Etimesgut yöresine özel bir ilgisi vardı. Buraya haftada birkaç kez gelip at gezintileri yapar, halkla yıllık mahsuller hakkında konuşur hatta tarlalara kadar gidip çiftçilerden bilgi alırdı. Bölgede Atatürk zamanında yaptırılan Sağlık Merkezi, Devlet Hastanesi, PTT, hamam, çarşı, memur lojmanı gibi binalar halen varlığını sürdürmektedir.

    Etimesgut, kendisine bağlı 18 köy ile 1968 yılına kadar belde olarak kalmış, aynı yıl mahalle olarak yeniden kurulmuştur. 20 Mayıs 1990 gün ve 20523 sayılı Resmi Gazetede de yayınlanan 3644 sayılı Kanunla ilçe statüsü kazanmış, hemen ardından da 19 Ağustos 1990 tarihinde yapılan belediye başkanlığı seçimi ile Belediye teşkilatı kurulmuştur.

    İlçedeki kültür varlıklarına örnek teşkil eden Atatürk Çeşmesi 1928 yılından beri ayaktadır. 1925 yılında Mimar Ahmet Burhanetün tarafından yapılan Gazi Tren İstasyonu ile Atatürk’ün İstanbul’a gidiş ve gelişlerinde uğurlandığı Etimesgut Tren İstasyonu tarihi yapı özellikleriyle dikkat çekicidir. Etimesgut yöresine adını veren Ahi Mesud, Ahi Elvan gibi Türk büyüklerindendir. Ahi Elvan Hazretlerinin türbesi Elvanköy semtinde Elvanköy Camisi avlusundadır.

    İlçenin Eryaman bölgesinde bir mesire ve piknik yeri olan Göksu Parkı, tatil günlerinde Ankaralıların dinlenme yeridir. Ayrıca, Atatürk Orman Çiftliği, ilçe sınırlan içinde olup iyi bir dinlenme, piknik ve gezi alanıdır.

    Etimesgut Oto Kiralama – Etimesgut Filo Kiralama

    Etimesgut’a adını veren Ahi Mesud’un Bağlıca Mahallesi’nde bulunan mezarı da dönemin mimari özellikleri dikkate alınarak projelendirilerek ilçeye kazandırılmıştır.


    Merkezde havuz, spor merkezleri, sauna, kreş ve halk kütüphanesi ile çeşitli sosyal ve kültürel donatılar hizmet vermektedir.

    TUĞRA PARKI – Etimesgut Oto Kiralama

    Parkta, geleneksel Türk motifleri, 11,5 metre yüksekliğinde kule olarak tasarlanmış ve üç tarafına üç ayrı tuğra yerleştirilmiş Tuğra Anıtı, Ayyıldızlı havuzlar, koşu yolu, fitness ve çocuk oyun alanı, kafeterya ve özel aydınlatma sistemleri yer almaktadır.

  38. Hafiz Muhammad Hasan February 28, 2020 at 7:37 pm #

    Thank you for sharing a lot of useful information VideoPad Video Editor Registration Code

  39. ab March 8, 2020 at 8:03 pm #

    royasan CO Is A 30 Year Old Company And One Of Top Iranian Used Oil Recycling Plant Manufacturers , Oil Distillation Plant , Grease , Solvement 402 , Sulfurization ,Waste Engine Oil Distillation Plant Manufacturers And Other

  40. kashif baba March 9, 2020 at 8:11 am #
    Crack torrent software is free here

  41. hanaan virk March 26, 2020 at 8:30 am #
    FL Studio Full Crack is the software amazing and famous for audio workstation works. It’s a good music production tool globally. It is also known as the powerhouse of music tools. That tool FL Studio Torrent entirely helps to make the best music. Here is a great way to find the best way for different elements of music and composition. This has a new innovation. That improves music in addition to lighting. This application is possible to use in 3 distinct versions of MS Windows. This application FL Studio Keygen has a number of unique tools, including music and that’s 100% right.

  42. Gistbased April 4, 2020 at 7:47 am #

    I am trying to run this with the latest version of ionic, but I get the following error:
    Music Download

  43. ijicrackgh April 21, 2020 at 4:33 am #

    Meeno bhai is a very great person. e always love neature.

  44. Oliver Wright July 2, 2020 at 5:34 am #

    I needed help with my assignment, and i needed it quick. I dont normally shop for an essay, but this time around i had no other option as i was running out of time. I gave it a try, and the essay came out as perfect as my professor had hoped. Here service simply one of the best online paper writing service.

  45. raber asroon July 4, 2020 at 7:48 am #

    Alat launched the Asron site. Dear customers and you users, you can buy all kinds of construction and industrial hardware in Asron online store, such as oil sheets, rebars, beams, black sheets, copper and aluminum, corner, studs, profiles, لیست قیمت ورق سیاه
    alloy and industrial sheets, galvanized, Types of wire cases, roll bolts, polycarbonate, etc.

  46. yuvaraj singh August 14, 2020 at 3:01 am #

    Advanced Scrum Master training
    At Leanpitch, we believe in creating WoW (World of Work) experiences in our workshop and beyond. So our workshops are full of real life simulations and post-workshop support ensures you have help when you get started implementing concepts at your workplace.

  47. yuvaraj singh September 9, 2020 at 3:15 am #

    Thanks for sharing
    Leanpitch provides online training in Advanced Scrum Master during this lockdown period everyone can use it wisely.
    Advanced Scrum Master Training Online

  48. Mahraja Express October 8, 2020 at 3:40 am #

    I’m excited to uncover this page. I need to to thank you for ones time for this particularly fantastic read !!
    Monthly Rashifal Hindi

  49. Mahraja Express October 12, 2020 at 7:12 am #

    Just want to say your article is as astonishing. The clarity in your post is just excellent and i can assume you are an expert on this subject. Well with your permission let me to grab your feed to keep updated with forthcoming post. Thanks a million and please carry on the enjoyable work. Regards:Luxury Train Tours

  50. Ikhsan Rizky October 26, 2020 at 7:01 pm #

    good. visit us ath here

  51. aadhya Sharma November 5, 2020 at 6:07 am #

    Very Informative! To know more on power bi online training course

  52. yuvaraj singh November 23, 2020 at 3:06 am #

    Scrum master interview questions
    To crack scrum master interview : Scrum Master Interview Questions

  53. yuvaraj singh November 23, 2020 at 4:25 am #

    Thanks for sharing this informative content , Great work
    To crack scrum master interview : Scrum Master Interview Questions

  54. Lily 22 December 2, 2020 at 8:17 am #

    Hello, all..
    my name is angel I work at prediksi master hk if my friends want to learn about guessing numbers, please contact me

  55. VivaTVApk December 3, 2020 at 8:09 am #

    Wow. I read all the informative points here that you have discussed here. I appreciate your working here. Thanks and carry on sharing it VivaTV Apk

  56. candy crush saga December 21, 2020 at 11:42 am #

    Thanks for your sharing, they were very helpful to me. thank you very much!
    puzzle jigsaw

  57. yuvaraj singh December 22, 2020 at 2:39 am #

    Thanks for sharing this content , Great work
    Leanpitch provides online training in Enterprise agile coaching during this lockdown period everyone can use it wisely.
    Enterprise Agile Coaching

  58. rohiniseema December 28, 2020 at 9:53 am #

    Thanks for sharing such a great blog……!!!

    full form
    full form of nrc
    nrc full form
    mbbs full form
    full form of rip

  59. KeysMac PlatForm December 30, 2020 at 11:36 am #

    Intuit TurboTax 2020 Canada Edition Crack Free Download Intuit TurboTax 2020 Canada Edition Crack is a brilliant software for preparing your files for paying your tax return.

  60. Emma Jackson January 18, 2021 at 2:04 am #

    Wow! what a great post, by the way, I like this Real Leather Jacket and I will definitely recommend others too.

  61. Ravikumar February 2, 2021 at 7:43 am #

    Thank you for sharing this informative content, Great work.

    To crack Scrum master interview: Scrum master interview questions

  62. Rack Digital February 6, 2021 at 7:52 am #

    Rack37 is the fastest platform for liquidation goods. We make the process of sourcing & buying bulk inventories easiest, transparent, reliable and hassle-free. Buy & sell stock lots with just a few taps and start making money. Get & give inventory details on the go and let the business come to your notification box. Enjoy liquidation hassle-free with the Rack37

  63. Repair Maniac February 8, 2021 at 7:10 am #

    Helped a lot – Repair Maniac

  64. Steve smith February 9, 2021 at 11:42 am #

    A very informative post. I will use the suggestions discussing here for optimizing my new blog site. This post will be very helpful for the beginner SEO worker who is new in this field.Windows 10 Pro

  65. Saket Kumar February 12, 2021 at 6:19 am #

    Great post

  66. Hax4you March 7, 2021 at 6:32 am #

    BeeTV is the Free for movies BeeTV apk for Download

  67. Kunal Dhawan March 13, 2021 at 6:59 am #

    Welcome to ‘DigiLink Services’. The Company established last few year back in the field of Digital Marketing & Web Development Services provides complete Digital Marketing web designing and development under one roof ,we have progressed towards of our clients with our best quality and affordable prices.

  68. Mehmood Ahmmad March 22, 2021 at 11:24 am #

    Get big quietly, so you don’t tip off potential competitors!
    Loaris Trojan Remover Crack


  1. Ionic V2 Stater App using Salesforce SDK – Vivek Deepak - April 4, 2017

    […] we start I referred sample app on the same topic by Christophe which is here when I first started building Ionic V2 […]