The Best Way To Learn JavaScript-Ep18

In this episode of The Toolbox, I'm going to talk about some of the research behind how adults learn, what programmers do and how I approach learning as a professional student. I've also got some great demos of GitHub's new Code Search Engine, the best new terminal I've seen in ages called Warp and yes, I have some invites. The pace of the web is relentless...and that's why you need The Toolbox.

Hello everyone this is Ray Villalobos and I stream about front-end and full stack tools Wednesdays at 1pm Eastern • 10am Pacific. Follow me and subscribe on all the social media things for more content. If you want to watch any past episodes, make sure you take a look at my blog...raybo.org.

My dad worked for a big bank and when I graduated from 10th grade, we moved to Chile. I had already taken my first basic computer class in Puerto Rico, so I signed up for a Pascal class at the new school. But, when I got there, the semester was almost over.

My teacher decided to let me do self study, so I got the book, help whenever I needed it and a series of problems to solve. As long as I finished the problems, I would get a passing grade.

That experience really changed my life and to this day, I've learned the value of how to study. It's only recently that I learned that adult learning is a pretty well researched topic.

So today, I wanted to talk about some of the things I do and hopefully it's something that can help you.

Before I get into that, I want to talk about a couple of cool new tools you should know about.

First, it's the brand new GitHub Code Search. It's currently under closed beta and I just got access the day before yesterday, so I wanted to share.

There's a couple of real interesting things. Last week I talked about how the Rust programming language is becoming real popular and sure enough, this new Search Engine was written in Rust.

This search engine focuses on letting your search code that's on GitHub. Now GitHub let's you do some of this, but this URL is clearly superior. You can easily search throughout GitHub

Like with GitHub, you can hit the question mark ? to get a quick list of the available commands.

You can choose to search within GitHub or on just your own repos with the dropdown. You can even create custom scopes that you search often.

Let's search for one of my articles. "The Rise of the Meta Frameworks". Once you get some results, you can choose to view the repo or search inside that search result.

You can multi-line choose text and then hit the copy icon.

You can also jump back into GitHub or easily open up a codespace to fix or work on a file.

Warp Terminal

Another awesome new tool is the brand new Terminal tool called Warp. Which was also written in Rust.

I finally got my invite to check it out and I couldn't be more excited. I'm not sure I can ever go back and when I got into the Visual Studio Code terminal, I'm sort of disappointed.

This terminal is super smart. It has excellent autocomplete features that are magical.

You can easily go through your command history by hitting the up arrow.

You can type multiple commands by hitting the shift return key.

When doing this, you enter block editing mode and the terminal will then behave like a regular text editor. That means that you can do things like multiple cursors.

I have about 10 invites that I can give out to Warp, so send me an InMail on LinkedIn and I'll give them out to the first 10 people.

About Learning

People think I spent most of my time teaching, but the reality is that most of my time is spent writing (for teaching) and learning. My learning approach hasn't changed much since high school. It goes something like this:

  • Read/Watch
  • Take notes
  • Practice
  • Teach it

Read/Watch

Giving yourself time and permission to learn is probably the most important skill to develop. If I take 30 minutes to learn something that will eventually save me hours, then it makes sense to spend the time doing it. Although I learn by reading or watching videos or reading documentation, it doesn't really matter how you learn. Different people enjoy different types of learning.

Take notes

The difference between normal notes and then ones I use for learning is that I focus on writing things I want to practice later. I learn from videos, documentation or articles, so those are easily bookmarked for access later. Learning materials can have a lot of fluff, so I'm really interested things I want to reinforce with practice.

Here's a good research based article on how to take actionable notes:

Research on Notes

Basically the article talks about how revising and reviewing notes is the key to making them useful. Nowadays all the conference talks are recorded, so notes can help you establish your learning plan.

Practice

It's tough to learn something well that's not going to be useful in the future, so reading documentation is a waste unless you're willing to do something with it. If you're reading from documentation, try to give yourself a realistic problem that will help you expand your knowledge about the topic.

We all get these screenshots or code snippets so I did a video on how you can use them to learn a few things. Most of the time, it's not important what they're about, but just going through the code will help you get better.

Pay Video screenshotlearning.mov

Teach it

This is one secret all teachers know. The best way to understand something is to try to explain it. One of the ways I did this in high school is by becoming a lab assistant. Having to help people with their own problems made me really dig into topics.

Favorite Reasearch Findings from Stack Overflow

Let's talk a bit about some of the wayss that developers are different. The stack overflow annual survey has about 80k respondents. I gathered some stats about developers and education from the 2020 and 2021 surveys.

Andragogy Principles

Let's take a look at how that compares to adult learners and some of the research that has been done there.

Learning Principles

Andragogy Principles

  • Prior Experience
  • Self-concept
  • Motivation
  • Readiness
  • Orientation

Learners have a wide range of experience levels

Self-concept

Learners like to feel like they're in charge

Need to know

Learners want to know why they need to learn something

You will be more successful learning if you understand why you need to learn something. When I taught in college one or more students would always want to know why something was important. What they were really saying is why do I need to learn this? What's in it for me? I don't blame them. CSS and JavaScript are getting ridiculously complicated.

Motivation

Learners are better motivated by internal pressures

We can be motivated by all types of things, an increased salary, a new job title, etc. The motivations that work the best are things like job satisfaction, self esteem and quality of life.

How does this translate to practical learning for developers? For me, I choose to learn things that will improve me as a developer. Regular practice is the best way to learn.

Readiness

Learners want training when they need to know something

Most people don't want to learn things until they have to. That's the reason that developers use Google or Stack Overflow so much. Deadlines are a fantastic way to learn, so you can create your own by defining some accountability.

Here's some techniques to target readiness. Writing a regular blog post and having a weekly stream is definitely motivating me to learn new things constantly. If you make it a point to As a boss, you can ask your workers to talk about a new topic at a meeting, or ask them to have a day of learning where they get to share what they learned with each other.

Orientation

Learners are encouraged by solutions to real problems

People want to learn from real world problems. That's my problem with a lot of documentation and even some tutorials. I teach the same way I learn...by working on something realistic.

I've got a new course that focuses on this approach called JavaScript as a Second Language.

Demo of Code from Friend

Last week, Peter EasterBrook, who watches the show often had a good question. Asking about React charting libraries. I did a bit of research and found and article discussing the top 5 React Libraries

He and I chatted through the list and I think he linked ReChart. So, he went out and built something with it.

https://weather.onestepweb.dev/

I think this encapsulates all of the things I talked about how developers learn something.