How to learn any framework in 1 day or less? A quick guide.

In this post, I'm going to share a quick guide on how I usually efficiently learn a new framework. The keyword here is to become proficient within a few days if not hours. Of course, there are exceptions to this approach, for example, learning Dotnet can take more time.

How to learn any framework in 1 day or less? A quick guide.
Photo by Kenny Eliason / Unsplash

In this post, I'm going to share a quick guide on how I usually efficiently learn a new framework. The keyword here is to become proficient within a few days if not hours. Of course, there are exceptions to this approach, for example, learning Dotnet can take more time.

In addition, you should also have a grasp of the framework requirements, for instance, you cannot learn NextJS if you don't know JavaScript or TypeScript.

For reference, I'm more of a Generalist Software Developer. Therefore, I don't usually go into much depth regarding techniques or patterns such as metaprogramming or pattern matching. I believe most web projects don't require such approach at least right from the start.

If you don't know me yet, I'm Abdallah. I've been working in the IT industry for the past 11 years or so working with a wide variety of technologies, mostly surrounding Web Technologies. I'm passionate about learning, sharing my knowledge and mentoring others.

Let's dive in.


Outline

  • Start with the official documentation
  • Follow the official tutorial
  • Watch a quick crash course
  • Build a small project
  • Create a cheat sheet

Bonus:

  • Read about "best practices"
  • Read about "stuff to avoid doing"

A few words on mindset first

  • every professional was once an amateur, therefore don't compare yourself to much "senior" devs esp. in X framework
  • every progress matters; even 1%
  • we all experience imposter syndrome because the world keeps changing and we all have to learn new things to stay relevant – you are not alone
  • learn consistently everyday, even for a few minutes
  • the person who don't read (documentation) is no different from the one who can't read
  • trying to do everything in a single day can be overwhelming; that's why it's important to stick to the bigger picture and leave out the details for later (one bite at a time)
  • throw some artificial deadlines to add a sense of urgency

Start with the Official Documentation

  1. Go through the "Getting Started" and "Basic" sections
  2. Don't do anything until you've understood the basic terminology
  3. Understand core concepts such as routing, caching, styling (depending on your framework)
  4. Revisit any term you don't understand or have forgotten
Before doing anything else, at least understand the framework core features so that you don't reinvent the wheel down the line or try to implement something that's already done or present e.g. caching.

Follow the official tutorial

Why official?

Like I mentioned above, with the fast pace nature of web technologies, tutorials over the internet soon become stale. The official one is the most up to date.

Nevertheless, it's also possible that you have to work on a previous version. So be mindful of  this. There can often be startling surprises on the longer run if you're not careful.

Moreover, an official documentation also guides you step-by-step and addresses important notes and explanations along the way. But even if they don't, we cover this in the upcoming bonus section below. Read until the end.


Watch a quick crash course video

High quality crash courses or quick start videos are available plentifully on YouTube or on paid platforms. I would highly recommend, apart from reading the docs, to also watch such courses because we humans learn faster when watching and listening from someone.

Time is the key though. Normally, a 1 hour to 2 hours course is enough.

Repetition is important to assimilate the concepts quickly.


Build a small project

By building a small project with a hands on approach, you learn directly all the concepts. The more intense the session is, the quicker you learn.

Nevertheless, pay particular attention to your energy and concentration level. Even building a tiny project with a relatively big framework can be daunting. That's why I always prefer to first understand the concepts and the features i.e. stuff you can do with it.

Here a short list of small projects to get started:

  • todo list
  • blog
  • portfolio or resume
  • landing page
  • weather app
  • url shortener

Create a cheat sheet

Last but not the least, create a cheet sheet along the way. Anything you find useful or interesting, copy and paste it in your wiki or text editor.

There's no need to make it fancy. The important part though, is to try to fit everything in a single page or two so that everything is at a single glance.

Now, let's say for some reasons though, you don't have time to create your cheat sheet.

No problem.

You can grab any popular one for free on the Internet. Here's a few websites:


Bonus

Patterns and Best Practices

The one factor that differentiates novices to seasoned developers is their understanding and usage of popular patterns and best practices. For example, when you're starting out on a new framework, you wouldn't necessary know when to revalidate cache or when to sanitize external input.

So, once you're accustomed to the core concepts and features, look for the framework "best practices" section. If they are not present in the same documentation, look out for them on GitHub or other websites.

Here's a few examples:

Things to avoid

In a similar vein, esp. when we're learning and trying a new framework or piece of technology, we might use previous knowledge that is not necessarily applicable. We might try things by trial and error. And if they work, we will use this approach, but is this the correct way?

A good starting point is to look for "things to avoid", "mistakes to avoid", "not to do list" for X framework.

Here's an example for Ruby on Rails:

  • They don’t specify the HTTP response status in API controllers
  • They don’t use before_action

Moreover, another one for the official one for NextJS:

  • use suspense with Server Components
  • Using Server and Client Components together

And much more.

If you apply the bonus part of this article alone, you will be able to develop much faster by avoiding common pitfalls and use best practices that ensure security, maintenance and scalability.

A lot of buzzwords just to say: "your life is going to be simpler in the future".