▶Book Description
Do you want to make your web application amazingly responsive? Are you unhappy with your app's performance and looking forward to trying out ways to make your app more powerful? Then Vue.js, a framework for building user interfaces, is a great choice, and this book is the ideal way to put it through its paces.
This book's project-based approach will get you to build six stunning applications from scratch and gain valuable insights in Vue.js 2.5. You'll start by learning the basics of Vue.js and create your first web app using directives along with rich and attractive user experiences. You will learn about animations and interactivity by creating a browser-based game. Using the available tools and preprocessor, you will learn how to create multi-page apps with plugins. You will create highly efficient and performant functional components for your app. Next, you will create your own online store and optimize it. Finally, you will integrate Vue.js with the real-time Meteor library and create a dashboard showing real-time data.
By the end of this book you will have enough skills and will have worked through enough examples of real Vue.js projects to create interactive professional web applications with Vue.js 2.5.
▶What You Will Learn
- Set up a full Vue.js npm project with the webpack build tool and the official scaffolding tool, vue-cli
- Write automatically updated templates with directives to create a dynamic web application
- Structure the app with reusable and maintainable components
- Create delightful user experiences with animations
- Use build tools and preprocessors to make larger professional applications
- Create a multi-page application with the official Vue.js routing library
- Integrate non-Vue.js elements into your apps like Google Maps
- Use the official state-management library to prevent errors
- Optimize your app for SEO and performance with server-side rendering and internationalization
▶Key Features
- Build exciting real world web projects from scratch and become proficient with Vue.js Web Development
- Take your app to the next level with animation, routing, state management, server-side rendering and i18n
- Learn professional web programming techniques to supercharge your Vue.js projects
▶Who This Book Is For
If you are a web developer who now wants to create rich and interactive professional applications using Vue.js, then this book is for you. Prior knowledge of JavaScript is assumed. Familiarity with HTML, Node.js, and tools such as npm and webpack will be helpful, but not necessary.
▶What this book covers
- Chapter 1, Getting Started with Vue,covers how to create a basic Vue app with a dynamic template and basic interactivity, thanks to directives.
- Chapter 2, Project 1 - Markdown Notebook, explores the creation of a complete Vue app with features such as computed properties, methods, life cycle hooks, list displays, DOM events, dynamic CSS, template conditionals, and filter formatting.
- Chapter 3, Project 2 - Castle Duel Browser Game, explains the creation of a browser card game structured as a tree of reusable components that communicate with each other. It also features animations and dynamic SVG graphics.
- Chapter 4, Advanced Project Setup, focuses on how to use the official Vue command-line tool to bootstrap a full blown project with webpack, babel, and more build tools. It also covers the Single-File Component format, allowing readers to create components as building blocks.
- Chapter 5, Project 3 - Support Center, takes you through how to structure a multipage app with the official routing library--nested routes, dynamic parameters, navigation guards, and such. The project also features a custom user login system.
- Chapter 6, Project 4 - Geolocated Blog, walks through the creation of an app featuring Google OAuth login and the Google Maps API. This chapter also covers the important topic of state management using the official VueX library, plus fast functional components.
- Chapter 7, Project 5 - Online Shop and Scaling up, outlines advanced development techniques such as checking code quality with ESLint, unit testing Vue components with Jest, translating an app into multiple languages, and improving speed and SEO with server-side rendering.
- Chapter 8, Project 6 - Real-time Dashboard with Meteor, teaches you how to use Vue in a Meteor app in order to take advantage of the real-time capabilities of this full-stack framework.