One of these developers is Marina Mosti: her book Building Forms with Vue.js is just the latest step in her career journey from a backend developer getting frustrated with Java to Vue.js evangelist and educator. She’s a great person to explain the attraction of Vue.js, and to provide an insight into how she first entered the community – luckily, I was able to chat with her.
Buy Building Forms with Vue.js on the Packt store.
Read the first chapter of the book for free on the Packt platform.
Laravel and Vue.js
Marina explains that she first encountered Vue while using Laravel. “We… wanted to take advantage of this built-in connection that Vue had with Laravel. Obviously this didn’t involve any fancy set up, there was no vue CLI, nothing of this good pre-compiling or anything, it was just injecting vue into the html and creating the components there on the fly”
However, discovering Vue in this way proved to be revelatory: it actually underlined what makes it, in Marina’s view, a great front end framework. “You don’t really have to commit to the whole framework,” she says; “it just got the job done for what I needed at that moment.”
What problems can Vue.js solve?
Marina has a pretty clear perspective on the challenges in front end development. “The problems we’re currently facing in front end development… is that people don’t want the old browsing experience where you’re clicking around and having to wait for reloads” she says. “We want to make applications… that are very performant, they have a great user experience, you are not waiting for page refreshes – it flows. What we are looking for is having your applications flow in a way that makes sense, like if you were using a desktop application.”
Vue is particularly good for this, Marina explains, because of its “reusable component structure.” To a certain extent, this way of working is just another example of the wider trend across engineering towards breaking things apart. “You are trying to make these small units of code, that do this specific thing… a very common way to describe it is like this lego system where you’re just putting pieces on top of each other and it just starts making sense.” I’ve heard that analogy before in relation to containers – there’s clearly a recurring theme that’s evolving out of core principles of design.
If Vue is well-suited to building lightweight but highly performant front ends, another important element is that it makes development relatively easy.
The Vue CLI
Tooling was also more complicated; something that the Vue CLI has helped to solve.“You had to deal with – at a very intricate level – how tools like Grunt worked, for example. And now you have like these pre-build tools like the Vue CLI which allow you to not have to really think about things,” she says. “You don’t have to think like ‘hey, how is this going to get compiled? How is webpack going to figure things out?’ At least not at an entry level because you have it all neatly packed in this box for you with the Vue CLI.”
Comparing Vue.js to React and Angular
Vue.js v. React
She notes that React and Vue have a lot in common. “They share a lot of similarities – both of them use a virtual DOM… they both have this reactive component structure.” However, the key difference, from Marina’s perspective, is JSX.
It’s JSX that puts Marina off React, saying that the way it requires you to work “doesn’t really click. I know how to do it, but just in the way I like to code things I prefer just having the separation where HTML is HTML, and where CSS is CSS.”
Want to learn React.js? Search the latest React eBooks and videos.
Vue.js v. Angular
Angular, meanwhile, is “great for enterprise projects where you need this huge huge framework” says Marina. “But that also comes at a cost of having to know all the framework. All the libraries, everything that Angular brings to the table, you have to know TypeScript – it’s just very opinionated at what it does and sometimes the shoe is going to be very big for the project.”
So, for Marina, Vue has a degree of flexibility. It’s not as opinionated as Angular, and it doesn’t require you to write using JSX. “It can grow up until the point you need it to… From the smallest component in your application to powering full enterprise solutions.”
And related to this, it means Vue is accessible – the learning curve isn’t that steep. “Vue is just very gentle in that you can start using it; you can start building things right away.”
“There’s a very good pay off in making yourself an expert in it… once you start getting into the core of Vue, and understanding all the little tools that are at your disposal… you can start building upon this knowledge… the framework can grow and adjust to what you’re needing.”
Search the latest Angular eBooks and videos.
The Vue.js community
There are undoubtedly many technical reasons to consider using Vue. However, another aspect that Marina emphasises throughout our conversation is how welcoming and supportive the Vue community is. “The Vue community is one of the biggest selling points of why you should pick Vue and why Vue is so amazing.”
The Vue community was, Marina says, integral in getting her to where she is now. “I was, at one point, not very into vue… and I just found a very welcoming community and a very inclusive community… People in the community care about other developers that are getting into Vue. We try our best to make this feel like a very safe, inclusive community to just get people in here and get them developing vue and help them out with the problems they’re having.”
Marina deserves credit for playing a part in fostering a welcoming and supportive culture. Not only has she created a wealth of learning materials (such as a great free introductory tutorial series), she also works closely with Vue Vixens, and provides mentoring and support for other women finding their way in the industry.
“This focus on education just basically became my goal… Hey, let’s do things to teach people, to get more people involved with vue,” she says. In an industry that’s sometimes defined by hyper-competitiveness, and marred by toxicity, it’s certainly a worthwhile and important goal. It’s something we can all work at.
Follow Marina Mosti on Twitter: @MarinaMosti
Follow Vue Vixens on Twitter: @VueVixens