The JavaScript framework plays a significant role in modern web frontend development. When developing web projects, companies choose a framework for various reasons, including the quality of the final product, the cost of development, coding standard, and ease of development. Hence, learning to work with a JavaScript framework, such as Vue, is essential for any modern web developer (or frontend developer or full stack developer).

This book is for programmers who want to learn and develop Web applications using Vue library, in JavaScript and TypeScript, from end to end. It focuses solely on how Vue and its ecosystem can help you build scalable and interactive web applications in the most straightforward and comfortable direction. While covering the basics, we will also get into Vue Router and Pinia for state management, testing, animation, deployment, and server-side rendering, making sure you are ready to move on and start developing complex Vue projects right away.

It’s OK if you are not familiar with Vue or the concept of Virtual DOM. This book doesn’t assume any prior knowledge of Vue or any similar framework. I will introduce and guide you through all Vue’s basics from scratch. I will also walk you through the Virtual DOM concept and reactivity system in Vue in Chapter 2, as the foundation for the rest of the book.

This book doesn’t require you to know TypeScript, though you will be better prepared if you are familiar with TypeScript basics. You will also be better prepared for the contents of the book if you have prior basic knowledge of HTML, CSS, and JavaScript. A solid foundation of these three is always crucial before diving to any web (or frontend) JavaScript framework.

Learn the core concepts of Vue.js, the modern JavaScript framework for building frontend applications and interfaces from scratch. With concise, practical, and clear examples, this book takes web developers step-by-step through the tools and libraries in the Vue.js ecosystem and shows them how to create complete applications for real-world web projects.

Youll learn how to handle data communication between components with Pinia architecture, develop a manageable routing system for a frontend project to control the application flow, and produce basic animation effects to create a better user experience.

This book also shows you how to:

• Create reusable and lightweight component systems using Vue.js
• Bring reactivity to your existing static application
• Set up a project using Vite.js, a build tool for frontend project code management
• Build an interactive state management system for a frontend application with Pinia
• Connect external data from the server to your Vue application
• Control the application flow with static and dynamic routing using Vue Router
• Fully test your application using Vitest and Playwright

Table of Contents

Chapter 1. Welcome to the Vue.js World!

Chapter 2. How Vue Works: The Basics

Chapter 3. Composing Components

Chapter 4. Interactions Between Components

Chapter 5. Composition API

Chapter 6. Incorporating External Data

Chapter 7. Advanced Rendering, Dynamic Components, and Plugin Composition

Chapter 8. Routing

Chapter 9. State Management with Pinia

Chapter 10. Transitioning and Animation in Vue

Chapter 11. Testing in Vue

Chapter 12. Continuous Integration/Continuous Deployment of Vue.Js Applications

Chapter 13. Server-Side Rendering with Vue

About the Author

Maya is Senior Software Engineer in Microsoft, working extensively with JavaScript and frontend frameworks and based in Israel. She holds a B.Sc in Computer Sciences, B.A in Business Management, and an International MBA from University of Bar-Ilan, Israel. She has worked with JavaScript and latest frontend frameworks such as React, Vue.js, etc to create scalable and performant front-end solutions at companies such as Cooladata and Cloudinary, and currently Microsoft. She founded and is currently the organizer of the VueJS Israel Meetup Community, helping to create a strong playground for Vue.js lovers and like-minded developers.

Maya is also a published author, international speaker and an open-source library maintainer of frontend and web projects. As a core maintainer of StorefrontUI framework for e-commerce, she focuses on delivering performant components and best practices to the community while believing a strong Vanilla JavaScript knowledge is necessary for being a good web developer. She can be reached at her blog (https://mayashavin.com), on Twitter @mayashavin, or via email.