Vue.js for Beginners : A Step-by-Step Guide to Building Web Apps

✍ Scribed by Robert Lee.

• Year: 2023
• Tongue: English
• Leaves: 191
• Category: Library

✦ Synopsis

Vue.js is a progressive front-end framework for building modern web applications. In this book, you'll learn how to use Vue.js to build fast, responsive, and scalable web applications. You'll start with the basics, learning how to create components, manage state, and work with templates. From there, you'll explore more advanced concepts, such as routing, event handling, and testing. Throughout the book, you'll work on a real-world project, building a complete application from start to finish.

The book also covers best practices and tips for building high-quality Vue.js applications. You'll learn how to optimize performance, manage dependencies, and use third-party libraries. Additionally, you'll get hands-on experience with popular tools and technologies that work well with Vue.js, such as Vuex, Vue Router, and Axios.

Whether you're new to front-end development or an experienced developer looking to add Vue.js to your skill set, this book will provide you with the knowledge and skills you need to build modern, responsive web applications. With clear explanations, practical examples, and a step-by-step approach, this book is the perfect resource for anyone looking to master Vue.js

✦ Table of Contents

Foreword

introduction

I - Your first Vue.js Web Application

Building UpVote in Vue.js

Development environment setup

JavaScript ES6/ES7

Setting up the view

Making the view data-driven in Vue.js

List rendering in Vue.js

Sorting in Vue.js

Event handling (our app’s first interaction) nents

Components in Vue.js

v-bind and v-on shorthand syntax in Vue.js

II - Single-file components

Setting up our development environment in Vue.js

Getting started in Vue.js

Single-File Components in Vue.js

Breaking the app into components in Vue.js

Managing data between components in Vue.js

Simple State Management in Vue.js

Steps to building Vue apps from scratch in Vue.js

Step 1: A static version of the app

Step 2: Breaking the app into components

Step 3: Hardcode Initial States

Step 4: Create state mutations (and corresponding component actions)

III - Custom Events

JavaScript Custom Events

Vue Custom Events

Event Bus in Vue.js

Custom events and managing data in Vue.js

IV - Introduction to Vuex

What is Flux?

Flux implementations

Vuex

Refactoring the note-taking app in Vue.js

Vuex Store in Vue.js

Building the components in Vue.js

V - Vuex and Servers

Preparation in Vue.js

The Server API in Vue.js

Playing with the API in Vue.js

Client and server in Vue.js

The Vuex Store in Vue.js

productModule in Vue.js

cartModule in Vue.js

Interactivity in Vue.js

VI - Form Handling

Forms 101 in Vue.js

The Basic Button in Vue.js

Text Input in Vue.js

Multiple Fields in Vue.js

Validations in Vue.js

Form Modules in Vue.js

VII - Routing in Vue.js

What is routing? in Vue.js

URL in Vue.js

Single-page applications in Vue.js

Basic Vue Router in Vue.js

Dynamic Route Matching in Vue.js

The Server API in Vue.js

Starting point of the app in Vue.js

Integrating vue-router in Vue.js

Supporting authenticated routes in Vue.js

Implementing login in Vue.js

Vue Watchers in Vue.js

Navigation Guards in Vue.js

Recap and further reading in Vue.js

VIII - Unit Testing

End-to-end vs. Unit Testing in Vue.js

Testing tools in Vue.js

Testing a basic Vue component

Setup

vue-test-utils