How I Learned Various JavaScript Frameworks

JavaScript has been a staple of my professional life since the early 2000s. Today, JavaScript frameworks dot the tech landscape. And I have even dabbled in some of them. In recent years, I have picked up AngularJS, ReactJS and VueJS, in that order. Today, I would like to recount my learning process.

Most of my learning, at least with JavaScript frameworks, was done less out of immediate necessity, and more out of the curiosity that seems almost to be professional obligation for a web developer. And one of my most valuable takeaways from all this learning is that I've discovered it is extremely possible for me to learn. I have the requisite motivation, and the numerous resources on the web are very helpful, especially if one keeps at it.

Encountering the framework

All these frameworks were first brought to my attention either via the process of sourcing for new job opportunities, or actually working in a new job opportunity.

AngularJS and ReactJS were encountered in the same way - via job ads in LinkedIn. It's my practice to periodically monitor the local software industry and look out for better opportunities. In doing so, I noticed that these two terms just kept coming up in job ad skillset descriptions. AngularJS. ReactJS.

JavaScript frameworks.

I started with AngularJS first, even though it was on its way to becoming obsolete, because there were just so many eminently readable examples on the internet.

Later on, I delved into ReactJS. Part of the reason I did it was because I was challenged by an interviewer to pick it up. It had already been on my radar; now I had even greater reason to explore.

And even later on, I picked up VueJS en route to trying to pick up Laravel. It was something I was trying to learn for a new job; VueJS was peripheral to the goal. However, I had already learned AngularJS and ReactJS by then. Consequently, learning VueJS didn't feel like it would be such a huge deal.

Learning

With AngularJS and VueJS, it started from books. Learning AngularJS by Brad Dayley and Full-Stack Vue.js 2 and Laravel 5: Bring the frontend and backend together with Vue, Vuex, and Laravel by Anthony Core respectively. As you can see with VueJS, it was more about Laravel. For AnguarJS, I learned the concept of front-end brackets. This would be one of the foundational concepts of picking up ReactJS and VueJS.

Learning from books.

When it came to learning ReactJS, however, I fell back to my second go-to method: YouTube tutorials. Specifically, Level Up Tuts.

From there, I learned the concept of State Management and how it was used to effect changes to the front-end. It was markedly different from what I had covered with AngularJS.

However, later on when I tried to pick up VueJS, I found the going much easier. The front-end binding from AngularJS and the State Management from ReactJS I had previously learned, flattened the learning curve for me immensely. VueJS was pretty much a combination of all my favorite parts of ReactJS and AngularJS, with less of the annoying bits.

Projects

Once I'd started learning the ins and outs of these various frameworks, it was time to actually put that knowledge to use, no matter how minor.

For AngularJS, it began with an exceedingly simple BMI Calculator, where I used template strings and front-end data binding. Later on, I graduated to a Password Strength Validator, using AJAX. The final project I did with this was the Liverpool Quiz, where I proceeded to perform more fancy variations of front-end data binding.

With ReactJS, it was just a teeny bit more complicated. I did three projects the "non-professional" way - by remote-linking the ReactJS libraries in the code and just writing the components in the same page. These were very simple applications such as Lee Bee Wah Lau! and the British Insult Generator, Ada Lovelace Day Generator and later on the Easter Memory Game.

Various ReactJS projects.

However, after a short stint with a prospective employer, I graduated to using NodeJS to generate ReactJS code and then running tests on the applications I wrote, attempting to do things in a more professional way. The end result was The 12 Days of Christmas and the rather more useful Hangman game.

On to VueJS. The one and only application I have written so far is the VueJS Easter Puzzle, and all this really amounted to a nice distraction because it just wasn't complicated at all. Whatever I had already done in AngularJS and ReactJS just combined nicely to give me the end result.

Editor's Note: At the time of publication of this blogpost, the VueJS Tile Slider Game is up as well.

Final Thoughts

No one is ever done learning - not in life, and most certainly not in tech.

My current method seems to be - read up on the subject, get some hands-on practice, then cement the knowledge with coding projects. It's not perfect, but if you're stuck as to how to proceed, you could probably do worse!

{goodbyeMessage};
T___T