Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

A Vue from Ionic

488 views

Published on

A presentation by Ionic's Josh Thomas at VueConf (11/16/18) on our latest compatibility with Vue framework.

Published in: Technology
  • Be the first to comment

A Vue from Ionic

  1. 1. AVuefromIonicAVuefromIonic JoshThomas/@jthoms1
  2. 2. AboutMeAboutMe SeniorDeveloperatIonic IonicOpenSourcecoreteammember OrganizerofMadJS
  3. 3.  
  4. 4. WhyIlikeVueWhyIlikeVue Documentation Robusttoolchain BatteriesIncluded(asyouwish) TypeScriptSupport
  5. 5. AVuefromIonicAVuefromIonic
  6. 6. WhatisIonic?WhatisIonic?
  7. 7. WhatisIonic?WhatisIonic? 5M+Appscreated 30K+StackOverflowQuestions 100+Meetups OpenSourceandMITlicensed Collectionofover100components Cross‑platformappswithasinglecodebase Useanativebridgefordeviceapis
  8. 8.  
  9. 9. ExtensiveExtensive ..documentationdocumentation
  10. 10. WhenshouldyouuseIonic?WhenshouldyouuseIonic? Youarebuildingamobileapp YouarebuildingaPWA/webapp Youarebuildingandesktopapp
  11. 11.    
  12. 12. TheJSecosystemischangingTheJSecosystemischanging "Whichframeworkdoyouprefer?" Ioniccomponentsshouldworkwithanyframeworkorwith noframework
  13. 13. IonicandVueIonicandVue
  14. 14.  
  15. 15. IonicandVueIonicandVue Approachable Performant ExcellentDocumentation Startwithalittleoralot
  16. 16.  
  17. 17. Createdby PWA: Repo:https://github.com/ModusCreateOrg/beep beep.modus.app
  18. 18. @ionic/vue@ionic/vue(alpha)
  19. 19. @ionic/vue@ionic/vue import Vue from 'vue'; import Ionic from '@ionic/vue'; Vue.use(Ionic); new Vue({ router, store, render: h => h(App) }).$mount('#app');
  20. 20. @ionic/vuecomponents@ionic/vuecomponents <template> <ion-select ok-text="Okay" cancel-text="Dismiss"> <ion-select-option value="satellite">Satellite</ion-se <ion-select-option value="terrain">Terrain</ion-select <ion-select-option value="traffic">Traffic</ion-select </ion-select> </template>
  21. 21. LiveCodingwithAlphaLiveCodingwithAlpha
  22. 22. NextStepsNextSteps CommunityTesting UpdateDocumentation
  23. 23. ThankYou!ThankYou! https://github.com/ionic‑team/ionic https://ionicworldwide.herokuapp.com https://forum.ionicframework.com

×