Leanpub Header

Skip to main content

The Majesty of Vue.js 2

Learn Vue.js 2 from scratch!

This book will guide you through the path of the rapidly spreading Javascript Framework Vue.js!

By the end of this book, you will be able to create fast front end applications and increase the performance of your existing projects with Vue.js 2 integration.

Follow us on Twitter to get our latest news.

Minimum price

$24.90

$31.90

You pay

$31.90

Authors earn

$25.52
$

...Or Buy With Credits!

You can get credits monthly with a Reader Membership
PDF
EPUB
WEB
2,629
Readers
290
Pages
About

About

About the Book

TL;DR: This title is the updated version of The Majesty of Vue.js, which sold over 700 copies, and was considered one of the first and top learning resources for the Vue.js framework. The book will be constantly updated to keep up with Vue.js 2 changes and new chapters will be added for a long time.

This book is addressed to anyone interested in learning Vue.js. It is useful for developers who are new to Vue.js as well as those who already use Vue.js and want to expand their knowledge. It is also helpful for developers who are looking to migrate to Vue.js 2.

A percentage (20%) of book earnings will be donated to Evan You to support the excellent work he's doing with the Vue framework.

If you are looking for more advanced topics like Vuex, Firebase, etc, check out Vue School.

This book will guide you through the path of the rapidly spreading Javascript Framework called Vue.js!

Some time ago, we started a new project based on Laravel and Vue.js. After thoroughly reading Vue.js' guide and a few tutorials, we discovered a lack of resources about Vue.js around the web. During the development of our project, we gained a lot of experience, so we came up with the idea to write this book in order to share our acquired knowledge with the world. Now that Vue.js 2 is out we decided it was time to update our book by publishing a second version where all examples and their relative contents are rewritten.

The book is written in an informal, intuitive, and easy-to-follow format, wherein all examples are appropriately detailed enough to provide adequate guidance to everyone. We’ll start with the very basics and through many examples, we’ll cover the most significant features of Vue.js 2.

The best way to learn code is to write code, so we have prepared one exercise at the end of most chapters for you to solve and actually test yourself on what you have learned. We have also updated the exercises and solutions for Vue 2, and strongly recommend you to try as much as possible to solve them in order to gain a better understanding of Vue.js.

By the end of this book, you will be able to create fast front end applications and increase the performance of your existing projects with Vue.js integration. 

Who is this book for

Everyone who has spent time to learn modern web development has seen Bootstrap, Javascript, and many Javascript frameworks.

This book is for anyone interested in learning a lightweight and simple Javascript framework.

No excessive knowledge is required, though it would be good to be familiar with HTML and Javascript. If you don't know what the difference is between a string and an object, maybe you need to do some digging first.

This book is also useful for any reader who already know their way around Vue.js and want to expand their knowledge.

Share this book

Author

About the Authors

Alex Kyriakidis

Alex Kyriakidis is an ambitious, award winner developer, software engineer perfectionist and currently addicted to Laravel and Vue.js. He has worked with several teams delivering high quality cross-platform applications, APIs and websites.

Alex spends his time learning cutting edge technologies every day, striving to make the best developer out of himself.

Evan You

Translations

Translations

Contents

Table of Contents

Introduction

About Vue.js

  1. Vue.js Overview
  2. What people say about Vue.js
  3. Comparison with Other Frameworks
  4. Angular 1
  5. Angular 2
  6. React
  7. Ember
  8. Polymer
  9. Riot

Welcome

  1. About the Book
  2. Who is this Book for
  3. Get In Touch
  4. Homework
  5. Sample Code
  6. Errata
  7. Conventions
  8. This is a Warning
  9. This is a Tip
  10. This is an Information box
  11. This is a Note
  12. This is a Hint
  13. This is a Terminal Command
  14. This is a Comparison text
  15. This is a link to Github.
  16. IVue.js Fundamentals

1.Install Vue.js

  1. 1.1Standalone Version
  2. 1.1.1Download from vuejs.org
  3. 1.1.2Include from CDN
  4. 1.2Download using NPM
  5. 1.3Download using Bower

2.Getting Started

  1. 2.1Hello World
  2. Info
  3. 2.2Two-way Binding
  4. 2.3Comparison with jQuery.
  5. Code Examples
  6. 2.4Homework
  7. Note
  8. Potential Solution

3.A Flavor of Directives.

  1. 3.1v-show
  2. Info
  3. Info
  4. 3.2v-if
  5. 3.2.1Template v-if
  6. Warning
  7. 3.3v-else
  8. Warning
  9. 3.4v-if vs. v-show
  10. Code Examples
  11. 3.5Homework
  12. Hint
  13. Potential Solution

4.List Rendering

  1. 4.1Install & Use Bootstrap
  2. Info
  3. Tip
  4. 4.2v-for
  5. Warning
  6. 4.2.1Range v-for
  7. Note
  8. 4.3Array Rendering
  9. 4.3.1Loop Through an Array
  10. Info
  11. 4.3.2Loop Through an Array of Objects
  12. 4.4Object v-for
  13. Info
  14. Code Examples
  15. 4.5Homework
  16. Potential Solution

5.Interactivity

  1. 5.1Event Handling
  2. Info
  3. 5.1.1Handling Events Inline
  4. 5.1.2Handling Events using Methods
  5. Warning
  6. 5.1.3Shorthand for v-on
  7. 5.2Event Modifiers
  8. Note
  9. 5.3Key Modifiers
  10. Tip
  11. 5.4Computed Properties
  12. Note
  13. Code Examples
  14. 5.5Homework
  15. Hint
  16. Potential Solution

6.Filters

  1. 6.1Filtered Results
  2. Info
  3. Info
  4. Note
  5. 6.1.1Using Computed Properties
  6. 6.2Ordered Results
  7. 6.3Custom Filters
  8. 6.4Utility Libraries
  9. Syntax
  10. Tip
  11. Code Examples
  12. 6.5Homework
  13. Hint
  14. Potential Solution

7.Components

  1. 7.1What are Components?
  2. 7.2Using Components
  3. Note
  4. 7.3Templates
  5. Info
  6. 7.4Properties
  7. Warning
  8. Info
  9. 7.5Reusability
  10. Info
  11. Note
  12. Tip
  13. Warning
  14. 7.6Altogether
  15. Code Examples
  16. 7.7Homework
  17. Potential Solution

8.Custom Events

  1. 8.1Emit and Listen
  2. 8.1.1Lifecycle Hooks
  3. 8.2Parent-Child Communication
  4. 8.3Passing Arguments
  5. Info
  6. 8.4Non Parent-Child Communication
  7. Warning
  8. 8.5Removing Event Listeners
  9. 8.6Back to stories
  10. Info
  11. Code Examples
  12. 8.7Homework
  13. Hint
  14. Hint
  15. Potential Solution

9.Class and Style Bindings

  1. 9.1Class binding
  2. 9.1.1Object Syntax
  3. Info
  4. 9.1.2Array Syntax
  5. Info
  6. Tip
  7. 9.2Style binding
  8. 9.2.1Object Syntax
  9. 9.2.2Array Syntax
  10. Info for Intermediates
  11. 9.3Bindings in Action
  12. Code Examples
  13. 9.4Homework
  14. Hint
  15. Potential Solution
  16. IIConsuming an API

10.Preface

  1. 10.1CRUD
  2. 10.2API
  3. 10.2.1Download Book’s Code
  4. Note
  5. 10.2.2API Endpoints
  6. Tip

11.Working with real data

  1. Info
  2. 11.1Get Data Asynchronous
  3. Info
  4. Warning
  5. Warning
  6. 11.2Refactoring
  7. 11.3Update Data
  8. 11.4Delete Data

12.HTTP Clients

  1. 12.1Introduction
  2. 12.2Vue-resource
  3. Info
  4. 12.3Axios
  5. Tip
  6. 12.4Integrating axios
  7. Info
  8. 12.5Enhancing Functionality
  9. 12.5.1Edit Stories
  10. Info
  11. 12.5.2Create New Stories
  12. Info
  13. Tip
  14. 12.5.3Store & Update Unit
  15. Tip
  16. 12.6JavaScript File
  17. 12.7Source Code
  18. Code Examples
  19. 12.8Homework
  20. 12.8.1Preface
  21. 12.8.2API Endpoints
  22. 12.8.3Your Code
  23. Potential Solution

13.Pagination

  1. Info
  2. 13.1Implementation
  3. 13.2Pagination Links
  4. Code Examples
  5. 13.3Homework
  6. IIIBuilding Large-Scale Applications

14.ECMAScript 6

  1. Info
  2. 14.1Introduction
  3. 14.1.1Compatibility
  4. Note
  5. 14.2Variable Declarations
  6. 14.2.1Let Declarations
  7. 14.2.2Constant Declarations
  8. Info
  9. 14.3Arrow Functions
  10. 14.4Modules
  11. 14.5Classes
  12. 14.6Default Parameter Values
  13. 14.7Template literals

15.Advanced Workflow

  1. 15.1Compiling ES6 with Babel
  2. Info
  3. 15.1.1Installation
  4. What is package.json?
  5. 15.1.2Configuration
  6. Tip
  7. 15.1.3Build alias
  8. 15.1.4Usage
  9. Info
  10. 15.1.5Homework
  11. Hint
  12. Hint 2
  13. Potential Solution
  14. 15.2Workflow Automation with Gulp
  15. 15.2.1Task Runners
  16. Why use a task runner?
  17. Gulp vs Grunt
  18. 15.2.2Installation
  19. 15.2.3Usage
  20. 15.2.4Watch
  21. 15.2.5Homework
  22. Note
  23. Potential Solution
  24. 15.3Module Bundling with Webpack
  25. 15.3.1Module Bundlers
  26. 15.3.2Webpack
  27. 15.3.3Installation
  28. Tip
  29. 15.3.4Usage
  30. 15.3.5Automation
  31. Further Learning
  32. 15.4Summary
  33. Note

16.Working with Single File Components

  1. 16.1The vue-cli
  2. Info
  3. 16.1.1Vue’s Templates
  4. 16.1.2Installation
  5. 16.1.3Usage
  6. Tip
  7. Info
  8. Standard vs Airbnb
  9. Info
  10. 16.2Webpack Template
  11. Warning
  12. Note
  13. 16.2.1Project Structure
  14. 16.2.2index.html
  15. 16.2.3Hello.vue
  16. Warning
  17. 16.2.4App.vue
  18. 16.2.5main.js
  19. Note
  20. Info
  21. 16.3Forming .vue Files
  22. Note
  23. 16.3.1Nested Components
  24. Note
  25. Code Examples

17.Eliminating Duplicate State

  1. 17.1Sharing with Properties
  2. 17.2Global Store
  3. Warning
  4. Code Examples

18.Swapping Components

  1. 18.1Dynamic Components
  2. 18.1.1The is special attribute
  3. 18.1.2Navigation
  4. Code Examples

19.Vue Router

  1. Info
  2. 19.1Installation
  3. 19.2Usage
  4. Info
  5. Tip
  6. Note
  7. 19.3Named Routes
  8. 19.4History mode
  9. Info
  10. 19.5Nested routes
  11. 19.6Auto-CSS active class
  12. 19.6.1Custom Active Class
  13. 19.7Route Object
  14. 19.8Dynamic Segments
  15. Info
  16. Note
  17. Note
  18. 19.9Route Alias
  19. 19.10Programmatic Navigation
  20. Warning
  21. 19.11Transitions
  22. 19.11.1Introduction
  23. 19.11.2Usage
  24. 19.11.33rd-party CSS animations
  25. 19.12Navigation Guards
  26. Code Examples
  27. 19.13Homework
  28. Info
  29. Hint 1
  30. Hint 2

20.Closing Thoughts

  1. Don’t be a stranger!

21.Further Learning

  1. 21.1Tutorials
  2. 21.2Videos
  3. 21.3Books
  4. 21.4Open source projects
  5. 21.5Awesome Vue

Contributor

About the Contributors

Eugenia Papoulia

Eugenia is an English teacher. She works as a translator and her main field is literature. However, she is challenged by all kinds of books. In her free time she likes to make subtitles for TV-series.

Get the free sample chapters

Click the buttons to get the free sample in PDF or EPUB, or read the sample online here

The Leanpub 60 Day 100% Happiness Guarantee

Within 60 days of purchase you can get a 100% refund on any Leanpub purchase, in two clicks.

Now, this is technically risky for us, since you'll have the book or course files either way. But we're so confident in our products and services, and in our authors and readers, that we're happy to offer a full money back guarantee for everything we sell.

You can only find out how good something is by trying it, and because of our 100% money back guarantee there's literally no risk to do so!

So, there's no reason not to click the Add to Cart button, is there?

See full terms...

Earn $8 on a $10 Purchase, and $16 on a $20 Purchase

We pay 80% royalties on purchases of $7.99 or more, and 80% royalties minus a 50 cent flat fee on purchases between $0.99 and $7.98. You earn $8 on a $10 sale, and $16 on a $20 sale. So, if we sell 5000 non-refunded copies of your book for $20, you'll earn $80,000.

(Yes, some authors have already earned much more than that on Leanpub.)

In fact, authors have earned over $14 million writing, publishing and selling on Leanpub.

Learn more about writing on Leanpub

Free Updates. DRM Free.

If you buy a Leanpub book, you get free updates for as long as the author updates the book! Many authors use Leanpub to publish their books in-progress, while they are writing them. All readers get free updates, regardless of when they bought the book or how much they paid (including free).

Most Leanpub books are available in PDF (for computers) and EPUB (for phones, tablets and Kindle). The formats that a book includes are shown at the top right corner of this page.

Finally, Leanpub books don't have any DRM copy-protection nonsense, so you can easily read them on any supported device.

Learn more about Leanpub's ebook formats and where to read them

Write and Publish on Leanpub

You can use Leanpub to easily write, publish and sell in-progress and completed ebooks and online courses!

Leanpub is a powerful platform for serious authors, combining a simple, elegant writing and publishing workflow with a store focused on selling in-progress ebooks.

Leanpub is a magical typewriter for authors: just write in plain text, and to publish your ebook, just click a button. (Or, if you are producing your ebook your own way, you can even upload your own PDF and/or EPUB files and then publish with one click!) It really is that easy.

Learn more about writing on Leanpub