Vue JS Training in Gandhinagar, 100% Job Guaranteed, Front end training

Vue JS training and classes is necessary for those who are new for front-end technology. Gandhinagar is the capital of Gujarat and also known for its clealiness and greenery. Gandhinagar is a small town where you will find most of government employees and inter state people too. So, if you are new in Gandhinagar and looking for the training in Vue JS, then Desire Infotech is the best institute. Because whole syllabus was designed by Industry experts. Call for vue js training on 9574180345

Saturday Weekend Call for Fees +91 9574180345

Monday Weekdays Call for Fees +91 9574180345

Vue JS Course Syllabus

1. Introduction to Vue.js

Learning Objective:

By the end of this module you will learn what kind of problems vue.js will solve and how to setup and run a vue app.
• What is Vue.js
• Why Vue.js
• Quick tour of Vue-cli
• Hello World with Vue.js
• Anatomy of Hello world vue app

Hands-on:

Create new vue app using vue cli, execute and debug.

2. Working with Template & viewmodel

Learning Objective:

By the end of this module you will learn about the templating syntax and its abilities.
• What is vue.js template
• What is viewmodel / vue instance?
• Template syntax
• Interpolation
• Directive
• Filters
• Shorthands
• Javascript expressions
• Computed properties
• Watchers
• Class and style bindings
• HTML classes
• Inline styles
• Conditional Rendering
• Iterative Rendering

Hands-on:

Create a vue app which explores the template syntax features like interpolation, directives, expressions, watchers, filters, computed properties, iterative & conditional rendering.

3.Vue Instance Revisited

Learning Objective:

By the end of this module you will gain deeper understanding about vue instance, lifecycle and data access from vue instance.
• Basic vue instance usage
• Multiple vue instances
• Vue instance Lifecycle
• Accessing data from outside vue instance
• Data and methods
• More about $el, $data and $refs

Hands-on:

Create a vue application that creates multiple vue instances, explore through the lifecycle methods and code data access from outside vue instance

4.Event handling

Learning Objective:

By the end of this module you will learn how to work with events in vue.
• Introduction
• Listening to events
• Method Event handlers
• Event modifiers
• Key modifiers

Hands-on:

Create a vue app that responds to events.

5.Working with forms & two way binding

Learning Objective:

By the end of this module you will learn how to develop forms and the power of 2 way binding.
• Introduction to two way binding via v-model
• Handling user input with HTML form controls
• Data binding
• .lazy, .number, .trim modifiers
• Submitting a form

Hands-on:

Create forms and apply two way binding to read and write data to forms.

6.Introduction to components

Learning Objective:

By the end of this module you learn about the significance of components and their power in reusability. You will also learn how to decompose a given web page into individual components and how to compose them to make them represent a page.
• What are components?
• Why components
• Hello World component
• Anatomy of a component
• Registering Components Locally and Globally
• Root Component
• Thinking in components
• Composing application as components

Hands-on:

Convert a single html web page into a series of components, register components and compose components into application.

7.Passing data to components

Learning Objective:

By the end of this module you will learn how to enable communication between components.
• Props, parent to child communication
• Custom events, child to parent
• Non parent child communication event emitter style using .emit, .on

Hands-on:

Create multiple components and enable communication between independent component props for parent to child communication, events for child to parent and non parent child components using event emitter.

8.Content distribution with slots

Learning Objective:

By the end of this module you will learn how to embed arbitrary content inside of child components.
• Compilation scope
• Single slot
• Named slot
• Scoped slot

Hands-on:

Create a reusable component which accepts arbitrary content using slots.

9.Dynamic components

Learning Objective:

By the end of this module you will learn how to switch between various arbitrary components at the same mount point using dynamic components.
• Switching Multiple Components with Dynamic Components
• Dynamic Component Behavior
• Keeping Dynamic Components Alive
• Lifecycle hooks

Hands-on:

Create a component with tabbed layout that switches components between tabs dynamically.

10.Custom directives

Learning Objective:

By the end of this module you will learn how to develop a custom directive beside the built in directives.
• Introduction
• Directive hook functions
• Developing custom directive
• Passing values and arguments to custom directives
• Directive hook arguments

Hands-on:

Create a custom directive that modifies the background colour of the element when the directive is applied.

11.Mixins

Learning Objective:

By the end of this module you will learn a flexible way to distribute reusable functionalities for Vue components using mixins.
• Introduction
• Creating and using mixins
• Option merging
• Global mixin

Hands-on:

Create a mixin and apply to components.

12.Filters

Learning Objective:

By the end of this module you will learn how to format data in vue template without altering the original value using filters.
• Introduction
• Local filters
• Global filters
• Chaining filters

Hands-on:

Create a component that uses default filters to format data in template, also chain multiple filters.

13.Remote communication with vuejs

Learning Objective:

By the end of this module you will learn how to consume remote apis in vue applications.
• Using vue-resource to working with HTTP
• Fetch data
• Post data to server
• Request Response Interception
• Template URLs

Hands-on:

Create components that fetch data from remote api and post data to remote api.

14.Routing

Learning Objective:

By the end of this module you will learn how to power vue application with routing. Also learn how to protect routes using guards.
• Introduction
• Setting up vue-router
• Loading routes
• Routing modes
• Navigation with router links
• Styling active links
• Imperative navigation
• Route Parameters
• Setting up child or nested routes
• Named routes
• Query parameters
• Named router views
• Wildcard routes
• Route guards

Hands-on:

Setup and configure vue-router, create navigation component and code declarative routing using router links, code imperative routing from component methods, configure route parameters and read them from inside component. Protect routes using guards.

15. State Management

Learning Objective:

By the end of this module you will learn how to take the advantage of state management, how to setup vue app with vuex.
• Introduction
• What is need for state management
• What is vuex
• Centralized store
• Understanding Getters
• Using Getters
• Mapping Getters to Properties

Hands-on:

Create a centralized store, getter & setters, actions

16.Understanding Mutations

Learning Objective:

By the end of this module you will learn how to apply mutation to change state in a Vuex store.
• Using Mutations
• Using Actions
• Mapping Actions to Methods

Hands-on:

Create mutations to change the data in the store

VueJs Training In Gandhinagar

About Us

We provide live project training in gandhinagar

Vue JS Training in Gandhinagar | Vuejs Course in Gandhinagar

Why Desire Infotech is the best Institute For Vue JS training or classes ?

Vue JS Course Syllabus

1. Introduction to Vue.js

Learning Objective:

Hands-on:

2. Working with Template & viewmodel

Learning Objective:

Hands-on:

3.Vue Instance Revisited

Learning Objective:

Hands-on:

4.Event handling

Learning Objective:

Hands-on:

5.Working with forms & two way binding

Learning Objective:

Hands-on:

6.Introduction to components

Learning Objective:

Hands-on:

7.Passing data to components

Learning Objective:

Hands-on:

8.Content distribution with slots

Learning Objective:

Hands-on:

9.Dynamic components

Learning Objective:

Hands-on:

10.Custom directives

Learning Objective:

Hands-on:

11.Mixins

Learning Objective:

Hands-on:

12.Filters

Learning Objective:

Hands-on:

13.Remote communication with vuejs

Learning Objective:

Hands-on:

14.Routing

Learning Objective:

Hands-on:

15. State Management

Learning Objective:

Hands-on:

16.Understanding Mutations

Learning Objective:

Hands-on:

DOWNLOAD FULL Vue JS TRAINING SYLLABUS

Get In Touch

Quick Links

Popular Links

Follow Us