Image for post
Image for post

Vue.js Component Style Guide

How to write good and reusable Components in Vue.js

tl;dr;

Check this Github out

Due the lack of a good Style Guide for developing Vue.js Components, I decided to create one document that will help those who are entering the Vue.js world.

The purpose was to put together some theory about components, good practices that only those who read the documentation and follow Vue.js on groups like Gitter and Slack know and a pinch of personal experience in a single document and make it available to everyone.

The guide provides a uniform way to structure your Vue.js code, making it:

  • easier for developers/team members to understand and find things.
  • easier for IDEs to interpret the code and provide assistance.
  • easier to (re)use build tools you already use.
  • easier to cache and serve bundles of code separately.

I tried to write it as simple as possible. I based it on a document written by De Voorhoede who had the same style guiding goal. The table of content is:

You can check it out clicking right here.

Liked it? Hated it? Want to add something?

Please, feel free to create an issue or even forking it and Pull Requesting your changes. It will be a pleasure to have a Vue.js Style Guide with your help.


Thank you Rory Dent !

tldr tech

too long; didn’t read

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