"Can you talk about why you are learning front-end development, and what is your background and motivation?"
This is the question I have been asked the most in the past month.
When I think about it carefully, I have been involved in front-end development for 2 years, exactly 2 years. Two years ago, I was still a freshman in college, young and confused like most people. I couldn't see where the future path was. Before that, I had studied Python web scraping for a while and made a few scripts. By chance, I met @Paul and after communicating with him, I learned that he also learned front-end development on his own. He had his own personal website, and at that time, I thought I wanted to make my own website like that in the future. At that time, through writing blogs, I got to know many people who were also running independent blogs. You should know that nowadays, self-media and public accounts are everywhere, and there are very few people who write independent blogs.
When I first entered a new field, it was somewhat difficult, especially when self-learning. Most people may follow a video tutorial to learn. But I didn't. I learned by directly modifying well-designed themes made by others. I admit that I mostly made random changes, but I also learned a lot from it. At that time, I was learning the basic knowledge while modifying themes, which means I was practicing. To achieve a certain expectation, I also needed to search for more in-depth knowledge through search engines. So at that time, I didn't start from the basics, because it was too slow and boring, and I have always been driven by interest. I have always believed that only with the drive of interest can you learn faster and more effectively. It was because of this that I had a happy time during that period. I was learning and working on my own projects every day. During that time, I ported and modified multiple Typecho themes. It was also during that time that I fell in love with open source. Influenced by Phodal, I also completed the GitHub 100-day streak. (Those dark histories can still be found on GitHub)
In the summer of that year, I officially started learning front-end engineering projects. It was difficult to find the entry point for front-end engineering. It required me to transition from pure native development to frameworks. I needed to learn a series of front-end tools and understand the overall directory structure and modularization. During that learning process, I learned through videos published by 全栈之巅 on Bilibili. He is a very excellent content creator, and his videos are of high quality, but he has relatively few followers. I started learning Vue 2, as well as Express and NestJS. The learning process is not about blindly following tutorials and copying code, but about thinking independently. The master can only guide you to get started, and the real practice still depends on the individual. After that, I started to work on independent projects and started a new project. And this is my original intention, to create a personal space. I think it's time for me to complete it.
Independent development is a challenging thing. When encountering problems, I didn't know who to ask for help. In addition to reading the official documentation, sometimes it was still not enough to solve the problems. I had to go to Stack Overflow for more solutions. Another challenge was the project structure. If the initial architecture was not well-designed, it would become a maintenance nightmare later on. That's why the first version of my personal space failed before it was launched. The current version of the project was made by referring to the project structures of others. Although it is still somewhat messy now and not friendly for future maintenance, the main reason is that I didn't outline a clear plan from the beginning. Unit testing is very important during the refactoring process, but I still don't know how to write test cases and can't find a good starting point.
In the second half of that year, I was mainly working with Vue 2 and wrote many practice demos. As a beginner with no practical experience, it was a challenge for me to work with React. But it was a great opportunity, and I didn't want to miss it. That's who I am. Regardless of whether I can do it or not, I will give it a try. I need to seize the opportunity. I have some people around me who are also learning front-end development. When you reach out to help them and invite them to work on projects together, they refuse and say they are not capable enough. Well, if you are not capable enough, why don't you cherish these opportunities? If it were me, I would definitely accept. After all, before this, I really wished someone would say, "Hey, let's work on a project together!"
How long does it take to learn a new framework? What does it mean to learn and master it? If it means being able to use a framework, then it may only take a day to go from zero to being able to use it. That's how long it took me to learn React. Did I master it? No, I just learned how to use it. Learning is a long process, and even now, I dare not say that I have truly mastered React. React is an excellent framework. According to the official statement, it is not even considered a framework, but just a library. Compared to Vue 2, it doesn't have a built-in router or store. Therefore, there are many different choices within its ecosystem. The JSX syntax of React is more user-friendly, and gradually, I started to lean towards React. From then on, React has become my main technology stack for the past year until now. The JSX syntax of React has always been engraved in my mind. I hope that one day Vue can also be on par with React, after all, it was the first framework I learned. The arrival of Vue 3 gave me hope. It is basically a copy of React Hooks, but after using it multiple times, I feel a bit disappointed with its ecosystem. Many libraries migrated from Vue 2 to Vue 3, but they have poor support for TypeScript, and the JSX syntax is frustrating. The official documentation also does not provide clear instructions on how to use JSX. (After all, the official documentation has always advocated for the template syntax, which allows for static optimization during the compilation phase and faster runtime diffing. But I still prefer the JSX syntax)
I had been familiar with TypeScript for a long time at that point. I had always wanted to find an opportunity to use it. Coincidentally, I received an outsourcing project where the backend data was very messy. If I used JavaScript, it would be difficult to handle the backend data because all the types were "any" (after JSON parsing). I used the JSON2TS tool to generate interfaces from JSON, which made it easier to work with. Then I learned about TypeScript usage in Vue, as well as Vue Class Components, and so on.
The rest of the story can be found in previous articles, so I won't write about it here. You can start reading from here:
Things I Did While Staying at Home
Conclusion#
You can learn more from my previous reflections: