Vue.js 3 Design Patterns and Best Practices

Start or migrate to the new Vue 3 ecosystem, and learn to use Vite, Pinia, Web Workers, and other techniques to develop Single and Progressive Page Applications on solid ground

Key Features

• Learn best practices and design patterns from software engineering to apply to your applications with Vue
• Learn how to create Single and Progressive Web Applications, using all the resources available to you as provided by the web browser (Web Workers, IndexedDB, etc.)
• Know how to use the new ecosystem surrounding Vue 3, to develop, test, build and deploy your application to a real production server

Book Description

Vue 3 is the latest and most performant iteration of the "progressive framework" to create reactive and well responsive user interfaces. The framework itself introduces new concepts and approaches design patterns that could be uncommon in other libraries and frameworks. By learning the basics of the framework, and understanding design principles and patterns from software engineering, this book helps you identify the trade-offs of each approach and build solid applications.

It starts with basic concepts, and then moves forward through examples and coding scenarios, to build incrementally more complex architectures. You will start with a simple page, and end with a multithreading, offline and installable Progressive Web Application. The content also explores how to use the new test tools available for Vue 3, and the implementation of the upcoming Nuxt 3.

Beyond showing you "how things are done", this book helps you to learn how to "think" and "approach" common problems that design patterns have already found a solution for. Avoiding re-inventing the wheel with every project will save your time and make your software better suited for future changes.

What you will learn

• What is the Vue 3 progressive framework
• What are software principles and design patterns, how and when to implement them, and the trade-offs to consider
• Setup your development environment using the new Vite bundler
• Integrate in your applications state management, routing, multithreading, offline storage, and other resources provided to you by the browser, seldom taken advantage
• Apply and identify design patterns to solve common problems in the architecture of your web application
• Best practices for your code, organization, architecture, and user experience implementation
• Incrementally expand an application with new functionalities without re-writing the whole application each time

Who This Book Is For

This book targets Vue Developers who care about framework design principles and utilize commonly found design patterns in developing web applications. Learn to use and configure the new bundler (Vite), Pinia (State management), Router 4, Web Workers, and other technologies to create well performant and solid applications. Prior knowledge of JavaScirpt and basic knowledge of Vue would be beneficial.

Table of Contents

1. The Vue 3 Progressive Framework
2. Software Design Principles and Patterns
3. Setting Up a Working Project
4. UI Composition with Components
5. Single Page Applications
6. Progressive Web Applications
7. Data Flow Management
8. Multithreading with Web Workers
9. User Experience Patterns
10. Testing and Source Control
11. Deploying Your Application
12. Appendix