Recently, I read an article — "An Incomplete Guide to Learning New Technologies"1, which was very enlightening. I often find myself in the dilemma of "not knowing what to learn" and "not knowing how to learn." Sometimes I make what seems to be efforts, but the results are minimal.
This article will list some of the methods mentioned above regarding learning new technologies, while also combining my recent experience learning React. Let's explore how to learn.
First, let's examine myself. Taking my current work in front-end development as an example, what technologies am I familiar with? The main stack I use at work is JavaScript + Vue + CSS. Since the company's business is relatively simple, there isn't much room for vertical exploration2. Therefore, I want to break through horizontally, which is the first dilemma mentioned above — what to learn.
Learning Motivation#
Work Requirements#
Work requirements are a strong, persistent, externally driven motivation for learning. The technologies that are related to work are usually the ones we master most solidly, forming the core of our technical capabilities. In contrast, technologies that are less related to work are the ones we are most likely to abandon midway.
Actually, I wanted to learn React and TypeScript a long time ago, but I never got around to it. My understanding of TypeScript is just that it is a superset of JavaScript. I never looked into what it specifically entails. The reason is the lack of sufficient learning motivation
. Even though I see many excellent open-source projects on GitHub using the TS + React stack, I never explored them deeply and continuously.
Serious Learning#
Reflecting on Previous Failures#
A long time ago — when I first got into front-end development, I engaged in some seemingly diligent behaviors. I often read articles from the Juejin community and "repeatedly" looked at some official documentation. Most of the time I spent reading technical articles was while waiting for meals or the subway. This time was actually quite "fragmented," making it hard to learn systematically.
So this time, when I decided to learn React again, I set a goal from the start — to complete the exercises on the frontend-bootcamp. This project is implemented using TypeScript + React.
High-Intensity Interval Training#
Let reading materials appear repeatedly
In terms of learning React, the main line of study is centered around the frontend-bootcamp
project. It is divided into two major steps, totaling 13 sections. At the time of writing this article, I had completed all 13 exercises — implementing a todo app using TS + React. This includes using state management tools like Redux and Fluent UI to optimize the project.
Advanced Training#
- Add color tags to todo items
- Categorize todo items
Accumulating Results => Output#
- GitHub
- Blog
Footnotes#
-
Original text click here ↩
-
Indeed, even "simple" CSS has infinite exploration directions; this is just from a business perspective. ↩