In a flash, three years have passed since graduation, and the old young man has been caught off guard. Standing at the fork of time, a thousand thoughts. Engaged in three years of front-end engineer, this way is how to come, here to make a summary, but also for the novice front-end reference.

Spent a year in a state-owned enterprise

During the university, my skills are not outstanding and my qualifications are mediocre. So that baidu, 360 to participate in the school recruitment are brush. Therefore, after graduation, I entered a large state-owned enterprise like Founder of Peking University. I hope I can learn a set of software development methods from large enterprises.

During this time, I completed the transition from student to software engineer and learned how standard software development processes work. Simply put, it is “stepping into society”.

I’m a front-end engineer. In 2013, SeaJS was already a bit of a celebrity, but we didn’t use it, and the overall development model was primitive slash-and-burn. A jQuery as the base library, the whole site js with <script> tag to import. Back then it was PHP, there was no separation of the front and back ends, the directory structure of the code was organized according to the PHP framework, templates were of course back-end templates.

In terms of compressing code, there was no Grunt /gulp in those days, I remember using a client-side gadget to compress code.

I did all the pages, which is worth mentioning because we were working on both PC and tablet access. So we used responsive design, which was popular at the time, where different devices used the same set of pages. That’s when you start working with Android/iOS WebViews. That’s a lot of potholes.

In order to learn streaming layout, I read Zhang Xinxu’s blog every night. He has many articles on CSS, and I almost read them more than once. Based on what we learned, using percentage units +inline-block streaming layout + media query, our project was successfully compatible with a variety of devices, even though I was a novice. That time is the fastest growth, but also very fulfilling.

But after the fresh period, I soon felt and state-owned enterprises “acclimatize”, state-owned enterprises work rhythm is slow, and I am energetic, is really incompatible with fire and water. For a while I was on fire about the project, but others were unmoved and let the project get delayed and delayed. You should know that in Internet companies, delays are a serious matter, but in state-owned enterprises, it is almost routine.

The other thing that bothers me is that I don’t have anyone to talk to. I was the only one in charge of the front end of the department. As a newcomer to the front end, I was eager to acquire knowledge and often went to the sharing meeting organized by W3CTech. However, there was no one in the company who could communicate technology. I don’t even know how their front end works, whether I’m a real front end or not.

Do you dare to answer a call? I can’t. So I left less than a year later.

A year at a big Internet company

After leaving, my goal is very clear, that is, an Internet company. The higher the work intensity, the better. So he joined 360, which was in the year of tiger and Wolf.

Since then, MY job has been enriched, and I have seen the bigger world and learned how the front end of large Internet companies works. At first, he was led by The Great God Cheng Yin. Later, he had frequent contact with @Mochen and grew up quickly. In particular, I learned a lot of knowledge from the weekly sharing of the Dance troupe. At this point, I dare to say THAT I am a front-end engineer.

The company has a lot of talent and a lot of tools at its disposal. I was just a small front end of the business line and didn’t have the opportunity to build wheels with the big boys. From the perspective of technical framework, I got to know Angular, Requirejs and SeaJS. At that time, H5 games became popular on wechat, and I also got to know how to develop H5 mini-games and learn cocos2D-JS. However, the wind of H5 games seems to have passed. I didn’t go any further into cocos2D.

At that time, there were also some requirements for making pages on mobile phones, so some mobile terminal projects were also made. There was no mature REM scheme at that time, and cutting images required some extra skills, such as the size of the font is written roughly, which looks similar.

MVVM development mode and modular development are two important milestones in the development process of the front end. Fortunately, I did not fall behind these two key nodes.

After I dared to admit that I was a real front end engineer, I started to think otherwise. It was kind of boring to always make a part for a big company. What I am eager to do at this time is to build the front end of a project by myself. So in addition to all the popular frameworks, I also looked at some of the front-end engineering aspects, and Grunt gave it a try.

Once I felt ready, I was ready to go again.

A year in a startup

I joined my current company, an established startup, for very practical reasons. There are two reasons: 1) affordable wages; 2) promising prospects. After all, after two years in Beijing, IT’s time for me to make some preparations for settling down in Beijing.

After joining my current company, I am no longer positioned as a part of a large machine. I need to take more responsibility for the front end of the company, because I am already an old bird. Therefore, my way of thinking must also change. I must understand the knowledge that I did not understand very well before, and now I must consider the problem more from the whole project.

I started taking on interviews and bringing in new people. Always think about how you can use your extra time to do something that will actually add value to the front end of the company.

In terms of technology, I have more freedom to try new things. The first is the large-scale use of MVVM. If angular was just a scratch in the past, it is now being built on large sites with tens of millions of pv. Since our website still needs to support IE6 (mainly for teachers and students), KNOCKOUT, which can support IE6, has been used. With the addition of Requirejs and knockout amD-Helper plug-ins, a modular development framework has been established.

On mobile projects, other colleagues have started using Vuejs, packaged with WebPack. Embarrassingly, I’m interested in both, but haven’t been able to get involved in mobile projects.

I started to promote SASS in the company last year, because I had been typing CSS by hand. Gulp is also used in the build flow to do some of the build work for the project going live.

As ES6 matures, some of our projects are not compatible with low browsers. So some time ago, I started to use ES6 in the project, configure Babel to compile, although now I am not very skilled, but I have to keep up with the trend. In addition, there is almost no jQuery code left in our project.

As for NodeJS, I am also learning about it in my spare time. Earlier this year, I wrote a small project for my team using the Express framework. As for NodeJS, although I think the front end needs to be good, there are very few opportunities to write NodeJS without a project driver.

React is one of the most popular things that hasn’t been used yet, because there are no suitable scenarios and the current framework can meet business needs. Maybe we’ll try again when we have time. Just don’t wait until I use it and realize it’s out of date.

That’s the beauty of a startup, the opportunity to experiment with new technologies. In a word, I still enjoy the present state, busy hands, calm heart, brain plan for the future.

About front-end learning

Found so many years of their own toss or a lot of, they are still on the road of growth slowly forward, the pace of learning can not stop.

If I had to give some advice to the new students, I would be happy to do so. First of all, the front-end knowledge system is many and complex, so bit by bit accumulation is necessary. One habit that helped me a lot when I was a beginner was blogging. Three years after graduation, and three years after starting a blog in the blog Park, blogging is a great motivator for your learning, and in order to accurately express your understanding, you must have a clear understanding of certain knowledge points, which in turn increases the depth of your learning.

In general, this main path should not be offset: native JS, using jQuery and writing jQuery extensions, front-end templates, front-end MVC (backbone), modular development (AMD/CMD), MVVM development mode, redux mode represented by React.

In addition, CSS is also a basic skill of the front end. Some students who move from the back end to the front end don’t want to write CSS. I don’t think it works. So about CSS learning, generally have these enough: using CSS to complete the page, CSS basic principles (see w3c standard documents), SASS/LESS and other pre-compiled, architecture maintainable and easy to expand the whole site CSS. As for some new things in THE CSS world, such as OOcss and CSS Modules, I haven’t studied them yet. These feelings are icing on the cake and can be put aside for now.

Nodejs, however, is not the most urgent need to learn, I see some novice students, JS/CSS is not proficient, jumping on NodeJS, it is a bit of a waste of time. If you can, try nodeJS after learning the front end well.

PS. In addition to writing blog, I am also writing my own wechat public account, the content is some thoughts besides technology, interested students can pay attention to oh: