Advanced features of Vue using Vuetify in 10 minutes

Spoiler alert: Project code base & Live Demo URL inside!

Vue.js Framework

Let’s get it straight. JavaScript Front-end frameworks are a gift to modern web developers.

  • They abstract away all the complexities of DOM manipulation & enable us to focus on the essentials.
  • They allow creation of reusable components. Components enable you to abstract away the complexities of a functionality (data & behaviour) — you can finally write modular code in HTML! Long live Shadow DOM!
  • They enable segregation of UI from the component behaviour. The HTML templates & the slot elements enable you to write markup templates that can be displayed dynamically at run-time using JavaScript.

Among these frameworks, Vue stands out with it’s simplicity, ease of implementation, essential libraries from the same ecosystem & outstanding documentation.

I have worked with Angular, React & Vue. From the strength of my experience, I believe you can go the fastest from Concept to Reality with Vue.

Motivation:

I have created a mini project to enable you to learn the following advanced features of Vue:

  • Routing with dynamic parameters
  • Creation of reusable components with properties
  • Interaction between two components through events, demonstrated through a Pizza delivery flow!

I have used Vuetify to build the UI fast & have kept the UI intentionally simple so that you get straight into the concepts.

A demo speaks a thousand words!

You can view the demo of these features live here. You can also access the GitHub repository of the code base here.

Please take a look & respond with your comments.

If you want me to showcase some additional features, please feel free to message me!

FundsCorner Engineering

On a mission to enable fast accessible credit to India’s…

Jeyabalaji Subramanian

Written by

Technology Leader. Writer. Obsessed with building usable products fast using cutting edge technologies. www.jeyabalaji.com

FundsCorner Engineering

On a mission to enable fast accessible credit to India’s Kirana Stores

Jeyabalaji Subramanian

Written by

Technology Leader. Writer. Obsessed with building usable products fast using cutting edge technologies. www.jeyabalaji.com

FundsCorner Engineering

On a mission to enable fast accessible credit to India’s Kirana Stores

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store