DEV Community

Hands-on Vue.js for Beginners (Part 2)

Marina Mosti on February 01, 2019

Last time (in part 1 of this series) we figured out how to add Vue to our index.html with a regular <script> tag, and we managed to add our v...
Collapse
 
frfancha profile image
Fred

Really like it, I hope you will go through the full Vue features because if all is explained with the same quality that will be by far the best tutorial to Vue.

Collapse
 
marinamosti profile image
Marina Mosti

Hi Fred, thanks for your kind words. That's the plan, to do a weekly release and walk through every feature!

Collapse
 
superterrific profile image
Dana Byerly

Thank you, this helped me better understand a Vue app I cobbled together from examples! Really appreciate the clear explanation and dissection.

And, more excitingly, within minutes of reading this I was able to refactor the previously mentioned app to use a click event to call the method with an API call, replacing the window.location.reload(true) full page reload. Thanks again ⚡️👍🏼

Collapse
 
marinamosti profile image
Marina Mosti

Awesome Dana!!! Next week ill go into conditional rendering so stay tuned :)

Collapse
 
mikefromru profile image
Mike

Thank you so much for this acticle. Would be nice if you create tutorial that show how to use Django Rest Framework with Vue.js. I mean registration with confirmation an email, login, change a pass, login with Facebook, Google etc...

Collapse
 
imbhargavreddy profile image
Bhargav

Thank you very much for taking the effort to teach. These tutorials are amazing compared to video lectures. Learning from text tutorials is helping a lot. I hope you will take us to the core of Vue with the same(or >=) passion.

Collapse
 
akwetey profile image
Jonathan Akwetey

another great work.. waiting for more..👏👏👏

Collapse
 
marinamosti profile image
Marina Mosti

Thanks Jonathan! Comments like these keep me motivated :)

Collapse
 
4m3r profile image
Amer

Great also waiting for more. Thx

Collapse
 
marinamosti profile image
Marina Mosti

Thanks!

Collapse
 
abidemit profile image
Tiamiyu Sikiru Abidemi

Explanation on point, helped me understanding the basics better.

Collapse
 
marinamosti profile image
Marina Mosti

Thanks for your feedback :)

Collapse
 
straleb profile image
Strahinja Babić • Edited

Wow awesome article, makes me wanna do something with Vue again 😊

Collapse
 
marinamosti profile image
Marina Mosti

Do eeeeet! :D

Collapse
 
suryanarayana profile image
SURYA NARAYANA MURTHY

I like the articles on Vue that you have posted. Great tutorials parts. I am learning Vue and doing POC'S on it.

If possible can you post any articles on Vuex and Vue-Router with Vue.

Collapse
 
marinamosti profile image
Marina Mosti

Hey Surya, thanks for you words :) Keep posted on my twitter account @marinamosti , I post new articles there and will have a Vuex series up soon I hope!

Collapse
 
suryanarayana profile image
SURYA NARAYANA MURTHY

Thank you :)

Collapse
 
rodz profile image
Rodrigo Gomez

Nice follow up on the first tutorial. I like the explanations of what Vue is doing behind the scenes.

Collapse
 
juanicolas profile image
JuaNicolas

Thanks for the tutorial! Very well done!

Collapse
 
marinamosti profile image
Marina Mosti

Thanks Nicolas, glad you enjoyed it :)

Collapse
 
pravinkumar95 profile image
Pravin kumar

Keep up Marina. well, this is really easy

Collapse
 
kabircse profile image
Kabir Hossain

Wow awesome article keep it continue

Collapse
 
marinamosti profile image
Marina Mosti

Thanks!

Collapse
 
aniketnaik321 profile image
aniketnaik321

Is it possible in Vue.js to put event handling code just in one place(in js file), like we do in jquery.

$("#btnSubmit").click(function(e){
alert("example");
});

Collapse
 
marinamosti profile image
Marina Mosti

Hi Aniketnaik, well... In Vue as you probably know by now, we declare the listeners directly on the template using @click or @event and pass in the name of a method. It is possible to attach listeners using vanilla javascript by doing element.addEventListener and passing a function, but it depends on what you're trying to accomplish. Good luck