Vue.js: Up and Running: Building Accessible and Performant Web Apps

Vue.js: Up and Running: Building Accessible and Performant Web Apps

by Callum Macrae

Paperback

$38.99 $39.99 Save 3% Current price is $38.99, Original price is $39.99. You Save 3%.
View All Available Formats & Editions
Choose Expedited Shipping at checkout for guaranteed delivery by Thursday, March 28

Product Details

ISBN-13: 9781491997246
Publisher: O'Reilly Media, Incorporated
Publication date: 03/23/2018
Pages: 174
Sales rank: 336,731
Product dimensions: 7.00(w) x 9.10(h) x 0.50(d)

About the Author

Callum Macrae is a JavaScript developer and occasional musician based in London, UK, working at SamKnows to make the internet faster for everyone. His current favorite things to work with are Vue and SVGs (but only sometimes at the same time). He regularly contributes to open source projects including gulp and his own projects, and can be found on GitHub and Twitter (@callumacrae).

Table of Contents

Preface vii

1 Vue.js: The Basics 1

Why Vue.js? 1

Installation and Setup 3

vue-loader and webpack 4

Templates, Data, and Directives 6

v-if Versus v-show 9

Looping in Templates 11

Binding Arguments 12

Reactivity 14

How It Works 15

Caveats 16

Two-Way Data Binding 17

Setting HTML Dynamically 19

Methods 20

This 21

Computed Properties 22

Watchers 25

Watching Properties of Objects in the Data Object 26

Getting the Old Value 26

Deep Watching 27

Filters 27

Accessing Elements Directly Using ref 29

Inputs and Events 30

The v-on Shortcut 31

Event Modifiers 31

Life-Cycle Hooks 33

Custom Directives 34

Hook Arguments 36

Transitions and Animations 37

CSS Transitions 37

JavaScript Animations 39

Summary 41

2 Components in Vue.js 43

Component Basics 43

Data, Methods, and Computed Properties 44

Passing in Data 45

Prop Validation 45

Casing of Props 47

Reactivity 47

Data Flow and the .sync Modifier 48

Custom Inputs and v-model 51

Passing Content into Components with Slots 52

Fallback Content 53

Named Slots 53

Scoped Slots 54

Custom Events 56

Mixins 58

Merging Mixins and Components 60

vue-loader and .vue Files 61

Non-prop Attributes 63

Components and v-for 64

Summary 67

3 Styling with Vue 69

Class Binding 69

Inline Style Binding 71

Array Syntax 72

Multiple Values 72

Scoped CSS with vue-loader 72

CSS Modules with vue-loader 73

Preprocessors 74

Summary 74

4 Render Functions and JSX 75

The Tag Name 76

The Data Object 76

Children 78

JSX 79

Summary 80

5 Client-Side Routing with vue-router 81

Installation 81

Basic Usage 82

HTML5 History Mode 84

Dynamic Routing 85

Reacting to Route Updates 86

Passing Params to Components as Props 87

Nested Routes 88

Redirect and Alias 90

Navigation 91

The output Tag 92

Active Class 93

Native Events 93

Programmatic Navigation 94

Navigation Guards 94

Per-Route Guards 97

In-Component Guards 97

Route Order 98

404 Pages 99

Route Names 100

Summary 101

6 State Management with Vuex 103

Installation 103

Conept 104

State and State Helpers 106

State Helpers 107

Getters 109

Getter Helpers 110

Mutations 111

Mutation Helpers 112

Mutations Must Be Synchronous 113

Actions 113

Action Helpers 114

Destructuring 115

Promises and Actions 115

Modules 116

File Structure 117

Namespaced Modules 118

Summary 119

7 Testing Vue Components 121

Testing a Simple Component 121

Introducing vue-test-utils 123

Querying the DOM 124

mount() Options 125

Mocking and Stubbing Data 126

Working with Events 127

Summary 129

A Bootstrapping Vue 131

B Vue from React 135

Index 151

Customer Reviews

Most Helpful Customer Reviews

See All Customer Reviews