Writing in the front

Recently, many of my friends wanted to switch to front-end development, and they came to me to ask me about front-end positions and give them some suggestions. Some haven’t graduated yet and are confused and nervous about the social beatings to come. Others have been working for two or three years and suddenly decide they are not fit for the job and want to find another career. Choosing a career isn’t about what it can do for you, it’s about what you can become. In this article, I’ll give you some insights on the front end and a guide to getting into the pit, hoping to give you some more references and advice on your career plan.

In this article, you will learn:

  • Front end engineer position development and analysis
  • Development prospects and money at the front end
  • How do you choose your current career plan
  • The front end of the learning route is three steps

This article is for the following people

  • A fresh graduate majoring in computer science
  • You want to switch to front-end development

About the front-end development position

Many people for front-end development is full of all kinds of misunderstanding, think is to write web pages, cutting map, nothing great; A few years ago, some visual web building tools and platforms appeared in the market, can be released with a button, directly generate the effect of the web page, some people said, so, front-end development is not to lose their jobs? Has front-end technology reached a bottleneck? Is the front end going to be full and so on… These questions are often asked by people who don’t understand front-end engineers and front-end development. First of all, back in the days when front-end engineers were called “web designers,” they literally wrote HTML and CSS styles, and occasionally turned on Photoshop and cut images. Second, the front end of the real development engineer shall by no means is the application or artificial intelligence can replace jobs, in the past ten years, great changes have taken place in the front-end technology, in those days “web designer” never expect, front end can also do the backend work, can also develop across the APP and desktop applications, almost can play most of the development of post, Thus came the era of the “big front end”.

Are front-end jobs filled?

Despite what others say, I don’t believe that the front end is going to saturate over the long term, but there could be a shift in the definition of “front end” from traditional “web designer” to “Web front End engineer.” First of all, for example: in 2019, the number of active accounts of wechat small program reached 1,202.5 million, and the development of small program once became one of the hottest technology direction and front-end positions, and wechat is not the only one making small programs; A technological change, the emergence of a new framework, or the release of a tool can lead to a new crop of front-end jobs. Since the birth of front-end positions, the division of labor between UI and back-end is more clear. UI can focus more on visual design, while the back-end is liberated from the front-end and puts experience into business processing and data operation, which improves work efficiency and reduces communication costs. With the continuous pursuit of user experience, front-end complexity is also increasing. Generally speaking, according to the current market, the demand for front-end jobs will not be saturated, but will continue to increase.

“Outlook” and “Money”

In my eyes, the foreground of front-end development will be more likely to be subdivided into fields and specialties. There will be more professional fields related to the front-end, and it will gradually integrate with the back-end to become the full stack. Speaking of salary level, the current national front-end development salary level is about 11K, of course, this is mainly driven by first-tier cities; In first-tier and second-tier cities, the average salary of a fresh undergraduate can reach 5-8K, 1-3 years of experience can reach 10-18K, and more than 3 years of experience, the average salary can reach more than 20K. Front-end developer’s average wages throughout the software development professional direction, or more handsome, the higher the technical level, the higher the wage, from big platform survey results, as well as the friends around me, wages relationship with diploma is not particularly big, the specialized subject graduates can also achieve the average wages.

How do you choose your current career plan

Career planning this thing is too broad, my bad tone to teach you what, in any form in this I only talk to you I do it, planning a thing actually nothing else, is constantly to make a choice, most difficult, and this is the choice of the present, a lot of people can not plan their career direction very well, don’t know what to do, It’s all about the choices you have to make right now. When making a choice, there is a very bad thing called “hesitation”. The choice is always the only one that seems to have many choices at the beginning and has to be made in the end. I recommend a mental tool called “endgame thinking,” which is to work backwards through your final goal to get to the choices you need to make in the present moment. For example, if you want to become a leader in a certain industry, it is not difficult to infer what abilities, knowledge and resources are needed to achieve this goal. Then compare what is missing and make up for it. Endgame thinking is finding the final lighthouse, and then looking at the present, adjusting direction, slowly sailing toward the lighthouse.It’s easy to find that this mental tool is suitable for all situations of decision hesitating.it’s a great tool for both personal and corporate development: you can make a choice in the present by thinking clearly about an ultimate goal and slowly working backwards to the present.

How to learn the front end more effectively

If you’re ready to be a programmer, be prepared to learn for a lifetime, and learn effectively. Technologies and frameworks evolve so quickly that new ones arrive before you understand the old ones, and continuous, efficient learning and experience accumulation are the norm for programmers.

Keep code amount

The same goes for programmers. If you don’t have enough code, you’re not going to be able to develop. The amount of code at work depends on the project, so it’s also important to have project experience. For students who are about to graduate, they can keep a certain amount of code every day by brushing questions. You can also gain experience with practical projects such as building a blog or website, which can be a plus in an interview. Keeping your code volume not only improves the quality of your code, but also gives you experience in writing code. When you encounter a problem, you can quickly locate the cause of the problem and find a solution.

Watch less hyperactivity

A newbie on the road, usually buy introduction to the development of related books, or find some online video case, I don’t recommend to do so is not these things is not good, but when you are reading a book or watching video, it is easy to fall into a myth, is the sample code is read, start work when the whole meng, don’t know how to write. If learning to program just reading a book or watch video, never begin debugging, not had built environment, argue with bugs out, then you are always in the way of introduction, programming books or video just tools in the learning process, understand the doesn’t mean you have learned, you learned to do not represent the actual development, there is no problem.

Don’t be a closed door

Unless you have the ability of self-study that is stronger than ordinary people, otherwise must avoid this kind of closed study by all means, stroll technical community more, pay attention to the technical communication with others, learn others’ code realization more, encounter the problem that cannot solve really, can consult others. If possible, it is recommended to attend more offline technical networking events or developer conferences. This is a great way to learn about cutting-edge technology, improve your skills and meet some industry leaders.

Instead of writing a Demo, let’s do it for real

No amount of sample code will ever benefit you as much as a real project, and it’s not a good excuse to say that you don’t have any real projects to work on outside of a corporate job. Example code is often far from the actual business scenario, not to mention complex, and you never know what will happen when the user does something, nor can you predict all possible bugs from the code. Build your own product, launch it, serve a small group of users, and iterate over it. You can always find value in having a direct conversation with your users. Your code can directly impact your users. What could be cooler than having the power to make your product your own, rather than the company’s project?

The front end of the learning route is three steps

Front-end development is a low entry threshold, but advanced difficult positions, here will be this learning route is divided into “basic”, “advanced”, “advanced” three steps, if you are from zero entry front-end development, then this route may be helpful to you.

Basic: HTML+CSS+JS

Learn HTML (Hypertext Markup Language) tags, familiar with the new features of HTML5, learn to use various tags to present web content, including text, images, audio and video, and programs; In the web2.0 era, you must learn to use DIV +CSS for layout. Of course, HTML is not enough. It only provides the elements of a web page and determines the skeleton of a web page. CSS3 is the current style version, it was born in 2001, you need to learn to use CSS style properties, with HTML tags to achieve UI effects and effects. Learning JavaScript enables your web pages to implement functionality, interaction, and business logic. For the basics, you need to learn: JS data types, object-oriented programming, basic keywords, instructions, use of functions, JSON, use of Ajax, native DOM manipulation, event capture, bubblings, proxies, new ES6 features, and more. Learned the foundation, doesn’t mean you can be engaged in front, learn the foundation, is not enough, a good front end engineer is feed project, if you read the front recruitment job requirements, you will find that no company is the need of the development of native JS, and even a few years ago the JQuery framework of the fire, now also can not see almost.

Front-end advancement: Front-end engineering and three major frameworks

The emergence of front-end engineering, completely changed the traditional development mode, make the front formed a set of development system and the workflow, development process, tools and technology stacks and standardization, on the one hand, in order to improve the development efficiency and reduce development cost, on the other hand can make the front independence, have their own a set of software development. To get ahead, you’ll need to know or use various libraries/frameworks, build/management tools, CSS/JS modular development, etc., which is especially important for developers. The idea of front-end engineering advocates modularization and componentalization, which can be understood as splitting large projects into modules, each of which is independent of each other, with low coupling and easy development. In addition, the version management based on Git for multi-party development greatly improves the development efficiency. Most front-end projects and related frameworks are based on these three frameworks, such as Uni-App (Vue), Taro (React and Vue), etc. Advancement does not require mastery of all three frameworks, but understanding and being good at using more than one of them.Angular was first born in 2009 as angularJS. Compared to the popular JQuery, Angular’s biggest feature is the change in development mode. For example, it adopts the backend development mode — MVC, modularity, dependency injection, etc. This framework is widely used in Google products. Angular is an easy framework for beginners to get started with, but there are many difficult concepts to understand. Second, Angular has less documentation, and problems are harder to document. React was released by Facebook in 2013. Although it started later than Angular, React is much better than Angular in some features and performance. For example, it supports ES6 syntax and uses functional programming. React is fast and compatible, and even runs in Internet Explorer 8. The only downside is that it’s not a complete framework and requires ReactRouter and Flux to build a complete application. React was first supported by Ant Design and later supported by Vue and Angular. You can learn from these frameworks and learn from React. Vue is the most popular and easy to use front-end framework in China. Most of the derivative frameworks and component libraries are also written based on Vue. It uses React and Angular features for reference and makes relevant optimizations. React also has a componentized architecture and a well-documented architecture. For starters, it’s recommended to get started with Vue first. Once you learn one of these frameworks, you’ll find that the other two frameworks do the same.

To the next level: Find your own path

You’ll see that the front end can do more than just Web development, as shown below:Find suits own development direction is each front-end engineers should think the problem, the front-end technology development up to now, a whole stack front-end each side can complete the whole product development work, you can develop your own products, and then released online, continue to update the iteration, slowly let oneself become can acquire the engineers; You can also provide your own solution to a problem and open source it. For example, you can write your own component library. You can also go in other directions, artificial intelligence, data visualization, etc.

Write in the last

The front-end, as the closest profession to the user, focuses on beauty and interaction, and more on user experience. We will find ways to optimize in order to reduce the size of a packet, and also try to improve the loading speed of a few hundred milliseconds. Front-end development requires you to have a rigorous and meticulous attitude, do enough preparation before development, fully test yourself before submitting tests, develop good coding specifications, write notes where necessary, and reduce the maintenance cost of the code. Writing code is a technical work, but also an art work, when encountering problems, give priority to self-solving, develop the ability to think independently and solve problems, and ask others questions if it is impossible. It’s all about development. It’s all about getting ahead of your peers.