10 Best Tips for Learning Vue from Vue Masters 🏔

Gregg Pollack
Jan 9, 2019 · 6 min read
Image for post
Image for post

If you’re a developer who is just starting out with Vue.js, jumping in can be both exciting and overwhelming. While everybody’s learning process is very different, I asked six Vue Masters the following question:

What advice would you give developers who are just starting Vue.js that you wish you would have known?”

Ben Hong

Ben is a Full Stack Engineer at GitLab and co-founder of VueDC / VueMeetups.

Image for post
Image for post
He also might be a wizard

For those that are just starting Vue.js, there are three things I wish I would have known when I started:

2. There is an actual style guide for Vue applications. While Vue is great at letting you choose what’s best for you, there will be times when you wonder what the Vue community recommends. Well lucky for you, the style guide has categorized different practices according to how important each one is. Just another way they let you choose what’s best for you. And if you really need some structure, check out Chris Fritz’s enterprise boilerplate on some best practices that are ready for you to use in your own projects!

3. And at the end of the day, the community is here for you. The Vue community is an incredibly warm and welcoming one, so in addition to getting help, you’ll find that initiatives like the VueVixens and others help create a nurturing environment that make the experience all the more enjoyable.

🐦Ben’s Twitter | ✍️ Ben’s Blog

Filipa Lacerda

Filipa is a Senior Front-End Engineer & Vue.js enthusiast.

Image for post
Image for post

Filipa’s recommendation for getting started:

Vue.js is a powerful tool, you can end up with an amazing and easy to debug and maintain an application, but it’s also very easy to get yourself into a nested tree of components that you can’t easily maintain.

I’d say the main thing I wish I have known, is that for any medium size application, you should consider using a good state management tool (like Vuex) from the beginning. Or consider using Nuxt if you are starting an application from scratch, which already has a lot of these things figured out for you.

🐦Filipa’s Twitter

Hassan Djiredeh

Hassan is a front-end developer for Shopify & author of FullStack Vue.

Image for post
Image for post

Hassan’s recommendation for getting started:

As long as the developer gets a little comfortable with the core library, they can start adding the other tools sooner than later since they all work together incredibly well.

Back when I began working with Vue, I initially put off from using the other tools due to fear of making my apps more complicated but that fear is definitely not justified :).

🐦Hassan’s Twitter |✍ Hassan’s Blog

Damian Dulisz

Damian is a Vue.js Core Team Member and author of Vue-multiselect.

Image for post
Image for post

Damian’s recommendation for getting started:

🐦Damian’s Twitter |😸 Damian’s Github

Lachlan Miller

Lachlan writes about frontend, Vue.js, TDD and blockchain.

Image for post
Image for post

Lachlan’s recommendation for getting started:

props: {
myProp: {
type: String,
required: true
}
}

Instead of

props: ['myProp']

Was not obvious to me at first, and made my early Vue.js applications very difficult to understand.

I’d also advocate having a thorough understanding of the one way data flow model Vue and React present, and being aware of Vuex and Vue Router as soon as possible — not necessarily using them, but understand what they do and know when you need to add them to your project. If you are working with Vue, you will encounter both Vuex and VueRouter sooner or later, so you should understand what they do and why they are useful.

Another piece of advice I give any upcoming developers, Vue.js or not, is to have a testing mentality. You don’t need to write tests when you building a prototype, but once you are happy with your code, make sure you have at least some simple tests before you commit to master — I can’t count the amount of times tests have stopped me from breaking core functionality. `vue-test-utils` and Jest make this very easy. One of the reasons Vue has so few bugs and regressions is because of its solid test suite.

Lastly, I’d recommend trying out lots of different “styles” of Vue. You can use Vue as a script tag from a CDN, using something like Vue CLI 3 to build a full SPA, or in a similar style to jQuery to make a regular server side page a bit more dynamic. There is no “correct” way to use Vue.

Lachlan’s Medium

Chris Fritz

Chris is a Vue core team member who is most well known for his work writing and curating Vue’s documentation.

Image for post
Image for post

Chris’s recommendation for getting started:

🐦Chris’s Twitter

Getting started is half of the work when it comes to approaching something new! Hopefully, with the help of these Vue Masters, you have gathered what you’ll need to start your road to Vue Mastery!

If you have any additional tips to becoming a Vue Master, I’d love to hear them. Feel free to comment here and join our Facebook group (Vue Mastery Group) to share! 🏔

My recommendation on getting started?

It probably won’t surprise you when I recommend learning with Adam Jahr and me at Vue Mastery. Our courses give you all the basics.

Vue Mastery

The ultimate learning resource for Vue.js Developers

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