For the thirty-second AMA, we invited three front-end technology leaders, namely “Winter”, the chief Web consultant of Kaikai Bar, “Industrial Ju”, the front-end open source author and technical blogger, and “Da Sheng”, the leader of the Huayuoshan team. We hope that through this special event, we can help you solve “technology-related” and “personal growth” problems.
About the winter
Winter previously worked on browser development for embedded systems, led the front-end team, and worked on front-end architecture. Now he is an educator in the front-end field.
Select questions
1. What stages do you think are involved in front-end technology and how do you measure your position?
Assistant front end (below P4/T2.3) :
You have a good programming background and can express any logic proficiently. You also understand basic algorithms and data structures. You have read a lot of books on front-end technology and have written your own web pages on the side — but only on paper, not on business projects. You’re confident that once you start working on the front end, you’ll be able to put them to use quickly.
Entry-level front end (P5/T2.3) :
You can implement most of the functions and interactions you see on everyday web pages, except for some novel interactive sites. Even if you don’t know how to do these things, you can quickly learn them after reading relevant technical materials. You know how to work with partners on projects, communicate apis to servers, design drafts to designers, and requirements to product managers.
Senior front-end (P6/T3.1) :
As the backbone of the project, you can solve all the front-end problems in the project (not necessarily positive hard) and promote the project forward. In a project team of 5-10 people, you are the first person they turn to when they encounter problems. You can come up with solutions to common problems on the team and use them.
Front-end Domain Expert (P7/T3.2) :
You are recognized on your team as an expert in a specific area, such as tools, data monitoring, frameworks, components, etc. You have a methodology for your area, and you are able to draw appropriate conclusions, whether you build your own or choose an open source solution. You know your chosen open source solution well enough to be able to tweak the code and sometimes submit PR to the open source community. Your boss will consult you every time he has a problem in your field and will rarely overrule your judgment.
Front-end Senior Expert (P8/T3.3) :
You think about the future of your front-end team every day. Every time the business changes, it’s your biggest headache, and you need to rethink the plan for the front-end technology. Your front-end technology is always bringing new possibilities to the business, so you’ll think about what areas of expertise your team is missing and work with HR to find them. You know where your team’s focus is, so have a clear judgment of whether to use community solutions or build your own in each area, and once you get into that area, you can come up with industry-leading solutions.
Senior Expert (P9/T4.1) :
Your technology brings new business scenarios to the company, and the company has new profit points because of your technology. Of course, in addition to the technology itself, you have to combine the resources of many companies and turn them into gold through technology. You are concerned about how to monetize the value of your team, you have a clear plan for your team, and you can always use the right people to generate significant revenue — if not financial revenue, your team’s value to the company is clear and measurable, so you are under pressure from management or shareholders to perform.
2, always feel the front end is not valued ah, how to break the game?
I think it’s much easier to solve the “I’m not valued” problem than to think about making the front end valued and then benefiting from it. In fact, any technical position is affected by time, front-end development time is too short, this is difficult to change in a short term.
3. Having worked in the front end for 3 years, I feel that I have made slow progress in this field, and my classmates who entered the back end during the same period have been promoted. How can I improve my skill level? Is it necessary to learn back-end technology?
I think most of the students who have encountered a bottleneck in their career development cannot solve their problems by learning one more back-end technology. About 3 years, I guess it should be the bottleneck from ordinary engineer to senior engineer. This bottleneck is a kind of role change. Senior engineer is the mainstay of the project, the main force in the front line of the company, and the person who can solve problems.
4. Ms. Winter, I would like to ask for your opinion on the development direction of front-end career and the target of front-end staff. I feel confused in daily work.
This is a big problem. I think career goals can be divided into long term and short term. If you feel confused, you don’t have any short term goals. If you don’t know what a “better front end” looks like, try looking for a target in your company to see how the skills and ways of doing things are different to those of higher-level people.
5. How to learn to relearn the front end? I used to move bricks on the construction site, but I switched to the front end 4 years ago with the recommendation of my friend. However, there is no one in the company to lead me, so I am used to “reading API documents — copy and paste” to complete the development tasks, so I muddle along until now. Always want to consolidate the foundation, re-learn the front end, but don’t know where to start? Current situation is: work 4 years, 4 months work experience!
In my opinion, the process of relearning is a process of organizing. I recommend using the brain map to organize your knowledge. When you can make every level on the brain map highly complete and logical, your knowledge will naturally form a system.
Want to see more wonderful answers from Winter? Click on portal to get to the topic!
About Industrial polymerization
Industrial Ju is a front-end open source author and tech blogger, and author of Farrow, React-Lite, and React-IMVC projects. Currently, I am a front-end engineer, responsible for React, Node.js, GraphQL and other front-end infrastructure construction.
Select questions
1. What skills do you think a programmer must master on the technical road?
The word “skills” rather than “technology” refers to soft skills? This might be a lame question to answer. Just list a list of well-known good qualities and say they are important. If anything, I think there is one thing worth emphasizing — keep faith. Learning technology, or any serious knowledge, is easy to hit a wall. It’s easy to get stuck. It’s easy to get frustrated.
We often fail to install the development environment and write some configurations… Frustration is a daily part of being a developer, and it’s easy to question yourself: Do I have the talent, and am I really suited for this job? This kind of hesitation can make us lose confidence, give up more easily, and get stuck in a rut. We feel like we’re not smart enough for certain tasks or cutting-edge technology.
When we look at it from a factual perspective, we may find that if it takes an average of 20 hours to learn a technique, developers who are less confident will quit and give up in the first 5 hours and not have the tenacity to keep learning. It’s neither good to give up too early nor too late. We may have to constantly learn when to stop and give up, but it’s best not to do it out of self-denial.
Don’t doubt your intelligence. Trust that even if you are average, you can learn over time. Believe that even ordinary people have the opportunity to achieve amazing results.
Learning is a cumulative process. The more you learn, the more abundant your knowledge structure will be and the more efficient your learning will be. The easier it is to grasp the key points and the more you can draw inferences from one example to another. Remember to keep faith, keep learning, realize the original accumulation of knowledge, see the wider world and more confident yourself ~
2, Hello, now is a 2 years of experience in the front end, but to a company is to ask you background management system, other things did not give you a long time down is an Element porter, how to maintain their own technology update and put into production?
Companies often have few options for projects, which can be started from the following aspects:
1. Improve work efficiency on the premise of quality assurance. But it does not shorten the construction period. After the completion of the function, set aside a period of time can be freely allocated. For example, to do partial reconstruction, optimization, technical debt, polishing and improving the project, which is also a way of technical improvement. Of course, use this time to learn/research new technologies. The key is to increase productivity and gain breathing time to improve yourself.
2. Make efforts in spare time to study technologies, make demos, participate in open source projects, share technical knowledge, etc., join in a wider circle of technical atmosphere, and supplement the narrow technical issues in work. At first, it may be difficult to immediately reverse-feed the new technology into the real world. However, as the accumulation of skills increases, there will always be opportunities to hit the ground running. Opportunities are for those who are prepared. Self-improvement during business time is to prepare for future opportunities.
3. React Server Component: Will it bring some technical changes to the front end?
The React Server Component is a feature that enters an important moment in the history of front-end frameworks.
Most developers, at the moment, don’t realize the profound impact it has. Their evaluation of it is mainly a comparative perspective. Compared to the Client Component, it lacks state/effect, introduces more dependencies and costs, and requires a Node.js server. These are superficial understandings. From a so-called first-principles perspective, we can see the significance of the React Server Component.
1) This is a sign that the front-end framework is not just looking at Server as a side-by-side thing to do with SSR, but is starting to explore the benefits that Server can bring to UI development (although not cost free, it depends on the benefit/cost ratio).
2) Streaming CSR support
The React Server Component uses custom JSON Protocol to transmit vDOM /client-js-src/error, and supports streaming. The important point here is that the Streaming client-side Rendering optimization strategy is almost not supported by the front-end framework for a long time. The CSR client renders, often in serial mode.
fetch -> json -> render/vdom -> renderer(react-dom/react-native)-> UI
The React Server Component implements the Streaming client-side Rendering, which divides the above process into parts:
{server: fetch -> json -> render/vdom } -> {client: renderer(react-dom/react-native) -> UI }
It is more efficient to fetch -> JSON -> render/vdom and then the streaming JSON reponse is sent to the client. The renderer on the client side supports Partical Rendering/Chocolate, seeing renders earlier, requesting JS-Chunk modules more promptly, and binding events. It’s like Streaming SSR.
Streaming client-side Rendering can’t be done without the React Server Component. Rather, the React Server Component marks the point where mainstream front-end frameworks officially support this optimization without having to let developers do their own research from scratch.
3) Future-oriented
One of the potential scenarios for the React Server Component is to combine BFF/Serverless to implement BFF Component or Serverless Component. This may change everyone’s development mode and collaboration mode, and provide a React-based micro-frontend Micro front-end solution.
The Next. Js /Vercel team may soon release components that implement patterns like React Federation. Possible approaches are:
1) Component Server. React components developed by different teams are deployed separately as Node.js server
2) Page Server. Rely on multiple Component Servers to render the final page and present it to the user.
You can expect that these predictions won’t be entirely accurate, nor will the React Server Component be the ultimate winner. But its release marks a new dimension of exploration space and competition for front-end frameworks.
4. I would like to ask, as a front-end engineer, how to learn the design ideas behind some tools and frameworks in depth, and how to use their design ideas for reference and extend them to my own tools? How to learn some general design ideas and patterns (FP, CODATA, etc.) in depth, so as to better apply them to daily front-end development?
This can be a natural process, and as we become comfortable with a framework, we often naturally want to understand the ideas behind it.
Go to GitHub to follow the project, subscribe to events like its release, and check out the Pull Request or Issue to see what’s being discussed. Follow official developers on Twitter and read them every time they share a design idea or a piece of information. There is no need to worry about the content. There will be more content indexed between these materials, which may scare us at first, but we can learn it slowly. The core approach is to try to get close to the source of information, to accumulate first-hand data. With the increase of accumulation, there will naturally be reference and expansion, and we will have our own ideas.
As for learning FP, the key is to forget that you are the front end and think about how to learn FP. Reduce path dependence and find FP data for the front end. FP is a separate field with its own introductory classic material. Get closer to the source and get more first-hand information. In the process of continuous accumulation, we will get opportunities and inspiration, and apply part of what we have learned to practical work.
5, would like to ask, to become a front-end architect, from your actual work experience, to have those technical capabilities and grasp those programming ideas.
The title, front-end Architect, has many dimensions of interpretation.
1) Post dimension
A company or department needs to have a front-end architecture group that does tools or services for other front-end engineers. Developers who are technically good on the team, or who are interested in front-end architecture work, may join the front-end architecture group and be able to call themselves front-end architects. This does not mean, though, that they are front-end architects of the capability dimension.
2) Ability dimension
What technical skills or programming ideas do you need to be a front-end architect? Perhaps more important are not factors such as technical ability or programming ideas that can be honed. It’s product sensitivity in a sense. The output of a front-end architecture group is a set of tools or technical products that typically serve other developers rather than C-side clients, commonly known as TODS. Products for developers.
A front-end architect with a job dimension who lacks product sensitivity to toD can create a tool that looks good but feels bad to use. This does not mean that the technical skills of the front-end architect are necessarily better than those of the business front end. They solve different problems.
Competencies of a front-end architect:
1) Have product sensitivity for developers, empathize with developers and find their technical pain points
2) Can think about how to solve or optimize them technically
3) On the basis of (2), it can improve the relevant technical ability to achieve the goal
4) Back to ① In the continuous cycle of steps 1 to 4, the technical skills and programming ideas of front-end architects are naturally improved.
But technical ability and programming savvy don’t automatically make you a front-end architect.
Want to see more wonderful answers? Click on portal to get to the topic!
About the risk
Da Sheng, a graduate of Beijing Jiaotong University, has worked for Baidu and 360 in the past and is currently in charge of kaikaiba’s Web category. As a self-taught career changer, he has valuable experience going from zero to one. With the experience of jumping from a small factory to a large factory, I have summed up a lot of experience to share with you.
1. If I am the leader of a front-end team, how to plan the team?
1) Talk to your boss first to make sure he knows what you want to accomplish as a team
2) Do you pay more attention to business or people? These are the two planning directions. Each business should be divided into several people
3) AS a leader who pays more attention to people, I will classify dimensions according to hard skills and soft skills, such as framework of emergency ability, engineering, algorithm, etc., and soft skills such as stress resistance, communication and execution. I will draw a table and let team members light different dimensions according to their characteristics
4) Divide business directions, draw a tree chart, mark clearly how many people are needed for each node, how many people are needed, red mark is not in place, etc. It seems that I only have these methods, which are rough and just for reference
2. Master Sage, I would like to ask you how to keep a good learning attitude and not be too eager for quick results and instant benefits, because I did experience that haste makes waste, and I always want to get strong positive feedback immediately after learning.
First admit that you are an ordinary person, and then use the learning method to strive for, recommend my learning method.
1) Set a study or reading plan on a monthly basis
2) Play king when you are upset
3) don’t rush to make how many books to read, or see a few frame source code, first set a learning theme, based on this theme to find books, find videos, find information, all the content is for this new knowledge system, don’t fall into the pseudo-diligence
4) Feynman method of learning, with the goal of speaking once
5) I recommend a book how to Read a Book to finish it in a week
6) If you still can’t stand it, I suggest you go out for an interview. If the interviewer insults you, you will be able to calm down and learn
3. Master, how to improve your irreplaceability in the workplace?
So many frameworks and technologies, the mainstream of a thorough understanding of the fact that there is a great irreplaceable, such as componentization, infrastructure, monitoring, performance optimization. I can also take a lateral route, like me
1) Improve their core competitiveness and be able to deal with more problems
2) Start technical management and bring out a good team
3) Groom successors
4) Find their own advantages, play to their strengths and avoid their weaknesses, for example, I like eggs, but also suitable for lectures
4. May I ask the teacher, do we always learn the skills of network and algorithm, and improve the front-end knowledge before learning them?
This is a two-dimensional skill
1) The front-end knowledge belongs to the effective learning, short and quick
2) network algorithm and other basic knowledge, belongs to the important and not urgent things, long term yields high, need to join the daily work Conclusion is to learn, but the front knowledge has been updated in the iteration, each new knowledge learning is very tired, learn the last when you begin to see the source code, you find that the underlying are algorithms and data structures, such as knowledge network, For example, the virtual DOM of Vue and React is the operation of tree structure. Further optimization of this operation, using the longest increasing subsequence to improve efficiency is vue3’s method, and transforming the tree into a linked list is act16+ ‘s method. Ultimately, we need to learn the basics of computer, these are internal forces, so we can learn what we use in our work. The front-end is just a daily learning task of putting algorithms and network programming together, and that’s your core competency in the future
5. How to make career planning in intermediate front end?
I feel like there are a couple of cases
1) If the company and the team have interesting business prospects, they should study the business well. For example, they should start to do infrastructure planning and engineering system construction, take more responsibilities in the business and grow rapidly in the business
2) company and team business uncertainty, such as many students only responsible for the back-end a CMS, the team only two or three people, I suggest put vision in the open source community, began to study popular framework source code, for example vue, the react of framework, the underlying principle of the best practices in these frameworks remember, observes, such as the source code used in the algorithms and data structures, Compilation principle, and so on, to find a book special training
3) The above two cases are recommended to brush algorithm questions, learn network protocol, study the principle of compilation and other computer basics
4) If you are capable, I suggest you study soft skills, such as negotiation and communication
5) Planning is not too far, implementation is the king of personal opinions, for reference only
Want to see more wonderful answers from The Great Sage? Click on portal to get to the topic!