Should I learn node js in 2018

 

Author: Yinging.

https://segmentfault.com/a/1190000012436059

For 2018, I think there is such a direction in front of the front.

  1. Front-end logic layer (including three main frames, webpack, front-end data management)

  2. Front-end interaction layer (Including CSS3, canvas, SVG, VR, etc. and corresponding performance optimization)

  3. Server layer node (i.e. the server field and the development of development tools with front-end)

Of course, it is also possible to develop desktop applications like the Elektron, but I think most of the people who do human planning are still on the web.

First, front-end logic layer

Problems in the Front End Logical Layer Solutions: Front End Rendering Problems. Indeed, different data (structured data, different materials) as you combine the page elements from the back end.

The rendering of the front end is actually template + data = page

1 responsible for HTML.

2 CSS is responsible for the style

3 JS is responsible for the logic

Only the template has no backend data. We can understand the static side, and the three main frames we are currently mainstream with provide mapping between templates and data. In logic layer research, mainly learning and experienced three frames: VUE, responsive, angular

This piece is the main part of our 90% front-end and day-to-day work. It is also a matter of many company interviews to focus on the content. However, the current market is no more, you will have a new framework to achieve a period of time. In the case of a front-end blowout, it is not enough to have a basic knowledge. You have to dig down.

Some of the servings

For example, if VUE + VUEX + VUE router + Axios is similar, there are a number of whole buckets too. To gain an edge in front-end competition, you need to dig deep into the principles of this framework. Research: a. Source code and principle of implementation (theory)

②Install: Webpack + npm / yarn + scampolding (e.g. VUE-CLI) + Sass build part, is actually an area that is easy to distinguish. You learn a little, you can control the changes in the project. Research: a. Configuration of WebPack and the corresponding application scene

③Code specification section .: ES6 + TS + CSS specification, etc. Code specification, not much, the front-end JS and CSS are both designed and rough. If you want to keep a larger project, this is the spec that you can't ignore.

The logical layer part is the front end of our usual understanding.

Second, front-end interaction layer

The so-called interactive layer can be understood as the effects that we often say. Under the current trend, the mobile browser performance is gradually improving. A big trend in the future is the effect of the development of the front-end development and infinitely approaches the original effect.

At the same time, some large factories were also set up in advance, before the arrogant four-party Tmall purchase of H5 Taobao buildings - How do you do the Friends circle H5?

If we need to get the lead on this wave of waves, you need to learn beforehand. Perhaps even after three years, the ability to develop special effects on the front end will become standard.

Can be seen in three parts

1. Render Effect Learning: Many students are not special effects, but do not know what to achieve. The different things that are used in front end drums and eventually came out, but the effect is hard to see. No, run special effects, you should adjust the effects first. It is recommended to learn Adobe Effects (AE), intuitive look at what is like, and then translate the front end movement.

2. Related math / visual principles: A. Bessel curve principle b. Papers C. Damping Formula

3. Realization of related technical means The front end currently realizes eight kinds of animated effects http: //www.offcn.com/it/2017 / ...

①gif: Directly from GIF, frontend

2 Frame-by-Frame animation: CSS3 Step Attributes or JS production frame animation

③css3 : transition / transform / animation

④svg: SVG is very suitable for cell phones

⑤canvas: canvas is suitable for great motivation

⑥flashTurn Canvas: I don't know

⑦video: tags with H5 video

8JS animation .: You can work with the API (gravity sensing etc) to develop more complex motivation

Third, node service layer

Knots shouldn't be known before the front end. It should be these use of scenarios in the actual use of nodes:

1 as a front-end construction aid In various scaffolding there is often node participation

2 Rendering the level as a server: implement interface merge and template rendering

3 as a full server: In general, in the entrepreneurial company, you can create all of a person's web functions. Like WECHAT public account etc.

So if you want to learn, where do you start from? Learn a new technology, my personal path is to quickly translate the original document first, then learn the framework.

Don't look at the original, it's easy to learn a set of frames that is a study. Learn local knowledge, let yourself learn the frame speed.

Usually used in the context of:

①express

②koa

3 derivatives that are based on the above

4 frames remaining

I recommend a newbie to learn the explicit framework. Reason is simple, easy to learn, more, more tutorial. I personally want to learn the node frame, is that Tmall's Egg.js.

Recommended reason is

1 Major Factory Development, Projecting

2 With the test of double eleven, the quality is guaranteed

The front end is an engineer, all characteristics depend on the customer, therefore all colleagues of the front ends, in addition to the above functions or more attention to the change of browser and mobile environment. Some similar HTTP2 protocols, PWA, OpenGL and other technologies are always possible to change the front end working mode.

I've listed so much above, in fact I never learned (manual dog head). In addition to technical skills, perhaps the following comprehensive functions, it also steers towards the front end.

1 Self-planning functions: Findings for trends in the technical area as well as personal corresponding learning programs

2 Fast learning ability: search functions (with all kinds of knowledge on the Internet), knowledge migration functions

3 Communication skills and knowledge output functions: Due to the product as well as the backend with the community