Vue.js 2 design patterns and best practices build enterprise-ready, modular Vue.js applications with Vuex and Nuxt
Become an expert Vue developer by understanding the design patterns and component architecture of Vue.js to write clean and maintainable code. About This Book Craft highly modular applications by exploring the design patterns and component architecture of Vue.js Enforce a Flux-like application archi...
| Otros Autores: | |
|---|---|
| Formato: | Libro electrónico |
| Idioma: | Inglés |
| Publicado: |
Birmingham, England ; Mumbai, [India] :
Packt
2018.
|
| Edición: | 1st edition |
| Materias: | |
| Ver en Biblioteca Universitat Ramon Llull: | https://discovery.url.edu/permalink/34CSUC_URL/1im36ta/alma991009631597506719 |
Tabla de Contenidos:
- Cover
- Copyright and Credits
- Packt Upsell
- Contributors
- Table of Contents
- Preface
- Chapter 1: Vue.js Principles and Comparisons
- Prerequisites
- Windows
- Mac
- Installing Node via Homebrew
- Editor
- Browser
- Installing the Vue devtools
- Vue CLI
- How Vue.js compares
- React
- Angular
- Mobile development
- Server-Side Rendering (SSR)
- Conclusion
- Summary
- Chapter 2: Proper Creation of Vue Projects
- Visual Studio Code extensions
- Vetur
- Vue 2 Snippets
- Vue CLI
- JavaScript modules
- Vue-loader
- Loading modules without Webpack
- VueJS devtools
- TypeScript and Vue
- Lifecycle hooks
- Properties
- Computed
- RxJS and Vue
- What is RxJS?
- Integrating with Vue
- Summary
- Proxying
- How 'this' works within JavaScript
- How Vue handles 'this'
- Data properties
- Computed properties
- Watched properties
- Lifecycle hooks
- Vue.js and the Virtual DOM
- DOM
- Virtual DOM
- Summary
- Chapter 3: Writing Clean and Lean Code with Vue
- Proxying
- How 'this' works within JavaScript
- How Vue handles 'this'
- Data properties
- Computed properties
- Watched properties
- Lifecycle hooks
- Vue.js and the Virtual DOM
- DOM
- Virtual DOM
- Summary
- Chapter 4: Vue.js Directives
- Model
- Iteration with v-for
- Bindings
- Adding secondary properties
- Style bindings
- DOM events and v-on
- Key modifiers
- Event modifiers
- Conditionally showing DOM elements
- v-show
- v-if
- v-else
- v-else-if
- Filters
- Locally registered filters
- Globally registered filters
- Summary
- Chapter 5: Secured Communication with Vue.js Components
- Your first Vue component
- Registering components globally
- Scoped styles
- Registering a component locally
- Component communication
- Configuring property values
- Custom events
- Sending event values
- Event Bus
- Slots.
- Defaults
- Named slots
- Summary
- Chapter 6: Creating Better UI
- Animations
- CSS animations
- Animate.css
- Using Animate.css
- Transitions
- Transition states
- Form validation
- What is Vuelidate?
- Using Vuelidate
- Displaying form errors
- Password validation
- Form submission
- Render/functional components
- Rendering elements
- Attributes
- Components and props
- JSX
- Summary
- Chapter 7: HTTP and WebSocket Communication
- HTTP
- Installing JSON server
- HTTP GET
- HTTP POST
- HTTP PUT
- HTTP DELETE
- Real-time chat application with Node and Socket.io
- What is Socket.io?
- Server setup
- Client connections
- Setting up Vue and Socket.io
- Determining connection status
- Creating a connection status bar
- Navigation bar
- Message list
- Adding messages to the list
- Server-side events with Socket.io
- Nodemon
- Summary
- Chapter 8: Vue Router Patterns
- Single Page Applications
- Using the router
- Creating routes
- Dynamic routes
- Route props
- Component Navigation Guards
- beforeRouteUpdate
- beforeRouteEnter
- beforeRouteLeave
- Global router hooks
- beforeEach
- beforeResolve
- afterEach
- Resolution stack
- Programmatic navigation
- router.replace
- router.go
- Lazy loading routes
- An SPA project
- Enabling the router
- Defining routes
- Creating the UserList route
- Getting data from an API
- Creating a detail page
- Child routes
- Summary
- Chapter 9: State Management with Vuex
- What is Vuex?
- State Management Pattern (SMP)
- Thinking about state
- Using Vuex
- Creating a new store
- Defining action types
- Actions
- Mutations
- Getters
- Combining elements
- Payloads
- Vuex and Vue devtools
- Modules and scalability
- Summary
- Chapter 10: Testing Vue.js Applications
- Why testing?
- Unit testing
- Setting up vue-test-utils.
- Creating a TodoList
- Writing tests
- Vue options
- Adding new features
- Click events
- Testing events
- Using Wallaby.js for a better testing experience
- Summary
- Chapter 11: Optimization
- Progressive Web Applications (PWAs)
- Web application manifest
- Testing on a device
- Firebase deployment
- Continuous Integration (CI)
- Unit tests
- Creating a Git repository
- Connecting to Travis CI
- Configuring Travis
- Automatic deployment to Firebase
- Service worker
- Summary
- Chapter 12: Server-Side Rendering with Nuxt
- Nuxt
- Creating a Nuxt project
- Directory structure
- Nuxt configuration
- Navigation
- Navigating between routes
- Layouts
- The Mock REST API
- asyncData
- Categories
- Category detail
- Error page
- Plugins
- Adding recipes
- Transitions
- Building for production
- Static
- SPA mode
- Summary
- Chapter 13: Patterns
- Components
- Communication - Anti-pattern
- What can we change about this to make it better?
- Children mutating props - Anti-pattern
- What should we do instead?
- Mutating property arrays
- Using data as an object - Anti-Pattern
- Naming components - Anti-pattern
- Template expressions
- Pattern - Container/Presentational components
- Prop validation
- Understanding reactivity
- Summary
- Other Books You May Enjoy
- Index.
