Upgrade to Pro — share decks privately, control downloads, hide ads and more …

ColdFusion and Vue - Building CFML-powered reac...

Matt Gifford
October 17, 2019

ColdFusion and Vue - Building CFML-powered reactive applications

An in-depth introduction to Vue.js and implementing a CFML-powered API into your reactive application.

Given at CFCamp2019 in Munich, Germany.

Matt Gifford

October 17, 2019
Tweet

More Decks by Matt Gifford

Other Decks in Technology

Transcript

  1. DIRECTIVES Instantly recognisable with the v- prefix Can take arguments

    (eg v-bind:title) Can be written in shorthand Can be dynamic
  2. TWO-WAY BINDING Whenever a model’s property changes, change the bound

    element Whenever a bound element changes, change the model’s property
  3. COMPONENTS HEADER Title Title Lorem issue dollar sit amet Lorem

    issue dollar sit amet nav1 | nav2 | nav3 | nav4
  4. COMPONENTS HEADER Title Title Lorem issue dollar sit amet Lorem

    issue dollar sit amet nav1 | nav2 | nav3 | nav4
  5. USING AN API - AXIOS Supports the Promise API Transform

    request and response data Automatic JSON data transformations Support for XSRF
  6. VUEX Helps to deal with shared state management Ideal for

    long term productivity and larger applications More concepts, boilerplate code and architectural structure No “one-way” to structure the store
  7. SO, WHY VUEX? Keep a single source of truth for

    data Available for all components to access Avoid having to send props and emit data between every component
  8. SO, WHY VUE.JS? VERY easy to bind data to HTML

    elements Lightweight and performant Highly extensible