preface

This year is the 10th year since my graduation. I started my career as a front-end. Title has always been the front-end. All the time, when people ask you what you do, AND I say front end or full stack, they say, oh, page! Heart inevitably some lost. The front end is a resource-based role, which is not deep enough to understand the business in cognition, and is usually responsible for a wide range of business areas, so it is difficult to accumulate and precipitate. If you ask a JAVA driver who graduated 10 years ago, he will talk about distributed architecture under heavy traffic, and the front end will probably be the same as yesterday’s lunch discussing Vue versus React, or angular. How to break through, how to provide more value to the business, front-end has been struggling to find. There are many articles on the Internet, giving people inspiration, but each person faces the environment, responsible for the different business, not necessarily applicable. Combined with their experience in ali Cloud in the past few years, also make a summary.

Version 1.0 – Tools & teams

This year is my fifth year to Ali Cloud, never thought that will stay in a company for so long, more did not think THAT I can in a post precipitation 4, 5 years. I just joined the Ali Cloud Console team, mainly responsible for cloud shield console, DRDS console, etc. During the development process, I found that most of the scenes were “forms” and “forms”. In order to avoid repeated development, simpleForm and console CLI scaffolding were encapsulated. – The new development console can be finalized with one click (this scaffolding was still asked by people last year how to use it… Also enduring). At this time, I also started to build an IDE, visualized UI view, but limited to the energy and the direction of the team at that time, and VScode was not so popular today, did not try, more regret. However, do WebIDE this point, is planted in the heart.

Later, due to the adjustment of organizational structure, I was independent from the console team, responsible for the operation direction of the website at that time, and began the difficult process from 0-1 component team. At that time, the business was relatively simple, mainly: Ali Cloud official website, Nodejs on the official website and cloud market business. Since the console team mainly uses AngularJS, it feels expensive to get started. When building a new team and I can make my own choices, React becomes my first choice. At that time, Vue was not mature, and the only choice was React. At that time, Def was still in the 1.0 period. In order to stabilize and reduce the development cost, it was natural for us to do plug-in development on XEF. In combination with our own business characteristics, we divided the response template and customized the development cycle. Later, due to the xEF1.0 upgrade to 2.0, our tools were unstable and changed very much, gradually making our engineering system independent, which led to the DBL (then called “bang”).

When I reported it to my boss, he didn’t think the name was elegant, so he chose a name with more connotation — it’s so hard to remember that I can’t even remember it now. At this stage, we did a lot of technical attempts, the team members were very helpless and painful, but also very passionate. We have been optimizing the team infrastructure. With Dawn’s middleware based pipeline design, we can say that engineering has been achieved to a relatively high level. In the future, no matter how much WebPack is upgraded or new packaging tools appear, it will have little impact on us. The future-oriented model lets us only modify the kernel, without user awareness. The new engineering plan also actively with ali cloud other team communication and communication, before the wind chi and Release also reached a consensus as ali cloud unified construction tool to promote, but the landing is not very good. At the same time, the new plan also fully follows the group’s standards, with taobao a big team seamless docking. Another benefit: Dawn isn’t limited to React, you can use any framework; Dawn is not limited to Redux, you can use any data management you like, in fact we have mota, Mobx, GraphQL-Apollo and more. Dawn connection: github.com/alibaba/daw…

After talking about engineering, we should talk about componentization, which is an unavoidable problem, but it’s also a difficult process for us. For 15 years, we used ANTD (open source), but with a layer of business encapsulation on top; Later, Fusion became popular. After communicating with UED and considering the unification of the group, fusion (open source) was used for a period of time. In the end, we chose to build our own component library, which was a very frustrating move. The specific details are not listed, but one of the important reasons is that our front desk business needs “ali Cloud’s own design elements”. After a long time of team construction, APS component library has been used as the foundation of the team to build the library, on which business components and business solutions have been built.

In addition to messing around with the traditional front end, I’ve tried to do a lot of cross-stack things. In the business I am responsible for, due to the “end” business is true, we are more “full stack”. Front-end students do the full stack, to tell the truth is not good — most front-end students in the framework, operation and maintenance deployment or less experience, more consideration is related to the presentation layer. On the full stack path, since we are responsible for the core transaction link, we do not use the familiar NodeJS and choose the same language as the back end, Java. Making this decision, in fact, is quite difficult, and there is a story. There was a system originally, the front-end student wrote it with Nodejs, but because the business is very complex, plus the front-end has always been a resource bottleneck role, one person to do the work of three people, so the student finally could not handle, quit. Such a system has become the back end to connect can not be connected, the front end “no manpower” to connect the situation, very embarrassing. Since then, it has been decided to use Java directly in business systems.

On the full stack path, we have two main strategies:

  • Big front – end write part of their own business Java
  • Use the Serverless agent to configure the transfer function in a unified manner

Large front-end write Java, ali Cloud in fact very many front-end have already had this ability, I also have independent development of several systems from 0-1 online, distributed deployment and support internationalization experience. After doing this for a while, it turns out that nodeJS is actually more efficient than Java.

Using Serverless through the proxy unified configuration, some people in the community have mentioned Graphql for a while, and they are interested in it. By the way, they know that the backend data can be converted into the format required by the front end through the proxy, which is very attractive, and they suddenly plunged into it. At the same time, I also made Nodejs version to popularize the team members, and made Java version demo to popularize the back end. At the same time, I learned that the B2B Mbox platform was similar to what we wanted, so I asked them to share with us. However, because the whole business system was built on their platform, it was risky, so I decided to build the agent platform by myself, which is also the background of the “cloud Query” platform. Cloud query is mainly led and promoted by the war front. It has achieved good influence in the group, and many BU departments have shared it. In terms of business, through cloud query, we realize the operation and deployment of applications, the transformation of business logic and interfaces, and automatic capacity expansion. In particular, the marketing system, with the cooperation of Yuance & Yintian and Zhanfeng, has achieved a relatively large efficiency improvement, and supported Alibaba Cloud’s Double Eleven last year. The details of the cloud Query article can be found in another of my articles.

After a long period of development of cloud query, we have gradually sunk it as a basic capability, growing different “light applications” on top of the serverless cloud query to support different vertical business scenarios. For example: visual construction domain “page cabinet”, based on permissions & roles in the background solution “Flex” and so on;

Remember I said 5 years ago THAT I wanted to do WebIde and didn’t get started; Two years ago, we saw that other cloud vendors had WebIDE, but we did not succeed due to business pressure. This year, we have finally started a little bit. We have been working with the students of appStudio to build our Dawn and cloud query on the basis of appStudio, so as to create a cloud integrated and one-stop RESEARCH and development experience.

Through the above technical infrastructure, we have built a good foundation. Business layout corresponds to the building of teams and organizations. From 0 to 1 in the past few years, the team construction, to xx a on-the-job students at present, has formed four echelon, three 3 business direction & a technical architecture direction, along the way, the water is deep feeling of tour management, most of the time not to say that you take the more the better, I read a book recently mentioned a word “emotional maturity”, this is very important. A good technical and business player may not be able to manage a team well. He needs to adapt to the requirements of different roles at different stages. The most important thing is to keep a sense of danger and keep learning continuously. In team building, manager and leader need to be distinguished. Especially in the business team, we prefer to be the leader to lead the business, rather than just do performance management.

2.0, that is, in the past year, under the guidance of business thinking, the owner took part of the business, and made use of horizontal technology to get through and horizontal business thinking, and got some results, and then entered 2.0

2.0 Business thinking – drive business empowerment from a lateral perspective

We usually divided into the groups of people: one word, | fonts, T type, + model. The front end is the font team, responsible for a wide range of businesses, and the front end is a very scarce position, recruitment is very difficult, so the bigger the plate, the more obvious resource bottleneck. The typical problem of a “one-character” role team is that they do not have a deep understanding of the business, and the results of marketing construction and visualization from the technical level are not satisfactory. So if you think you can’t look down, there’s a ceiling, and there’s not a lot of examples of how to break through. I am writing this summary with some of these insights, hoping to give you some input to help you think.

“One word” although from the business point of view we didn’t have enough depth, but from the professional skills to see us is the standard font “|”. After 10 years of development on the front end, the language, framework and tools have gradually become stable, and the performance of various ends is becoming more and more smooth. The ecology is very active, and any difficulties you encounter believe that the community has a mature solution. 10 years of rapid development of front-end ecology, also verified that we have a very strong learning ability, 7 days a framework, 3 days a database estimate is not too difficult (slightly exaggerated, but the expression is such a meaning). The front end directly connects with customers, and the sensitivity to customer experience, the sensitivity to process data, and the perception of business logic process are the root of our survival, as well as our unique ability, which we can’t lose.

There is a saying called: full warm thought lust, not quite appropriate, let’s compare. We have become a “scarce resource” because of our deep cultivation in the front end. As the tools improve, the front end also wants to use technology to empower the business. How to empower? What stands in front of us is consciousness. In marketing, among the five elements of cognition, demand, brand, category and price, “cognition” is the most important. For example, Alibaba is engaged in e-commerce, Tencent is engaged in social networking, and Baidu is engaged in search. Bat has continuously laid out its main business areas, built a huge ecosystem, and made many attempts. However, it seems that the success rate of ecological investment based on its own genes is higher. So we want to empower the business, the bottleneck is “you cut the page” also want to empower? Good good experience, improve the effect is not good? In my opinion, “experience and efficiency” is the core ability of the front end, which is also the goal of my life’s efforts to achieve. Frankly speaking, we cannot solve the resource bottleneck immediately, after all, now graduates are applying for algorithms, AI, artificial intelligence; We can’t do a round of experience improvement; It’s a long process. However, it may be more practical if we can identify problems from a business perspective and help solve them with technical means, and precipitate platforms to cope with the ever-changing needs of the future. As TL team, in addition to professional give students the ability to “|” type deep, also more hope with team students gain more business sense. Leave the business to talk about technology, talk about Taiwan is a castle in the air; Away from the front end of the business conversation, you are doomed to reinventing the wheel, and this low level of reinventing is happening, and it may last for a long time.

For a long time, I have been trying to abstract and merge the breadth of our “one-line” business, hoping to form “lines” from “points” to form the overall “surface” solution. There are four major directions in the business I am responsible for:

  • Website & Marketing — for the Long Tail
  • Commercial process background -for secondary
  • Core sales process – Core competency layer
  • Sales, partners

Official website & marketing: mainly includes the acquisition of customers, activation, conversion, retention of several nodes, to build efficient “people”, “goods”, “field”. For a long time, ali Cloud content maintenance, marketing promotion is based on the group CMS. Traditional big ways that promote the venue, CARDS, front-end operation edit content after digging holes, tao is the ali cloud “goods” and has a larger difference, in addition we have no investment, choose the system, lead to the big contributors to this simple human operation way, there are many disadvantages such as high efficiency, reuse and can’t be a personalized, not enough data process monitoring of fine and so on. In addition, the construction of the “release” ability is not enough, and there is no way to do precise marketing content release for fine people. In order to solve these problems, the front-end team and PD started to promote the construction of a perfect marketing system last year:

  • On the basis of the original goods, the concept of “marketing goods” is constructed. The more abstract “cargo” and visual online configuration pulls real-time prices and inventory directly. Through the dawn of our 1.0 tool construction, the development process is opened up, making the entire development link consistent, and the cost is lower. Can be abstracted goods match specifically for goods to create a UI view, the formation of the scene capability precipitation.
  • Build the architecture system of ACE(Alibaba Cloud Experience), get through the construction system, and get through all kinds of “markets” through technical downgrade, so as to better carry the delivery of marketing commodities.
  • Through the exposure, click, transformation of the whole link scene, as well as the accumulation of the final transaction of commodity information and other data, the user portrait is generated, and the content scene scheme is provided (accurately show the products or information to users in different scenes) to improve the positioning of “people”.

Commercial commodity allocation: The above reference to “marketing goods” refers to “basic goods”. At present, Alibaba Cloud basic commodities are mainly divided into “public cloud commodities” and “technology export”. For a long time in the past, we preferred to build the capacity of public cloud, and only began to gradually integrate into the proprietary cloud system at the beginning of this year. In the commercial system, our secondary needs to configure the selling rules and prices, and define the commodity model; At the same time the constraints between complex specifications are extremely complex. We still have a long way to go to improve the strong experience of the input and output of commercialization. In combination with this year’s proprietary cloud project, a class of products will be aggregated from the way of template, simplifying the steps of commodity model configuration, greatly improving the efficiency of configuration and improving the experience.

Sales & Partners: I just started to build a team in 2015 (the front end team is all referred to here, not the business team). The core KPI of the big department is revenue, the number of users of the first purchase, and the middle and long tail customers, which achieved a very high market growth. Later, the scope of the team cover was continuously expanded, and we also took charge of the sales & partner system, and built our own sales CRM system centering on “marketing”, “business opportunity cultivation”, “business opportunity transformation” and “contract performance”. The business of toC is usually easy to understand, after all, we are also a member of C. This experience of toB, combined with the training course of business no.1, made me understand the core of the sales system. In addition to tools, what I want most is solutions and the enrichment of product capabilities.

With an overview of the business in each direction, we return to our topic of integrating resources & architecture to provide business enablement with horizontal advantages. In order to analyze the commonalities between them, after many discussions, we finally gathered the big picture of our business process (the schematic diagram after external desensitization) :

From the larger picture of the process, each branch ultimately relies on a “selling capability,” a selling capability

  • In marketing, it is manifested in “popover buy(reduce jump out, direct purchase)”, shopping cart (multi-product cross-purchase, data algorithm recommendation), package (multi-product package sale), and pick-up certificate (the ability to separate ordering and production);
  • The performance in the sales link is “product configuration list”, “purchase order”, “CTO price calculator provided by CBM to key customers”.
  • In commodity commercialization link is the ability of “template” configuration list

In a large group of children to find the common business “selling ability”, after a period of time more consumption of resources, time-consuming chimney development, abstract out of the sale of the core support layer – Zijinque. In this layer, we are positioned as the middle platform of the business, and the front layer is also the field category of the big front. The only thing to point out is that we are using Java, no nodeJS, no other difference. The final structure is as follows (desensitization, details omitted) :

With the new architecture, we have reduced a lot of front and back end communication, such as the “distribution procurement market” that would have taken 1-2 months to develop in the traditional way, but we did it in 2 weeks. The new architectural model, for the foreseeable future, will support a variety of new marketing approaches, as well as sales and partner “solutions.”

I would say that without a horizontal view of our full business, our abstract solution would not be as universal, which is the advantage of the front end team. Without a big front-end stable technology ecosystem, we wouldn’t have a chance to do business enabler. This is the future of the front end, the use of horizontal advantage integration, combined with a field to do deep and thorough, the formation of vertical depth, to provide value for the business, but also let our technical solutions “targeted”. The front end is often around a point to do the requirements, get the tools, but cannot provide a solution because there is no business attribute; Only by combining business characteristics and doing a good job of precipitation can tools become platforms to release more value.

3.0 To explore technology capabilities to add value to the business

The core of “cloud computing” is to solve the cost problem of enterprises, obtain super computing and storage capacity at low cost, and obtain the capacity of flexible expansion under high concurrency. Cloud computing offers many concepts: IAAS, PAAS, SAAS… Compared to the front role, the motion sense is not very strong. But the appearance of BAAS brightened the front end. Try to think about it. In the past, we needed a large number of applications developed in the background, but gradually all of them have settled into the domain capability, providing BAAS services to the front-end. The front-end no longer needs to consider deployment, operation and maintenance, but only cares about the business code. At present, there are many companies providing similar services in the market, such as Leancloud, data analysis, and news push. So, will Baas be the spring in front? We’ll see.

Let’s talk about the status quo. At present, Aliyun is probably Buy In Aliyun. What we sell are IAAS layer resources, and the core business process of users is still based on their own RESEARCH and development system. In the front end of this deep field, based on the cloud to create a “cloud one-stop research and development process”, the enterprise front-end into: Work In Aliyun or Dev In Aliyun. Through the decomposition of the enterprise front-end life cycle, the entire process is hosted by WebIDE:

1. Create a code associated with Aliyun

2. Dawn, the front-end build tool of Ali Cloud, serves as the basic build capability, which can customize the middleware (Webpack, Lint, Server, Mock, etc.) and the build stage(init, dev, test, Publish) built by the team; Provides unified specifications based on engineering capabilities and provides initialization templates for different application frameworks.

3. After clicking publish, the code will be compiled automatically and published to CDN.

On top of this basic process, we provide serverless related capabilities. By invoking BaaS domain service capabilities, and FaaS gateway trigger capabilities, we can actually complete one-stop, front-end led application development.

Remember I mentioned earlier about our Serverless application, “Cloud Query,” where we are gradually sinking capabilities into serverless base capabilities. Almost every company has a marketing construction system. In the past, the construction methods were not diverse enough, and they mainly relied on CMS ability to develop by themselves. With the extension and diversity of various “end” capabilities, marketing construction has become more and more complex. And we based on the “cloud query” precipitation out of the “page” building system, can completely use the “cloud one-stop RESEARCH and development process” to provide good SAAS services. This is our advantage, and “cloud front end solutions” are only suitable for us. This is just one scenario, but there are many more.

The general feeling is that the spring of a cloud with the help of serverless front-end has arrived. It is the best way to grasp our core competitiveness and simultaneously find problems in the business and push forward to solve them across the end. You asked me what I do, AND I… I am Ali Cloud CPO (chief page son ah)

Ps: Ali cloud intelligent business in Taiwan & Ali communication recruit P6-P8 front end, welcome to hold. Base can be Beijing hangzhou, Hangzhou work in the beautiful Xixi park oh. Next to each other are UED girls & test girls. [email protected]

Author: Ali Cloud senior front-end technology expert city

The original link: https://yq.aliyun.com/articles/695361?utm_content=g_1000049154