February 18, 2019

How To Keep Learning JavaScript

📖 This Weeks Article

A member of my team at work asked me last week how I continue to learn things about JavaScript. This is my answer. Note that it is focused on leveling up for folks with existing programming experience, not giving the best pathway into the field.

I’m going to break this up into 3 parts.

1. The different ways people tackle learning new programming things
2. An inventory of the different types of resources out there for learning programming
3. My specific recommendations for JavaScript and React resources

The first 3 are going to be generalizable to any type of learning about programming you want to pursue (and probably other fields as well). The last one is necessarily more specific.

Learning Strategies

It’s helpful to start by talking about the different ways that people learn programming concepts. We can break things up into 3 categories:

• Practical: This is where you work on projects and pursue goals, and learn the things you need as you need them.
• Topical: This is when you commit to learning something about a certain set of topics that you think will be valuable. This may be related to work you’re doing, but your goal is a deep understanding of the topic moreso than trying to solve a specific problem.
• Serendipitous: This type of learning isn’t directed at all. You’re just diving into learning as you encounter new terms or concepts, trying to absorb and understand everything.

So which one is best? You’ll hear arguments for all three, but personally I see learning like investing; it’s a long term game that you can’t win in a day, the gains accumulate slowly until suddenly you’re a long way from where you started, and one of the keys is diversifying.

Practical knowledge is safe; when you focus on learning things you need, you’ll rarely waste your time, will likely get more done, and will put yourself in a position to learn more interesting things as you develop a reputation for doing good work. However focusing solely on learning the things you need to do your current job may blind you to trends and eventually leave you with an out of date skill set. In addition, while you may be looking for answers to practical problems, if your knowledge base is narrow to start you may miss out on innovative ideas because you don’t have exposure to solutions that might not “google well” for the way you think of your current needs.

Topical knowledge can be very useful when jumping into a new area of work: sometimes you just need a level of exposure to the syntax, concepts and tools behind a language, framework or project before you can effectively work with it. But learning about a topic divorced from a project can sometimes feel more productive in the moment than it actually ends up being: without practical experience of the pain points that the topic is solving for and/or causing, it can be hard to know what is important and make the connections that you really need. Topical learning can also devolve into a purely academic exercise where you never really learn to apply what you know.

Serendipitous learning on the face of it is the most easily wasted; trying to learn everything can be overwhelming in programming, a field based on layers of abstractions, with a plethora of different subfields that can be explored for years without learning everything. However sometimes it is the dash of inspiration that comes from bringing previously disconnected ideas together that leads to the creation of something novel and great. And those types of connection only come from somebody who is learning broadly as well as deeply. Being curious also prevents the pitfalls of purely practical learning: dead-ends and blind spots. So there is a place for serendipitous learning too.

The best approach is a mix of the 3: have real problems that you’re trying to solve, but make sure to keep an eye out for interesting things, and don’t be afraid of the occasional deep dive into a useful sounding topic.

Resource Types

There are so many ways to learn things in the programming world. Below is a brief roundup of resource types, ordered roughly in terms of stability and how rapidly they produce new material.

• Academic Courses - College, bootcamps, Coursera, etc: These are the ultimate in topical learning. Not something that most people are doing every day, but can be great for rebooting a career if you want to head in a new direction or refresh after being away from the field for a while.
• Books - People are still writing programming books. These tend to fall into 2 categories: books about a specific framework or technique and more “timeless” books about some fundamental part of how we write software. The first group tends. to age fast but can be great for topical learning, the second are an essential resource for “higher level” thinking about our field.
• Video Courses - In recent years, video courses seem to have grown in popularity as a way of teaching programming. They’ve never been my cup of tea, but they can be great topical guides to new subjects for visual learners who don’t want to commit to a full academic course.
• Wikis - There are several places online where developers aggregate documentation in an open way. Stack Overflow and Wikipedia are the most prominent. These can be an excellent authoritative source to start looking for answers that still are able to remain relevant as best practices and trends change.
• Blogs - Blogs come in a variety of flavors. They can be focused profitable publishing platforms with multiple authors like CSS Tricks or occasionally updates on a variety of topics from an individual developer. They tend to be the best source for in depth “how tos” on niche topics that might not justify a book or be fully covered by a wiki.
• Podcasts - There are lots of developer podcasts out there. Due to the audio nature of the medium, they tend to be more focused on high level ideas and less likely to drift into the nitty gritty of code.
• Newsletters - Newsletters like this one can be a great way to get regular updates from knowledgeable developers or receive aggregations of interesting links. I’ve personally found them more and more valuable in recent years as a way of bringing the best content to the surface.
• Github/Looking at code - Sometimes the best way to learn is to go straight to the source. We live in a golden age of open source software, where billions of lines of code are available for anyone to look at online. Code is ultimately the source of truth.
• Forums, Mailing Lists & Chat Groups - Many technologies, geographic areas and interest groups have vibrant online communities that can be a great source of learning. In the past these groups tended to exist as mailing groups, IRC channels or forum sites. But nowadays the most popular form of community seems to be chat groups implemented with Slack or Discord.
• Conferences - These aren’t something that most of us can do regularly, but conferences are a great place to be introduced to new ideas and make connections with people in a tech community.
• Meetup Groups - A more accessible option than conferences for many people, most mid-sized and larger cities have multiple tech meetup groups that can be a good place to grow a tech community and be introduced to new concepts
• Aggregators - Aggregator sites like Reddit and Hacker News are useful places to encounter new ideas. Compared to the options above, they’re much noisier; you’ll encounter a mix of content quality and topics. But it can be a great way to find serendipitous ideas and find new blogs, podcasts and communities to follow.
• Social Media - Social Media sites (especially Twitter) can be a great way to get a sense of whats on a tech communities collective mind, and encounter concepts and ideas while they’re still being formed. But it also can be a distracting mess of noise. So consider moderating your intake.

I’d generally recommend a mix of the resources above, though you’ll find some are more helpful to you than others I personally have found that books, blogs, newsletters, wikis and aggregators have been the most useful for me personally, as well as finding ways to teach others through meetup groups, conferences and my own blog. There is real truth in the idea that the best way to learn something well is to teach it.

Specific Resources

So the above stuff is all pretty generic. I’ll end by listing some resources that I’ve found personally helpful in learning and keeping up with the JavaScript and React world. This isn’t exhaustive, and I know there are a lot of great resources out there that I haven’t personally used. But this is my list:

Books

• JavaScript Allongé is a great ebook about functional JavaScript. It was very influential for me in terms of how I structure my code.

• Effective JavaScript is a bit dated now; it was written pre-ES6. But it’s the best non-beginner book I’ve read about the JavaScript language.

• Clean Architecture is my favorite book on Software Architecture. If you want to think about how we structure programs at a higher level, it is worth a read

• A Philosophy of Software Design is a book I’ve mentioned a few times recently here; Its my new recommendation for a first “writing better code” book because its so concise. The Pragmatic Programmer played that role for me personally though, and I’d still recommend it as well for any developer who hasn’t read it.

• Atomic Design is a great book on building modern design systems, and has been useful for me as I think about how to break down UIs in my development work.

Video Courses

• Egghead.io is the best source for dev video content I’ve found. Video has never really been my jam, I prefer text content where I can go through it at my pace and easily reference back and forth between it and code. But it can be great to get a focused intro to a topic, and Egghead seems to have nailed the format with its collection of short focused snippets. It’s mostly a paid service, but there is a bunch of great free content on there, especially beginner React stuff.

Wikis

These are maybe stupid obvious, but I’ve learned more from these 3 sites than probably anything else listed here:

• Stack Overflow is the single best source for software development information on the internet. Note that I would advise most people to use it as more of a googleable resource than a place to ask questions; they’re focused on documenting canonical answers to common problems moreso than chasing down situational issues, and for popular technologies they are fairly comprehensive.
• MDN is my site of choice for learning about browser APIs and JavaScript/CSS/HTML language features. It’s extremely reliable, and generally very readable (although some articles are much more detailed than others).
• Wikipedia is a surprisingly great place to learn about general computer science concepts. I wouldn’t use it for front end specific stuff, there are better resources there, but if I want to learn about a classical computer science concept like a priority queue or Dijkstra’s algorithm wikipedia usually has a pretty robust article giving the basic background.

Blogs

For blogs, I highly recommend getting a good RSS reader so you can keep up with posts as they come. My tool of choice here is Feedbin for which I pay a very small monthly fee, but there are good free alternatives like Feedly as well.

• 2ality is a blog focused on new JavaScript features as they work their way through the TC39 development process. It’s the best resource I know of for understanding what is coming down the language pipeline, and also learning about new features when they are released.
• Overreacted is Dan Abramov’s “Advanced React” blog. It’s the best single source of knowledge on React that I’ve seen.
• CSS Tricks is more of a mega-blog, with multiple articles published a day by a variety of authors. It’s consistently high quality content, and even though it leans more towards “web site development” than “web app development” there is stuff here that anyone will find interesting. It’s also been around a long time and has great historical resources for learning newish CSS standards like CSS Grid and Flexbox.
• The official React Blog is excellent and a great place to get “official news” about React. The same applies for other frameworks like Ember, Vue, and Angular; you always want to be following the official source and not just getting your news from the community. It greatly reduces the chances of misunderstanding and cargo culting.
• benmccormick.org. Ok I’m sort of kidding here, but the truth is that having my own blog has been one of the best ways for me to learn; I learn when I write, I can reference back to older posts when I’m re-engaging with a topic, and things stick better when you write them down. Plus when I write posts like this where I’m linking other resources, its easier for me to find those resources later. (but uh… feel free to tell everyone to subscribe to my blog anyway)

Newsletter

• JavaScript Weekly is a great “list of links” style newsletter every week. If you just want a pulse of the weekly news in the JS community, I think this is the best place to find it.
• Kent C Dodds’ Newsletter is a great resource for React and JavaScript testing.
• Hacker Newsletter is a roundup of the top Hacker News posts each week. Hacker News can be a bit of a mess (the comments are often written from deep within the startup bubble and the quality of links at any given time on the site is mixed) but it’s an amazing source of interesting content if you’re willing to wade through it. This newsletter lets somebody else do that for you.
• This week in React is another source of advanced React content. It’s actually just a summary of the interesting things going on in the React repo itself. So if you’re interested in contributing to React or want to see how they’re progressing against their roadmap, it’s an interesting and quick read each week.

Aggregators & Social Media

Honestly, 2 years ago I probably would have led with this section; Twitter and Hacker News were a huge part of how I have found interesting content and built my skills over the past 5 years. But I’ve gotten disenchanted with them over time as they became part of a broader issue of my increasing inability to focus on things because of the abundance of technology related distractions in my life. So… caveat emptor. That said here are some people I’d recommend following on Twitter if you’re interested in React and JavaScript.

• React - Dan Abramov, Kent C Dodds, Ryan Florence, Mark Erikson, Shawn Wang, Guillermo Rauch
• JavaScript - Tracy Lee, Jason Miller, Nicholas Zakas, Sarah Drasner

A final note

I just want to end where I started, and encourage you to not rush out and try to absorb all of these things at once, but instead work on projects and find the resources that give you what you need. And then explore a bit on the side to help yourself grow. Your resources will probably be different than mine. The internet is huge, the world is even bigger. Explore and have fun!

🔗 New Site Content

• Last week’s post on Strategic coding is up on the site now :)

😎 Cool Stuff

• How white space killed an enterprise app - As somebody who has spent his career working on Enterprise apps, its fun to see articles like this that focus on the differences between design or development between business and consumer apps.

• Getting Organized with an Engineering Logbook - My friend Nate gives some good suggestions here on getting organized as a developer

• SQL: One of the most valuable skills - If you’re a front end developer who wants to become “more full stack”, my advice would be to start by learning SQL. It’s fairly approachable, applicable for almost any backend stack, and gives you insights into your application’s data that can be incredibly valuable when troubleshooting or prototyping.

• Application Holotypes: A Guide to Architecture Decisions - Jason put together a nice list of some different types of applications and the challenges that they present. I’d love to see this expanded to include more “business applications” though.