Vue.js for Web Designers

  • 0
  • 1-2 hours worth of material
  • LinkedIn Learning
  • English
Vue.js for Web Designers

Course Overview

Add Vue.js to your web design toolbox. Learn how to use Vue in three real-world example projects: a product customizer, a directory, and a status board app.

Course Circullum

Introduction
  • Get started with the popular Vue JavaScript framework
  • What you should know
  • Working with the exercise files
1. Introducing Vue
  • What is Vue and what is it good for?
  • Vue concepts and jargon
  • Vue tools
  • Installing the Vue devtools
2. First Project: Customizer
  • Installing Vue on an existing site
  • Creating an instance from the mock-up
  • Identifying components and data
  • Adding data to our component
  • Using a model to begin interactivity
  • Using v-bind to update classes
  • Simple templates with computed properties
  • Listen for an event with v-on
  • Shorthand notation for faster writing
  • Challenge: Activate the color selector
  • Solution: Activate the color selector
3. Second Project: Directory Browser
  • Make a plan
  • Scaffold initial components
  • Pass component data with props
  • Build the filters form
  • Wire up the filters form
  • Respond to filter form updates
  • Handle custom filter event
  • Animating with transition-group
  • Challenge: Better usability and animation
  • Solution: Better usability and animation
4. Third Project: Status Updater
  • Incorporating live data via REST APIs
  • Inspecting our starting code
  • First API call in a life cycle method
  • Adding a loader animation with v-if
  • Hooking up the form to post an update
  • Updating message list after posting
  • Adding a third-party Vue component
Conclusion
  • Next steps
out of 5.0
5 Star 85%
4 Star 75%
3 Star 53%
1 Star 20%

Item Reviews - 3

Submit Reviews

Free Trial Available

This Course Include:
Introduction
  • Get started with the popular Vue JavaScript framework
  • What you should know
  • Working with the exercise files
1. Introducing Vue
  • What is Vue and what is it good for?
  • Vue concepts and jargon
  • Vue tools
  • Installing the Vue devtools
2. First Project: Customizer
  • Installing Vue on an existing site
  • Creating an instance from the mock-up
  • Identifying components and data
  • Adding data to our component
  • Using a model to begin interactivity
  • Using v-bind to update classes
  • Simple templates with computed properties
  • Listen for an event with v-on
  • Shorthand notation for faster writing
  • Challenge: Activate the color selector
  • Solution: Activate the color selector
3. Second Project: Directory Browser
  • Make a plan
  • Scaffold initial components
  • Pass component data with props
  • Build the filters form
  • Wire up the filters form
  • Respond to filter form updates
  • Handle custom filter event
  • Animating with transition-group
  • Challenge: Better usability and animation
  • Solution: Better usability and animation
4. Third Project: Status Updater
  • Incorporating live data via REST APIs
  • Inspecting our starting code
  • First API call in a life cycle method
  • Adding a loader animation with v-if
  • Hooking up the form to post an update
  • Updating message list after posting
  • Adding a third-party Vue component
Conclusion
  • Next steps
  • Provider:LinkedIn Learning
  • Certificate:Certificate Available
  • Language:English
  • Duration:1-2 hours worth of material
  • Language CC:

Do You Have Questions ?

We'll help you to grow your career and growth.
Contact Us Today