Cover image for Vue.js: Understanding its Tools and Ecosystem

Vue.js: Understanding its Tools and Ecosystem

Author Dave Berning
Release Date: 2018/11/01
ISBN: 9781939902597
Topic:
0%
14
Chapters
0-1
Hours read
0k
Total Words
    Start Reading Now    
       Add to Wishlist       
View table of contents

Book Description

With this book, you will get a crash course on the main Vue.js library to first understand it’s main concepts and syntax. Although prior Vue.js experience is not needed, it is recommended. This book covers all of the important tools and ecosystem, and these most of these tools have been created by the Core Team and some from its Community Partners. This book will also go over the main Vue.js library, as well as it’s first-party accompanying libraries: Vuex for state management and Vue Router for routing. In addition to those, the book will also get you acquainted with Community Partner frameworks like NativeScript for native mobile app development, and Nuxt.js for server-rendered applications. Other technologies covered (some of which were released this year) include: TypeScript, Vue DevTools, Vue CLI 3, and VuePress. With “Vue.js: Understanding It’s Tools and Ecosystem,” you will quickly learn Vue.js and the popular technologies that make up its every growing ecosystem. By the end of this book, you should be able to navigate and create enterprise level applications using Vue.js and it’s tools. So, get familiar here with one of the fastest growing frameworks and communities in the front-end world today!

Table of Contents

  1. Preface
    1. Another JavaScript Framework?
  2. 1. Getting Started with Vue.js
    1. Understanding the Virtual DOM
    2. Installing Vue.js
    3. Understanding the Vue Instance
      1. The Data Property
      2. The Methods Property
      3. The Computed Methods Property
      4. The Watch Property
      5. Lifecycle Methods
    4. Understanding Directives
      1. The v-for Directive
      2. The v-show Directive
      3. The v-if, v-else, v-else-if Directives
      4. The v-on Directive
      5. The v-bind Directive
    5. Event Handling
    6. Event Modifiers
    7. Key Modifiers
    8. Conclusion
  3. 2. Scaffolding Projects With Vue CLI 3
    1. Getting Started With Vue CLI 3
    2. A Quick Tour of the Generated Project
      1. The Directory Structure
    3. The Single File Vue Component
      1. Importing Child Components
      2. Props
      3. Slots
    4. Using Pre-Processors
    5. CSS Pre-Processors
      1. SASS/SCSS
      2. LESS
      3. Stylus
    6. HTML pre-processors
      1. PUG
    7. Modifying Webpack Configs Without Ejecting
    8. Using the Vue CLI GUI
    9. Conclusion
  4. 3. Navigation with Vue Router
    1. Using Vue Router with Plain JavaScript
    2. Using Vue Router Within a Module System (Webpack, Node, Vue CLI)
    3. Routing to Another Route
      1. Routing Using String Paths
      2. Routing Using Names and Parameters
      3. Routing with Named Views
      4. Using Aliases and Redirects
    4. History Mode and Server Configurations
      1. Apache
      2. Nginx
      3. Native Node.js
      4. Internet Information Services (IIS)
      5. Cady
      6. Firebase Hosting
      7. 404 Fallback
    5. Conclusion
  5. 4. State Management with Vuex
    1. Installing and Setting Up Vuex
    2. Adding and Reading Initial State Data
    3. Using Actions to Mutate the State
      1. The Actions, Mutations, and State Flow
      2. Actions
      3. Mutations
      4. Getters
    4. Mapping Store Properties with Helper Functions
      1. Mapping State With mapState
      2. Using Actions with mapActions
      3. Using Mutations with mapMutations
      4. Using Getters With mapGetters
    5. Putting It All Together
      1. Preliminary Set-Up
      2. Refactoring with mapActions and mapState
    6. Conclusion
  6. 5. Debugging With Vue DevTools
    1. Installing the Vue DevTools
    2. Navigating Through the DevTools
      1. The Components Pane
    3. The Vuex Pane
      1. Time Traveling
      2. Modifying a Component’s Data
    4. Integrating and Using the Vue.js DevTools Electron App
      1. Installing the DevTools Locally
    5. Conclusion
  7. 6. Server-Side Rendering with Nuxt.js
    1. How Does Server-Side Rendering Work?
    2. A Little About Nuxt.js
    3. Getting Started With Nuxt.js (Manual)
    4. Getting Started With the Starter Template (Recommended)
    5. Getting Started With “Create Nuxt App”
    6. The Directory Structure
    7. Creating Pages and Routes
      1. Creating Dynamic Pages and Routes
      2. Navigating Between Routes
    8. Layouts
      1. Assigning Layouts to a Page
      2. Creating an Error Layout
    9. Route Transitions
      1. Basic Usage
    10. Modifying the nuxt-config.js file
      1. Modifying the Loading Bar
    11. Adding Plugins
      1. Registering Your Own Global Components
    12. Adding Middleware
    13. Fetching Data With fetch() and asyncData()
    14. Nuxt Generate and Nuxt Build
    15. Conclusion
  8. 7. Static Site Generation with VuePress
    1. Installing VuePress
    2. Using Vue Components in Markdown Files
    3. Creating Page Layouts
    4. Routing in VuePress
    5. Using VuePress for Documentation
      1. Creating a Title and Navigation
      2. Creating the Sidebar
      3. Creating Translated Pages
    6. Conclusion
  9. 8. Mobile App Development with NativeScript for Vue.js
    1. Installation
      1. Prerequisites for macOS and Windows
      2. macOS Installation
      3. Windows Installation
    2. Getting Started with Playgrounds
    3. Differences Between Vue.js and NativeScript
    4. Playing With the Code
    5. Conclusion
  10. 9. Greater Control of JavaScript and Type Casting with TypeScript
    1. What Is TypeScript?
    2. Installation
    3. Type Casting with TypeScript
    4. Declaration Files
    5. Interfaces
    6. Classes
    7. Using TypeScript With Vue.js
      1. Basic TypeScript Usage
      2. TypeScript Usage in Components
      3. Using Class-Style Components With Decorators
    8. Conclusion
  11. 10. The Future of Vue.js and Adoption Rates
    1. More Companies Are Adopting Vue.js
    2. Conferences
    3. Podcasts
    4. Conclusion
3.128.79.88