Front-end early chat conference, a new starting point for front-end growth, jointly held with the Nuggets. Add wechat Codingdreamer into the conference exclusive push group, win at the new starting line.


The 14th | front-end growth promotion, 8-29 will be broadcast live, 9 lecturer (ant gold suit/tax friends, etc.), point I get on the bus 👉 (registration address) :

The text is as follows

This is the 11th front-end early Talk girls front-end career development special session, but also the 69th early talk, from Baidu Eel little sister share a brief edited version of the speech (the full version of the demo please see the video and PPT) :



One, foreword


Hello everyone, I am eel, now in Baidu as the front-end development, today I would like to share with you my growth process, first a simple self-introduction. I started to contact the front end in school in 2014. I worked as an intern in Cainiao in April 2016 and joined Baidu in July 2017. After working in Baidu, I went from T3 to T5 after about one and a half years. At the end of 2018, I began to take charge of some things and assist in team building. Now I have about ten people with me.


To be honest, being the first one on this show, I’m a little nervous, especially since it’s for a girl. Although I am a girl, but a girl who has not been in the workplace for a long time, I feel that I have not experienced too many “differences between men and women”, and my experience is not too much, so the focus is not on “differences between women in the front”.

However, the Internet industry is generally used by girls as boys and boys as animals, so both men and women will have certain confusion in career development. Here, I will focus on what stages we may go through in the process of growth and what dimensions we can understand. I will share some good experiences based on my own experience.


This sharing basically includes two parts. One is the description of my growth experience, which is divided into adaptation period, warm blood period, anxiety period and breakthrough period. Next is some concrete experience to share, follow up carefully.


Second, the growth process


1. The adaptation

This is a new period for Xiao Meng when I just entered the workplace. It is mainly my internship as a rookie in 2016 and a short period of one or two months before I entered Baidu. This period is mainly a process from campus to the workplace.


Background of this period: Although I had contact with the front end of the school, I was only in a small way and did not systematically do large projects. At that time, I was still using jQuery to operate DOM because of the chaos of front-end technology. I was not very clear about NPM, which is used every day in modern front-end, let alone Vue or React. In terms of communication and cooperation, I am not very clear about the development and operation process of the project and still stay at the stage of doing what others ask.


And what was he doing when he went in there?

  1. In business, do is a Courier electronic sheet editor of things. The tech stack at the time was Vue +TypeScript, and as someone who didn’t know what NPM was, they were basically just helping out and fixing bugs.
  2. And then there was the infrastructure task, which I honestly can’t remember doing right now. After being urged countless times by the students in charge, I could only say that I copied the example of others and submitted it. Later, I found that the submitted content was basically changed so that I did not recognize it.
  3. In addition, I have a small job. As an intern, ONE of the miscellaneous tasks is to help various business departments to put online various contracts and agreements. It is very simple, that is, converting Word to HTML and then helping to optimize the style and put them online.

Looking back now, I can see that this experience is really mediocre and I didn’t feel much progress in technology, but THERE are some signs of some characteristics, which will be of great help to my future growth.

When the contract is on the line, it is found that mechanical labor, bingshi lazy is an idea of programmer virtue, this kind of thing is certainly that can not do their own do not do. However, students who have had similar ideas know that it is really difficult for a person who does not know technology to write a few lines of code to go online if they want the business side to operate by themselves.

And then after a variety of research, found that taobao had a CMS system, can directly online HTML. At that time, it was quite a cross-department investigation. After several attempts by myself, I wrote a conversion guide and a CSS file into a template, which I taught related students to use and handed over completely. This model was later used for reference in other businesses.


With that said, there are two qualities worth settling for:

  1. Not only are you satisfied with your assignment, but you may volunteer to do something extra, even though you’re a simple intern and you don’t know anything.
  2. You can find better solutions from ordinary things.

It boils down to being able to mess things up, and that trait continues throughout the rest of your life.


2. The blood

After a basic adaptation period, the business begins to become familiar with, and then it enters the next phase of hot blood phase, which, as the name suggests, is a period full of passion and enthusiasm.


First of all, let’s talk about the big background. A few months after I joined Baidu, I found that the team still had heavy historical burden. The project was mainly Riot framework development, which was just a small Internet celebrity with outdated jQuery, not to mention modern engineering componentization. As well as the team’s training mechanism for new staff is also a stage to be strengthened.


What did he do during this period? The specific business is not detailed, that is, some Web terminal, mobile terminal development. At that time I felt a lot of things do not like the eye. And then you’re given a certain amount of work in the project, but you don’t have a lot of constraints, so you have a lot of room to mess around. In terms of business, I not only contacted PC terminal and mobile terminal, but also mixed development of HyBird. In terms of infrastructure construction, I also deposited many common components, sorted out the code specifications of the team, and built several scaffolds, including an internal scaffold market according to AntD’s market. In addition, I even played the 3D animation of Three.js, learned the basic syntax of OC, and submitted the code to our iOS client.


In a word, during this period, a lot of things can be deposited based on the existing business, and some cutting-edge things of interest were investigated in advance and contributed to the infrastructure construction.


Looking back, this was a period of rapid growth in skill points. The basic internal commit log is full every day, I don’t get much rest, I get off work or go home on weekends, and I just write code happily. So far, the overtime recorded by the system is completely inconsistent with my daily code submission record. What we did in this period provided a certain vision foundation for our ability to control the whole situation.


To sum up, there are two things I feel good about during this period:

  1. Be proactive and enthusiastic about projects, not just dealing with them;
  2. Focus, although just said to do a lot of things, but each thing is actually a step by step, concentration to complete.

3. The anxiety

Last period probably maintained for more than a year, in fact, there is no clear demarcation, and then entered the next period.


As I became more involved in the business, and gradually changed from a supporting role to a major person in charge, I tried to do everything by myself, which gradually became too much to handle. I found that although I had tamped a lot of things in the warm blood period before, the landing effect was relatively general. More tragically, at that time, my boss left the company and the team changed a lot. At this stage, I was naturally anxious.


The anxiety phase, what do you do during this period?

First of all, it is a process of promoting the implementation of engineering. After all, it was just said that the implementation effect was not good, so we consulted with other teams of the department to make continuous improvement, and finally the whole department was connected. Secondly, some projects began to assume the role of project leader, not only front-end development, but also control the pace of the whole project. And there is a small experimental point, is a slightly simple project, using Node.js as the background, js is entering a new field.


Now looking back on this period, it is actually full of thorns.

I’m sure you’ve all experienced at some point that our lives may not always be smooth sailing, and my perception of this period is that it’s a period of anxiety in my career. For example, I have encountered three classic frustrations:

  1. Due to the prior blood period like playing chicken blood, in a state of running forward. A lot of things are focused on the output rather than the overall quality, so that the accumulated technical debt starts to sink itself;
  2. Team adjustment and personnel changes, so that everyone began to feel confused and lost at work;
  3. I was in charge of a lot of things. After the complicated tasks, I wanted to do everything by myself. Obviously, I was not energetic enough.

Fortunately, I survived the anxiety period, I feel that it will not be long before I get promoted and pay rise, marry bai Fumei, and walk on the peak of my life. I am still a little excited about it.

Getting back to the point, the key to getting out of your anxiety phase may not be what you do, but how you do it and how you look at it, in a nutshell, soft skills. Taking myself as an example, I feel that there are three main points:

  1. For technical debt, through every project review, constantly summarize and reflect, to see their own shortcomings and quickly correct;
  2. For the change of the team, I can adjust my attitude and further influence the students around with a positive attitude.
  3. In the face of too many things, this is actually the scope of time management, there are many articles and books on the market to refer to, my experience is to spend 10 minutes a day to organize my TODO system, prioritize, and then start work.

4. The breakthrough period

The last stage is the breakthrough period, which feels like it started in June of ’19, but is still a current period.


A big background of this period is that they have a certain amount of precipitation in technology, but lack of overall planning. After continuous recruitment, the team began to stabilize, and I also had some energy to think more. In terms of collaboration, I currently play a role of technical management. Of course, I will actually participate in some business development, but I have a higher vision through the accumulation of experience.


During this period, I not only grew up in technology, but also had richer problem-solving abilities. I began to feel better able to deal with daily tasks. What exactly is going on in this period?

In business, I was mainly responsible for sorting out a set of progressive reconstruction schemes for a historic large-scale project, and then I was also a firefighter to participate in the development of a new project due to improper progress control. In addition, I may do some things myself, such as improving the rules and regulations of the team, standardizing the development process of the project, promoting Code Review and document precipitation at the department level, and participating in the infrastructure construction at the department level.


Since this is the current period, there is no turning back. At the beginning, I felt that many things were stable and there were no big challenges. At this time, I remembered a word we often say: comfort zone. What is the comfort zone we’re talking about? Personal comfort zone has two characteristics:

  1. You’re comfortable doing what you’re doing.
  2. You are less exposed to new challenges.

So how do we get out of our comfort zone? We’ve all heard the saying, “Look at the past, and you’ll know what’s new.” Here a little change, is our answer, warm old, and know new.


Therefore, in fact, it is a process of accumulation. For example, in dealing with CI, I know how to deal with almost all the problems I see, but I am still in the state of solving problems when I encounter them, and even a small part of problems just stay on the surface without touching the root of the problems. However, some students just stop and enter their comfort zone.

Here are a few tips for getting out of your comfort zone:

  1. To look at problems in a systematic way;
  2. Trace the source;
  3. More precipitation.

Then send you a word, Hua Luogeng said: reading the best state, first read the book thick, and then read the book thin. In fact, in the process of work is the same.


Now let’s talk about learning new things. As the name implies, it means exploring new areas. Generally speaking, if you stay in a certain environment for a long time, you may feel numb and can’t see the new direction. At this time, you can look at the outside world. Specific, may need to own perception.


In fact, I just talked with you for so long, I feel that I have not broken through this stage, but said that in the process of continuous exploration, I have some insights, and I would like to share with you briefly.

In general, I have experienced several stages along the way:

  1. Adaptation period, mainly ability improvement;
  2. Warm blood period, began to distinguish the pros and cons, a process of forming personal opinions;
  3. In the anxiety period, conflict management occurs when the reality is inconsistent with the expectation, and self-growth is sought in conflict resolution.
  4. Finally, know how to get out of your comfort zone when things are stable.

Tasks such as for work, when the space is assigned, the blood season began to do a self control, at the time of anxious period learned the overall project scheduling, and begin to know and assigned to the other students, in the breakthrough period of time, began to responsible for scheduling multiple purpose, of course, there are some detail level scheduling will be entrusted to other students to be responsible for the follow up.

Basically, it is a process of capacity improvement, to the formation of individual opinions, to the emergence of conflicts, and the subsequent stable process of seeking change. In addition, there are also some changes in the dimensions of personal opinion, business ability, technical design and team collaboration, which will not be described here.


Third, experience sharing


The above self-story has been told, there may be some small review summary for each stage, the students who have the heart may have found that there is also a lot of experience. And then let’s take a look at it, and summarize it and sublimate it, and there are a couple of points that run through all of this.

Direction of 1.

First of all, direction. Maybe you just entered the workplace, sometimes there are a lot of not adapt to the place, will appear confused, can not find their own direction. Or in the middle of your career, you’ve been burying your head in business and feel like you’re not making any progress. You want to try but don’t know what to do.


So here’s a question, think about it, what do we do as front end engineers?


Here is a quote from Wang Xing, who believes that “The Internet has changed all aspects of life, the most important is food, clothing, housing and transportation, birth, aging, illness and death.”

Personally, this is the root of all our product needs.


In order to meet the above requirements, summed up, the product does three main things. Turn offline into online, turn manual into automatic, and turn some tedious into intelligent. Namely electronic, automatic, intelligent.


Then look back to our front end, the front end work, mainly responsible for the product interface, process, data these aspects, he as a human-computer interaction adhesive existence. Split down, the simplest interface rendering, interactive experience optimization, basic business logic development, animation dynamic effect exploration. For better user experience, some services may require multi-terminal support, such as mobile terminal, small programs, React Native, etc. And then in order to improve the development experience, we have mid-stage services that need to understand build deployment, need to coordinate with different people, need to deal with the process of r&d delivery, etc.

Each of these points can be divided down, and there are many, many small points. One point I want to show here is that the front end is not simple, and it is very normal for some people who do not know the direction and do not know what to do.


Personal advice: At the beginning, when you are confused, you don’t need to be frightened by all kinds of information on the market. You don’t need to think about everything and want to do in-depth research on everything. As a new blood in the workplace, many things are different from your cognition. Because it is rare at this time, and there is no numb idea of inertia, you can contact different things first and keep exploring. Then write down everything you don’t like, and when the time is right, everything you don’t like is optimizing space.

Then when you’ve seen enough, you may be able to find a direction you like and dig deeper. In fact, the technical term for this is “T-shaped talent”. You can find the details yourself.


Here’s Steve Jobs speaking at Stanford in 2005: “You can’t connect the dots looking forward; You can only connect them looking backwards. So you have to trust that the dots will somehow connect in your future.”

Although you may not be able to see the future now, at some point in the future when you look back, the dots of your life are all connected, and your present actions constitute your future.


2. Attitude


Perhaps we all encounter some unpleasant things in our work life. For example, if a company has a certain scale and has existed for a certain period of time, it will almost always have historical debts, and there may also be other areas of communication and coordination that you feel uncomfortable. At this time, is the legend, plump ideal and skinny reality is not the same, what is your attitude, different attitudes will lead to different results. So let’s do a little example here.


There are two students, small A and small B, they entered the same company, found that here is still A slash-and-burn era, the boss every day just look at your system has not been online, the company profit. It is a very common scene, and then two students have different attitudes towards them.

Small A: Come in and make fun of it. How can this company be like this? It’s totally different from what I imagined. And then he went out to dinner with his former classmates, and he made fun of them like that.

Little B: He felt that the company was doing well in business despite its poor infrastructure. Therefore, he kept thinking about how to optimize, combined with the actual business at hand, made positive contributions, and discussed planning with his responsible person constantly.

Then the story ends here, assuming that little A and little B are still in the company, what effect their development will be after one year or three years, you can imagine by yourself.


Pattern of 3.

The next point is pattern. Pattern is a vague word, but people with different patterns see different things. So let’s do it as an example.


Let’s say there’s a problem, a phenomenon that most of you might encounter in your business, that pages take a long time to load. And they may see things differently for different people.

For starters, you might think, well, if I write code like this, it feels good and I can’t do anything about it, and I don’t know what I’m supposed to do, and then I put it somewhere that means I can’t figure it out.

For intermediate students, they may analyze from the front-end level and try to optimize the resource volume, or add Loading animation or write a skeleton diagram from the experience level.

For advanced students, he may try to analyze from the whole link. For example, I assume that this is a front-end page opened on the client, from the Webview initialization time, to the front-end resource request speed, interface pull time and other places to see, and promote different roles to help optimize this matter.

For advanced students, he thinks it is not enough to solve this problem after the analysis of optical full link. He may also think about why this problem exists and whether other businesses have encountered it. How to avoid it from the overall point of view, such as adding some development specifications, improve data monitoring and so on.

The example mentioned here may be of a higher level, but all of us may feel different ways of dealing with it. How should we improve our pattern?


We often make fun of ourselves. When people ask what you do, they may say that they move bricks. So here we take moving bricks as an example. Everyone starts their career by moving bricks.


But for different people, he may have different development paths. For example, some people, when they first entered, they were moving bricks. After three years, they were still moving bricks, so they were still the same brick worker.

And some people may be in six months after the invention of the push cart, can move more bricks at one time, after a year to buy a tractor, and two years after building 3D printing, at this time he may also move bricks from the technical director, and then to the level of regional manager.

This example may show that different people can produce different results. When we encounter problems at ordinary times, sometimes we can try to look at the problem from a higher Angle, think about what he would do if he were you, stand to the next height to think, slowly, your pattern should be improved.


4. Soft skills

Fourth, soft skills. When it reaches a certain level, it may be a factor that limits the development of technical personnel. Sometimes, you don’t just need to say how awesome your code is, you might need a little bit of a survival guide outside of code.


Just to explain, what are soft skills?


I did a couple of my own drawings here. First of all, in our daily life and work, in addition to writing code in front of our own computers, we also need to contact a variety of people, to communicate and coordinate, and to deal with a variety of things. How you handle these things well is the manifestation of soft skills.


Soft skills are just a few things:

  1. Ability to deal with interpersonal relationships, namely communication skills;
  2. To deal with the relationship between tasks, how to string them together, namely time task management ability;
  3. How to deal with projects with mixed people and things is the ability to organize and coordinate.

Specific how to improve, there are a lot of books on the market to learn, many of them are truth all understand series, the specific affirmation is to their own continuous practice perception practice. Here is a point stressed, soft skills can not be ignored, but specific how to do, need to experience their own.


5. Replicability

Replicability, this is a word that you probably don’t hear much about, and a specific idea is: you are very capable, after all, only one person is very capable, how do you make your ability transfer to other people, or even transfer from other people to other people.


🌰 : You may think that Code Review is very important. You worked so hard to help the three students of ABC to do Code Review and put forward various opinions and ideas every day. However, if you are a Leader with twenty people, if you watch everyone for half an hour every day, that adds up to ten hours, then you don’t have to do anything else in a day.


At this time, what you may do is not only to make efforts to do Code Review for others, but also to let your ability to do Code Review be copied to the students you Review. For ABC students, tell them that it is very important and how to do it while doing the Code Review. After a certain extent, ABC may have got your true biography. At this point, they can also do the Code Review for A, B, D on your behalf, but this is not enough.


The replicability thing, it should be a recursive process. As a Team Leader, you should not only be strong yourself, but also cultivate other students to become stronger, and have the ability to cultivate other students to become stronger. It’s a little tricky here, but again: you have to train other students to be strong, to have the ability to train other students to be strong.

For example, ABC has learned how to give others Code Reivew. You also need to think about how ABC can teach others to do Code Review. This is called replicability, which may be required when leading a team in the later stage.

Interest in 6.

We’ve listed five points above: direction, attitude, pattern, soft skills, and replicability. There are certainly many other points we need to think about, but there is also the most important one, which is interest.

No matter how strong external support you have, such as a lot of resources, a great team, or how good you have tools, or even how high you are paid, nothing can match your own interest and passion for technology, which is a necessary characteristic to support your rapid growth.* * * *

4. Recommended books


Soft Skills: A Survival Guide beyond Code is a career book for techies, but for those who are just starting out or who are confused, it has the advantage of being comprehensive. You’ll rarely find fitness advice in a career book. Disadvantages: the topics involved are many but not in-depth, but it is really a lot of truth all understand the series, their own choice.

Five, commercial time


Everyone interested or have questions, you can add early chat special wechat Group, or directly add personal wechat (with wechat Codingdreamer invited into the Group, directly add eel little sister wechat).

At present, we are recruiting students of T4 and T5, both in Beijing and Shanghai. Shenzhen partners can wait and see, should be launched in July. Specific introduction can be seen:

Thank you.


This article is formatted using MDNICE