Spoiler alert: this article is not a comparison to React.
Remember I often said, in my previous articles, that I don’t like long introductions? I just wrote one so excuse me. Let’s jump right into the core.
What is Vue.Js
According to Vue documentation itself, it is a progressive framework for building user interfaces. Unlike other monolithic frameworks, Vue is designed from the ground up to be incrementally adoptable. The core library is focused on the view layer only and is easy to pick up and integrate with other libraries or existing projects. On the other hand, Vue is also perfectly capable of powering sophisticated Single-Page Applications when used in combination with modern tooling and supporting libraries.
in my own words: Vue.js helps you make dynamic user interfaces for the web.
All the busy work is gone Bye-bye. Vue helps to avoid it, it has a lot of built-in solutions. It has effort in saving conventions like animations and management.
2. Developer’s best friend.
I was hesitating which one of the following three points to write first: documentation, graphical interface, or the CLI (command-line interface). Documentation won as I learned more from their documentation, so on that matter I installed the npm via CLI on my MacBookPro and it works like a charm.
Not to mention the fact that for a newbie like me, the way Vue is presenting the tools, which by the way there aren’t a lot to learn and it doesn’t need so much time to get familiar with, is tremendous.
I haven’t yet bumped into a real problem to ask the community’s help, I just started, so give some time, but as I’ve read in a LinkedIn community, they are pretty kind and helpful.
In just a few years Vue gained considerable popularity. Companies like Facebook, GitLab, Netflix, Adobe, Behance, Xiaomi, WizzAir, EuroNews and even Grammarly (which I use to correct my typos) are using Vue in their code base, so it’s a good starting point for it to increase chances of being hired.
This means that Vue can be used for Single Page Applications as well as to build small and interactive parts and to be integrated using different technology. It can be a full-featured framework that you used to build a whole project or it can be just a library in your project. Grammarly took advantage of it and built its signature interface while WizzAir built its amazing interface in its apps. One of the most outstanding platforms that get my attention is Adobe. If you want to build your portfolio on a Vue based platform, choose Adobe Portfolio, it’s amazingly fantastic. Okay, okay, I am sorry to be so excited but I can’t stop being impressed by the complexity and at the same time simplicity of Vue.
In terms of learning Vue, I find this list of prerequisites so that someone out there could learn Vue.
- Have an overall understanding of how code is executed in JS (execution context, stack, event looping, hoisting).
- How scopes work.
- Operator precedence and associativity.
- How “this” keyword behavior in different environments.
- What are closures
- Prototypical inheritance.
- Function constructors and the “new” keyword
- User Inputs
- Event Handling
Create a web page with a simple form, say, three inputs and a submit button
If the form is invalid, show an error message and prevent submission
This simple task requires you to know the basics of UI programming:
– DOM querying
– DOM manipulation
– Event handling
After that I was good to go.
If you can do this, you know enough to get started with Vue. If you can’t, work on this first, as Vue won’t be helpful so much, not just yet.
Conclusion and a brief recap:
Just before I live you, I would like you to have a few links that helped me:
Grammarly (free and paid versions) = I use on a daily basis when it comes to correct the typos, and it’s using Vue (yes I know I said that before 🙂
Adobe Portfolio (free) = I like it a lot and it looks very clean for a portfolio for free, if you’d like it:
Vue course (paid) by Maximilian Schwarzmüller I am using currently and it’s amazingly easy to follow: https://www.udemy.com/course/vuejs-2-the-complete-guide.
Thank you for your time and until next week, happy coding.