Index
A
- Animate.css
- about / Animate.css
- using / Using Animate.css
- animations / Animations
- anti-pattern
- communication / Communication – Anti-pattern
- communication, modifying / What can we change about this to make it better?
- children mutating props / Children mutating props – Anti-pattern
- children mutating props, working / What should we do instead?
- property arrays, mutating / Mutating property arrays
- data, using as object / Using data as an object - Anti-Pattern
- components, naming / Naming components – Anti-pattern
- application level / State Management Pattern (SMP)
- asyncData / asyncData
B
- bindings
- about / Bindings
- secondary properties, adding / Adding secondary properties
- style bindings / Style bindings
C
- category component
- creating, in Nuxt / Categories
- category detail page, Nuxt / Category detail
- client connection
- about / Client connections
- Vue, setting up / Setting up Vue and Socket.io
- Socket.io, setting up / Setting up Vue and Socket.io
- Command Line Interface (CLI) / Prerequisites
- component communication
- about / Component communication
- property values, configuring / Configuring property values
- custom events / Custom events
- events values, sending / Sending event values
- event values, sending / Sending event values
- component level / State Management Pattern (SMP)
- Component Navigation Guards
- about / Component Navigation Guards
- beforeRouteUpdate / beforeRouteUpdate
- beforeRouteEnter / beforeRouteEnter
- beforeRouteLeave / beforeRouteLeave
- components
- communicating / Components
- naming / Naming components – Anti-pattern
- template expressions / Template expressions
- Presentational components / Pattern – Container/Presentational components
- Container components / Pattern – Container/Presentational components
- prop, validation / Prop validation
- reactivity / Understanding reactivity
- computed properties / Computed properties
- connection status
- determining / Determining connection status
- connection status bar, creating / Creating a connection status bar
- Continuous Integration (CI)
- about / Continuous Integration (CI)
- unit tests / Unit tests
- Git repository, creating / Creating a Git repository
- Travis CI, connecting to / Connecting to Travis CI
- automatic deployment, to Firebase / Automatic deployment to Firebase
- CSS Animations
- about / CSS animations
- animate.css / Animate.css
- custom layouts
- creating, in Nuxt project / Layouts
D
- data properties / Data properties
- Document Object Model (DOM) / Summary, DOM
- DOM elements
- displaying conditionally / Conditionally showing DOM elements
- v-show / v-show
- v-if / v-if
- v-else / v-else
- v-else-if / v-else-if
- DOM events
- handling, with v-on / DOM events and v-on
- dynamic routes
- route props / Route props
E
- elements
- rendering / Rendering elements
- attributes / Attributes
- components / Components and props
- props / Components and props
- JSX / JSX
- error page / Error page
- Event Bus / Event Bus
F
- filters
- about / Filters
- locally registered filters / Locally registered filters
- globally registered filters / Globally registered filters
- Firebase
- deploying / Firebase deployment
- reference / Firebase deployment
- form validation
- about / Form validation
- Vuelidate / What is Vuelidate?
- Vuelidate, using / Using Vuelidate
- functional components / Render/functional components
G
- GET / HTTP GET
- globally registered filters / Globally registered filters
- global router hooks
- beforeEach / beforeEach
- beforeResolve / beforeResolve
- afterEach / afterEach
- resolution stack / Resolution stack
H
- Homebrew
- reference / Installing Node via Homebrew
- HTTP
- about / HTTP
- JSON server, installing / Installing JSON server
- GET / HTTP GET
- POST / HTTP POST
- PUT / HTTP PUT
- DELETE / HTTP DELETE
J
- JavaScript
- this, working / How 'this' works within JavaScript
- JavaScript modules
- about / JavaScript modules
- Vue-loader / Vue-loader
- JSON server
- installing / Installing JSON server
L
- lazy loading routes / Lazy loading routes
- lifecycle hooks
- about / Lifecycle hooks, Lifecycle hooks
- created() / Lifecycle hooks
- mounted() / Lifecycle hooks
- destroyed() / Lifecycle hooks
- URL / Lifecycle hooks
- locally registered filters / Locally registered filters
M
- message list / Message list
- Mock REST API / The Mock REST API
- modules / Modules and scalability
- moment
- URL / Filters
N
- navigation bar / Navigation bar
- ngrok
- reference / Testing on a device
- Node
- installation link / Windows
- installing, via Homebrew / Installing Node via Homebrew
- Node Version Manager (NVM) / Installing Node via Homebrew
- Nuxt
- about / Nuxt
- project, creating / Creating a Nuxt project
- directory structure / Directory structure
- configuration / Nuxt configuration
- navigation / Navigation
- routes, navigating / Navigating between routes
- custom layouts, creating / Layouts
- Mock REST API / The Mock REST API
- asyncData / asyncData
- categories, creating / Categories
- category detail page / Category detail
- error page / Error page
- plugins / Plugins
- recipes, adding / Adding recipes
- transitions, adding / Transitions
- building, for production / Building for production
- building, in static mode / Static
- building, in SPA mode / SPA mode
P
- plugins, Nuxt / Plugins
- prerequisites
- Windows / Windows
- Mac / Mac
- Editor / Editor
- Browser / Browser
- Vue CLI / Vue CLI
- React / React
- Angular / Angular
- mobile development / Mobile development
- Server-Side Rendering (SSR) / Server-Side Rendering (SSR)
- web framework selection / Conclusion
- programmatic navigation
- about / Programmatic navigation
- router.replace / router.replace
- router.go / router.go
- Progressive Web Applications (PWAs)
- about / Progressive Web Applications (PWAs)
- manifest / Web application manifest
- testing, on device / Testing on a device
- proxying
- about / Proxying
- this, working within JavaScript / How 'this' works within JavaScript
- this, handling / How Vue handles 'this'
R
- React
- reference / React
- reactivity
- about / Understanding reactivity
- URL / Understanding reactivity
- real-time chat application
- creating, with Node / Real-time chat application with Node and Socket.io
- creating, with Socket.io / Real-time chat application with Node and Socket.io
- Socket.io / What is Socket.io?
- server, setting up / Server setup
- client connections / Client connections
- connection status, determining / Determining connection status
- navigation bar / Navigation bar
- message list / Message list
- messages, adding to list / Adding messages to the list
- server-side events, with Socket.io / Server-side events with Socket.io
- nodemon / Nodemon
- render components
- about / Render/functional components
- elements, rendering / Rendering elements
- router
- using / Using the router
- routes, creating / Creating routes
- dynamic routes / Dynamic routes
- Component Navigation Guards / Component Navigation Guards
- global router hooks / Global router hooks
- programmatic navigation / Programmatic navigation
- lazy loading routes / Lazy loading routes
- RxJS
- and Vue / RxJS and Vue
- about / What is RxJS?
- integrating, with Vue / Integrating with Vue
S
- scalability / Modules and scalability
- Server-Side Rendering (SSR) / Server-Side Rendering (SSR), Nuxt
- service worker
- about / Service worker
- reference / Service worker
- Single File Components (SFC) / Your first Vue component
- Single Page Application (SPA) / Single Page Applications, Building for production
- slots
- about / Slots
- defaults / Defaults
- named slots / Named slots
- Socket.io
- used, for creating real-time chat application / Real-time chat application with Node and Socket.io
- about / What is Socket.io?
- setting up / Setting up Vue and Socket.io
- SPA project
- about / An SPA project
- router, enabling / Enabling the router
- routes, defining / Defining routes
- UserList route, creating / Creating the UserList route
- data, obtaining from API / Getting data from an API
- detail page, creating / Creating a detail page
- child routes / Child routes
T
- testing / Why testing?
- this
- working, within JavaScript / How 'this' works within JavaScript
- handling / How Vue handles 'this'
- transitions
- about / Transitions
- states / Transition states
- adding, in Nuxt / Transitions
- Travis CI
- connecting to / Connecting to Travis CI
- reference / Connecting to Travis CI
- configuring / Configuring Travis
- automatic deployment, to Firebase / Automatic deployment to Firebase
- TypeScript
- and Vue / TypeScript and Vue
- lifecycle hooks / Lifecycle hooks
- properties / Properties
- computed / Computed
U
- unit testing
- about / Unit testing
- vue-test-utils, setting up / Setting up vue-test-utils
- TodoList, creating / Creating a TodoList
- tests, writing / Writing tests
- vue, options / Vue options
- features, adding / Adding new features
- click events / Click events
- events, testing / Testing events
V
- v-for
- iteration / Iteration with v-for
- v-model directive / Model
- v-on
- used, for handling DOM events / DOM events and v-on
- key modifiers / Key modifiers
- event modifiers / Event modifiers
- Vetur / Vetur
- Virtual DOM / Vue.js and the Virtual DOM, Virtual DOM
- Visual Studio Code
- reference / Editor
- Visual Studio Code extensions
- about / Visual Studio Code extensions
- Vetur / Vetur
- Vue 2 Snippets / Vue 2 Snippets
- VNode (Virtual Node) / Rendering elements
- VNodes (Virtual DOM Nodes) / Rendering elements
- Vue
- setting up / Setting up Vue and Socket.io
- Vue.js
- comparing / How Vue.js compares
- reference / How Vue.js compares
- about / Vue.js and the Virtual DOM
- Vue 2 Snippets / Vue 2 Snippets
- Vue 2.x
- reference / How Vue.js compares
- Vue Command Line Interface (CLI)
- about / Vue CLI
- JavaScript modules / JavaScript modules
- modules, loading without Webpack / Loading modules without Webpack
- Vue component
- about / Your first Vue component
- components, registering globally / Registering components globally
- scoped styles / Scoped styles
- components, registering locally / Registering a component locally
- Vue devtools
- installing / Installing the Vue devtools
- download link / Installing the Vue devtools
- about / Vuex and Vue devtools
- VueJS devtools / VueJS devtools
- Vuelidate
- about / Form validation
- using / Using Vuelidate
- form errors, displaying / Displaying form errors
- password validation / Password validation
- form submission / Form submission
- Vuex
- about / What is Vuex?, Vuex and Vue devtools
- State Management Pattern (SMP) / State Management Pattern (SMP)
- URL / State Management Pattern (SMP)
- state / Thinking about state
- using / Using Vuex
- store, creating / Creating a new store
- action types, defining / Defining action types
- actions / Actions
- mutations / Mutations
- getters / Getters
- elements, combining / Combining elements
- payloads / Payloads
W
- W3C Custom Elements specification
- Wallaby.js
- watched properties / Watched properties
- web app manifest
- reference / Web application manifest