Why I Picked Vue.js as My Freelancer Niche
I have professional experience with the three big players in web development: Angular, Vue.js and React. I've reached the point in my career where I need to choose one of the three frameworks/libraries that I will use for my future freelancing career.
As the title already reveals, I chose Vue and in this article, I will describe to you why I picked it instead of React or Angular.
Finding your niche as a freelancer can have an extremely positive impact on your career. It took me some time to find mine, but finally, I found it and I can take my business to the next level. It has some advantages to be a jack of all but in the end, it's even better to be the master of one trade. Having a niche can boost your income, helps to find new projects easier, and is useful to advertise yourself as an expert.
I can also give you an example of how the niche saves me time every day:
My previous search queries for job agents on freelancer platforms looked like this:
With a niche in place, I modified these search queries to
Vue and now the job agent emails contain only a few freelancer projects but they are tailored to my skills.
When I started freelancing back in 2019 my tech focus was on web development using the Angular framework. But for my first freelancing project I choose a Vue.js project and I stayed there for about two years. I chose this project because I already had professional experience with Angular and some experience with React as I used it for my portfolio website and two React Native apps that I developed and published. I wanted to see how it compares to Angular and React. After this project, beginning from January to September 2021 I worked in a React project as I wanted to gain some professional experience with the library.
I could easily further specialize in Angular, but I have no good belly feeling with this choice. Therefore, I had to choose between React and Vue.
TL;DR: In my opinion, Vue.js combines the best parts of Angular and React. Vue.js is a more flexible, less opinionated solution than Angular but it's still a framework and not a UI library like React.
this. I don't like this and thankfully we can write React and Vue components without the
this keyword by using React Hooks and Vue 3's Composition API.
The official Vue documentation is amazing and one of the best resources to learn Vue.
In its early development phase, Vue took inspiration from the good things of AngularJS (the first version of Angular). Vue also got inspired by React and they share some similarities:
- They have their focus in the core library. Concerns like global state management and routing are handled by separate companion libraries.
- Both provide reactive and composable view components.
- One and the other use a virtual DOM.
In Vue, I need to care less about optimization efforts in comparison to React. React triggers a re-rendering of the entire component tree when a component's state changes. Read my article "Debug Why React (Re-)Renders a Component" for further details.
There are multiple ways to avoid unnecessary re-rendering of child components in React:
- use PureComponent
shouldComponentUpdateif you are using class components
- use immutable data structures
Angular developers also need to take care of the change detection, you can read my article "The Last Guide For Angular Change Detection You'll Ever Need" if you want to deep-dive into that mechanism.
Vue automatically tracks a component's dependencies during its render. Therefore, it knows precisely which components need to be re-rendered when the state changes. As a Vue developer, I can more focus on building the app than on performance optimizations.
Vue uses HTML templates, but there’s an option to write the render function in JSX. On the other hand, in React there's solely JSX. A Vue component is split into three parts: HTML (
<template>), CSS (
<script>) which most web developers should already be familiar with.
In React, we use JSX to render our component's template. This has some advantages:
- JSX has good tooling support (e.g. linting, type checking, and editor auto-completion).
Array.prototype.map() to render lists. But writing code using an extra DSL (Domain-Specific Language) helps us to write less code.
All code is buggy. It stands to reason, therefore, that the more code you have to write the buggier your apps will be.
- takes more time
- number of bugs grows quadratically with the size of the codebase
- is harder to review in the code review process
So using the DSL provided by Angular and Vue we write less code which is good.
React provides a robust routing (React Router) and state management solution (Redux) that are maintained by the community and create a more fragmented ecosystem. Vue provides companion libraries for routing and state management which are all officially supported and kept up-to-date with the core library. This is similar to the Angular framework which provides a collection of well-integrated libraries that cover a wide variety of features, including routing, forms management, client-server communication, and more.
Getting started with Vue is much simpler than with React or Angular as you can use it completely without any build system and just use a single script tag in your HTML.
I already used this simple approach in a large Django monolithic application to be able to add new UI features without using the Django templating engine based on Python.
I know it's also possible to use React with Babel Standalone but this is not a suitable approach for production usage.
Vue 3 is written in TypeScript so we don't need any additional tooling to use TypeScript with Vue - it has first-class citizen support. Angular is even stricter and uses TypeScript per default.
Vue already has a good community but React is way more popular and therefore the community is bigger.
Angular is very opinionated and I like that for large applications. Vue is less opinionated and has no restrictions on how you structure your code or which build system you use. I like to have some restrictions in my framework as this reduces discussion time between developers.
Vue.js does not natively support mobile app development. There are a number of solutions for creating native iOS and Android apps with Vue.js but React and React Native provide a better experience for React developers.
I love that Angular provides a separate HTTP module to be able to communicate with servers using the HTTP protocol. It provides features like:
- The ability to request typed response objects.
- Streamlined error handling.
- Testability features.
- Request and response interception.
Vue provides no specific library to make HTTP requests so you can either use the Fetch API or libraries like axios.
In StackOverflow's 2020 Developer Survey we can see that Vue.js is not as popular as Angular and React:
We can see the same in HackerRank's 2020 Developer Skills Report. But in this report Vue.js has shown steady growth, rising one spot per year since 2018:
Additionally, 23.6% of the developers want to learn Vue.js next:
I'm pretty happy with my choice and the future will show if it was the right decision or not.
Which framework or technology did you pick for your niche? Tell me in the comments!
If you liked this article, follow me on Twitter to get notified about new blog posts and more content from me.