How I learn new Web Technologies and The four stages of competence?

Learning and the four stages of competence.

How I learn new Web Technologies and The four stages of competence?

Why and how I learnt VueJS?

As a senior full stack Web Developer already knowing Angular and ReactJS, I have no need to learn yet another similar framework. I keep however hearing how this technology has recently been increasing in popularity.

I therefore decide to glance at a few tutorials on YouTube just to get an idea. Compared to the other frameworks (library in ReactJS case), this one looks easier. For beginners, having a single file to put the HTML, JavaScript and CSS decreases the mental overload - similar when using HTML instead of JSX (unless you are an expert in it). Moreover, the routing and state management looks straightforward, and can be learnt and applied within hours.

So I install the VueJS extensions on Visual Studio Code and begin practising recent online free tutorials.

The Four Stages of Competence

In this post, I shall illustrate how I learnt VueJS following the four phases of competence consisting of:

  1. Unconscious incompetence
  2. Conscious incompetence
  3. Conscious competence
  4. Unconscious competence

Unconscious incompetence

At this stage, the person does not know how to do something and does not recognise the need to. For me, as a Full Stack Web Developer, already knowing Angular and ReactJS as frontend technologies, I see no use in learning VueJS.

Conscious incompetence

The individual does not know how to do something - but recognises the deficit - that they should address by learning a skill. The demand for VueJS developers has seen a significant jump in the last couple of years - with them saying, it's easier to learn and use for both small and large projects.

Moreover, I see plenty of companies on LinkedIn and elsewhere, searching for experience in VueJS.

As an avid learner therefore, I jump on the bandwagon. I recognise that this skill can bring me better options in terms of job prospects but at this stage, I am still incompetent.

Conscious competence

The person understands the problem and knows how to solve it. They, however, need a lot of focus and effort to do it.

I write codes in VueJS while having to regularly check existing snippets on cheatsheets and the official API. The solution works well but I take a lot of time to code requiring plenty of time and energy.

I can code an effective solution, requiring me plenty of time and effort though.

Unconscious competence

The person is skilled enough without the need to consciously think about the work being done. For example, experienced drivers are at ease talking with passengers when driving.

For me, at this stage, I can now understand most VueJS codes comfortably without having to think a lot. I can also teach it to beginners.

My learning Tips

  • I follow the Mere Exposure Effect, which makes me become comfortable with the technology simply by being exposed to the API - I follow at least one video about 30 minutes everyday for the next month or so; and then once a week for the following weeks - until I feel confident writing codes directly without looking at any reference
  • I usually use cheatsheets for code snippets which are more concise than the APIs themselves
VueJS cheatsheet

Additionally, cheatsheets help me be more productive when coding, particularly HTML codes which is more verbose than regular codes in languages such as Python.