CodeNewbie Community šŸŒ±

Cover image for A better way to learn coding online
Jason Leow ~ golifelog.com
Jason Leow ~ golifelog.com

Posted on

A better way to learn coding online

A self-learning structure to help you learn 10x better


Iā€™d been taking online tutorial courses on Vue School, to learn the fundamentals of Vue.js and Nuxt. As I go through it, I realised thereā€™s a few things I fell into doing along the way that helps with my learning. Thereā€™s a certain structure that helped me learned 10x better. This is as much a note to self as it is for others who might be trying to pick up coding via online classes.

1. Build your semantic tree

Read through the whole course first, without watching the videos. Get a sense of whatā€™s being covered, even if I donā€™t quite understand the technical terms yet. This helps build up a rough semantic tree where I can hang the more specific bits later on.

2. Watch the entire video first ā€“ no coding yet

At the start of each video tutorial, watch through the entire video once, without typing any code. I didnā€™t used to do this, and would jump right in into coding as the tutorial progressed, starting and stopping the video so that my typing can catch up. That broke the flow and didnā€™t aid my understanding of why Iā€™m typing the stuff Iā€™m typing. Better to watch it through beforehand, so that I understand the starting and ending points better, what weā€™re trying to achieve, and the coding would make more sense as I type.

3. Watch & type, blow-by-blow ā€“ no copy-paste

Next, type as the tutor explains and types on the video. Yes, do not download or copy-paste the code provided in the class materials. This forces you to type out character by character, and to start getting used to the syntax. This also make you start to look out for idiosyncrasies of the syntax, like forgetting commas or semi-colons. I used to pre-download the code, and without the blow-by-blow typing, it hindered my learning more than helped.

4. Inline code comments are your class notes

Leave comments in the code as you type along. The tutor will share why heā€™s typing certain things, what this method/directives are for, how the syntax works. Try to type it above each line of code, as much as possible, especially the parts which are new and unfamiliar. The commentary will serve as your class notes. It also helps you break out of a monkey-see-monkey-do mode of blinding copy-typing away, letā€™s you take a step back to reflect on what you just did. Itā€™s slow yesā€”a ten minute tutorial can take an hour maybeā€”but it ensures quality learning.

5. Google to reduce ā€˜leakinessā€™

Along the way, heā€™s going to gloss over something or do something which you didnā€™t understand, or questions pop up in your head. Feel free to stop and go google it to understand more first before proceeding. That way, your knowledge will be less ā€˜leakyā€™. But sometimes it gets annoying because googling mid-way through the tutorial might mean you get distracted and wander too deep into the internet rabbit hole, potentially spending even more time on the tutorial, breaking your momentum. When that happens, I try to quickly google a question and leave the tab there for further learning after Iā€™m done with the tutorial.

6. Make it public and share

Finish the tutorial and save your code in a separate file, so that you can see the progress from one stage to another. I like to code them on Codepen, so that itā€™s public and shareable ā€“not just for showing off, but also to send it to mentors to ask for help or ask them to comment on what your code quality.

7. Donā€™t be shy to break away part-way when it no longer serves you

The upside with structured coding courses is how it makes you want to complete the course to have a full closure. But I realised thatā€™s also a major downside. Because very often only some bits of the entire course are brilliant or helpful to you. Other ones, are confusing, or poorly laid out. The problem is that you donā€™t know enough to be sure that it sucksā€¦yet. But when you have to rewatch the video over and over, do some research outside of it to understand whatā€™s going on, maybe itā€™s not worth the effort then. So when you find youā€™re going around in circles, feel free to skip, or jump to a different course that teaches that part better. This isnā€™t school where you have to stick to the syllabus. You make your own learning pathway, and it doesnā€™t have to be rigid like back in school.

8. The best learning is always on your own terms (and your own project)

I like the current approach of coding course where they walk you through the syntax by creating something. At Vue School, it was first a to-do app, followed by a pricing subscription page for coffee. All great, but I find I learn and retain things best when itā€™s my own project. Yes, even learning the basics. Because even if Iā€™m super diligent and do the above-mentioned Steps 1-6 well, I find my retention is still not as good as I would like. I would learn and understand a class today, but forget about the content the day after. But if the learning project was something I wanted to make myself, then the understanding goes deeper.

9. Pain is the best teacher

I hate to say this, but Iā€™m beginning to feel that maybe following courses might not be the best way to even learn the basics. Because sometimes I get distracted and veer off the course to code up my own thing for a bit, and stumbled and hit brick walls. Itā€™s painful, and hard work trying to figure out how to debug it. But when I finally find the solution, thatā€™s when I truly learn and retain the lessons from all the detours and mistakes I made along the way. In fact, I dare say, better to hit some walls and experience pain, then come back to a relevant course to learn the concepts and tactics of how industry veterans solve it. Thatā€™s when the a-ha moment is brightest. Like how they always say, donā€™t take your MBA right out of university. Go work in the real world, get some work experience (and pain), then taking the MBA would make much more sense. I think this is the same context.

Any other tips to learn better?


Follow my daily writings on Lifelog, where I write about learning to code, goals, productivity, indie hacking and tech for good.

Top comments (1)

Collapse
 
charly01082 profile image
Tracy Petit

I really appreciated all of this advice, thank you!