Getting to Know Vue.js : Learn to Build Single Page Applications in Vue From Scratch

Learn how to render lists of items without repeating your code structure and how to work with conditional rendering items and event handling. Containing all you need to know to get started with Vue.js, this book will take you through using build tools (transpile to ES5), creating custom components, state management, and routers. With Getting to Know Vue.js, you'll see how to combine reusable code with custom components, allowing you to create snippets of reusable code to suit your specific business needs. You'll also explore how to use Single File Components and the Vue.js Command Line Interface (CLI) to build components in a single file and add in build tools as you see fit. Getting started with a new Single Page Application (SPA) JavaScript framework can be an overwhelming task, but Vue.js makes this daunting task simple and easy to learn, allowing you to start implementing business needs with just a script reference to the library and the custom JavaScript required for your use case. Starting with a little reference and a handful of lines of custom JavaScript, you will have a complete Single Page Application before you know it. What You'll Learn Examine Vue.js templating syntax Work with binding methods Manage the state of your app by comparing your options of building a data store Adapt the more robust options compatible with Vue.js Review different router options, including creating your own router, using the Vue-router and using Page.js. Who This Book Is For Software developers with an understanding of HTML, CSS and JavaScript; prior understanding of a Single Page Application framework would be useful but not essential. Table of Contents......Page 5 About the Author......Page 10 About the Technical Reviewer......Page 11 The Value of Vue.js......Page 12 Our First Vue.js Instance......Page 13 Developer Tools......Page 16 Browsersync......Page 17 Summary......Page 19 El......Page 20 Template......Page 23 Render......Page 26 Data......Page 27 Methods......Page 31 Template Binding......Page 33 Summary......Page 38 v-show......Page 39 v-if v-else v-else-if......Page 43 v-if......Page 44 v-else......Page 46 v-else-if......Page 48 Basics......Page 52 Accessing Object Properties......Page 57 Index and Parent Properties......Page 58 Dealing with Change......Page 60 Objects......Page 63 Summary......Page 65 Computed Properties......Page 66 Watchers......Page 71 New and Old Values......Page 73 Deep......Page 74 Immediate......Page 75 Summary......Page 77 Listeners......Page 78 Handlers......Page 80 Methods......Page 81 Inline Method......Page 82 Modifiers......Page 84 Using a Modifier......Page 85 Chain Modifiers......Page 89 Input......Page 90 Summary......Page 93 v-model......Page 94 Inputs......Page 95 Text......Page 96 Number......Page 97 Date......Page 98 Password......Page 100 Check Boxes......Page 101 Groups of Check Boxes......Page 102 Radio Buttons......Page 104 Preset Radio Buttons......Page 105 Radio Buttons: Dynamic Options......Page 107 File......Page 108 Hidden......Page 110 Textarea Elements......Page 111 Select......Page 112 Multiple Selects......Page 113 Lazy......Page 115 Number......Page 116 Trim......Page 118 Styling......Page 119 Inline Styles......Page 120 Style Objects......Page 121 Classes......Page 125 One Class......Page 126 Multiple Classes......Page 128 Multiple Classes with Arrays......Page 130 Computed Classes......Page 132 Summary......Page 134 Simple Data Objects......Page 135 DIY Data Store......Page 138 Install......Page 140 Promise......Page 141 State......Page 142 Getters......Page 143 Mutations......Page 144 Actions......Page 146 Modules......Page 148 Basics......Page 149 Accessing RootState......Page 152 Namespace......Page 153 Summary......Page 155 First Component......Page 156 Using Data......Page 158 Passing Data with Props......Page 160 Events......Page 165 Slots......Page 169 Registration......Page 170 Summary......Page 172 Creating Mixins......Page 173 Using Mixins......Page 174 Using Multiple Mixins......Page 175 Creating a Directive......Page 177 Using the Directive......Page 179 Passing a Value......Page 180 Passing an Object as a Value......Page 182 Using Modifiers......Page 184 Render versus Template......Page 186 createElement......Page 190 Parameter One......Page 191 Parameter Two......Page 193 Parameter Three......Page 196 Summary......Page 197 Creating a Plugin......Page 198 Using a Plugin......Page 199 Using Options......Page 200 Registering a Global Mixin with a Plugin......Page 202 Registering Global Components with a Plugin......Page 204 Filters......Page 206 Creating and Using a Filter......Page 207 Creating a Global Filter......Page 208 Chaining Filters......Page 209 Arguments......Page 210 Summary......Page 212 SFC Structure......Page 213 Syntax Highlighting......Page 214 Installing Vue CLI......Page 216 Vue Create......Page 218 Vue Serve......Page 220 Project Root......Page 224 The src Folder......Page 225 App.vue......Page 227 Title.vue......Page 228 Rebuild and Serve......Page 230 Vue Build......Page 231 The CLI User Interface......Page 233 Summary......Page 238 Setting Up the DIY Router......Page 239 Setting Up Vue-Router......Page 244 Route Parameters......Page 250 Passing Parameter Objects......Page 253 Navigating from JavaScript......Page 257 Aliases......Page 258 The Page.js Router......Page 259 Summary......Page 263 Index......Page 264