Learn how to build amazing and complex reactive web applications easily with Vue.js
About This Book
- Learn how to propagate DOM changes across the website without writing extensive jQuery callbacks code.
- Learn how to achieve reactivity and easily compose views with Vue.js and understand what it does behind the scenes.
- Explore the core features of Vue.js with small examples, learn how to build dynamic content into preexisting web applications, and build Vue.js applications from scratch.
Who This Book Is For
This book is perfect for novice web developer seeking to learn new technologies or frameworks and also for webdev gurus eager to enrich their experience. Whatever your level of expertise, this book is a great introduction to the wonderful world of reactive web apps.
What You Will Learn
- Build a fully functioning reactive web application in Vue.js from scratch.
- The importance of the MVVM architecture and how Vue.js compares with other frameworks such as Angular.js and React.js.
- How to bring reactivity to an existing static application using Vue.js.
- How to use plugins to enrich your applications.
- How to develop customized plugins to meet your needs.
- How to use Vuex to manage global application’s state.
Vue.js is one of the latest new frameworks to have piqued the interest of web developers due to its reactivity, reusable components, and ease of use.
This book shows developers how to leverage its features to build high-performing, reactive web interfaces with Vue.js. From the initial structuring to full deployment, this book provides step-by-step guidance to developing an interactive web interface from scratch with Vue.js.
You will start by building a simple application in Vue.js which will let you observe its features in action. Delving into more complex concepts, you will learn about reactive data binding, reusable components, plugins, filters, and state management with Vuex. This book will also teach you how to bring reactivity to an existing static application using Vue.js. By the time you finish this book you will have built, tested, and deployed a complete reactive application in Vue.js from scratch.
Style and approach
This book is a thorough, step-by-step guide showing readers how to build complete web apps with Vue.js. While teaching its intricacies, this book shows how to implement the MVVM architecture in the real world and build high-performing web interfaces.
Downloading the example code for this book. You can download the example code files for all Packt books you have purchased from your account at http://www.PacktPub.com. If you purchased this book elsewhere, you can visit http://www.PacktPub.com/support and register to have the code file.
Table of contents
Learning Vue.js 2
- Learning Vue.js 2
- About the Author
- About the Reviewer
1. Going Shopping with Vue.js
- Vue.js history
- The most important thing about Vue.js
Let's go shopping!
- Implementing a shopping list using jQuery
- Implementing a shopping list using Vue.js
- Analyzing data binding using developer tools
- Bringing user input to the data with two-way binding
- Rendering the list of items using the v-for directive
- Check and uncheck shopping list items
- Adding new shopping list items using the v-on directive
- Using Vue.js in an existing project
- Vue.js 2.0!
- Projects using Vue.js
- Book roadmap
- Let's manage time!
2. Fundamentals – Installing and Using
- MVVM architectural pattern
- DefineProperty, getters, and setters
- Comparing with other frameworks
- Vue.js fundamentals
- Installing, using, and debugging a Vue.js application
- Debugging your Vue application
- Scaffolding our applications
3. Components – Understanding and Using
- Revisiting components
- Benefits of using components
- Rewriting the shopping list with simple components
- Single-file components
- Rewriting our shopping list application with single-file components
- Rewriting the Pomodoro application with single-file components
- Reactive binding of CSS transitions
4. Reactivity – Binding Data to Your Application
- Revisiting data binding
- Interpolating data
- Using expressions and filters
Revisiting and applying directives
- Two-way binding using the v-model directive
- Two-way binding between components
- Binding attributes using the v-bind directive
- Conditional rendering using v-if and v-show directives
- Array iteration using the v-for directive
- Event listeners using the v-on directive
5. Vuex – Managing State in Your Application
- Parent-child components' communication, events, and brain teaser
- Why do we need a global state store?
- What is Vuex?
- How does the store work and what is so special about it?
- Greetings with store
- Installing and using the Vuex store in our applications
- Using the Vuex store in the shopping list application
- Using Vuex store in the Pomodoro application
6. Plugins – Building Your House with Your Own Bricks
- The nature of Vue plugins
- Using the vue-resource plugin in the shopping list application
- Creating and using a plugin in the Pomodoro application
7. Testing – Time to Test What We Have Done So Far!
- Why unit tests?
- Unit tests for Vue application
- Writing unit tests for the shopping list application
- Writing unit tests for our Pomodoro application
- What is end- to-end testing?
- Nightwatch for e2e
- Writing e2e tests for the Pomodoro application
8. Deploying – Time to Go Live!
- Software deployment
- Moving the application to the GitHub repository
- Setting continuous integration with Travis
- Deploying the Pomodoro application
- Deploying the shopping list application
9. What Is Next?
- The journey so far
- Vue 2.0
- Revisiting our applications
- Why is it just the beginning?
- A. Solutions to Exercises
- Title: Learning Vue.js 2
- Release date: December 2016
- Publisher(s): Packt Publishing
- ISBN: 9781786469946
You might also like
Vue.js 2 Design Patterns and Best Practices
Become an expert Vue developer by understanding the design patterns and component architecture of Vue.js to …
Head First Design Patterns, 2nd Edition
You know you don’t want to reinvent the wheel, so you look to design patterns—the lessons …
Vue.js 2 Cookbook
101 hands-on recipes that teach you how to build professional, structured web apps with Vue.js About …