美团前端架构简介

受 一鸣师哥之邀，今天下午去他公司介绍了美团前端架构，顺便和可爱的工程师们交流一下，同行的还有同事 弥城. 根据师哥要求，除了讲前端的部分，还介绍了一些美团的开发流程以及前后端协作开发的两种方式. 分享的内容粗枝大叶，要做的事情还有很多，这里整理一下演示文稿，希望对感兴趣的朋友有用.

　　在谈前端架构之前，需要先探讨一下不同人群对前端产生的困惑. 前端这个职业最近几年才逐渐被认可，之前一直是低端的代名词，所以多数高手很不屑搞这个. 之前的很多项目，人们对前端这块的要求也只是能用就行，所以很少会在上面去细致、深入地建立一套完善体系. 而多数产品的技术经理也会是后端出身的，往往对前端的认识还停留在Java Struts那个原始的MVC模型上，或者首先想到的就是GWT和JSF，这是从后端角度出发的一种视角.

框架层面：近几年前端发展很快，前端之所以叫前端因为前端是已经可以独立成为一种职业了，js也不再是十年前的玩具了，以前富客户端RIA的应用可能会用flash/flex或是silverlight，现在可以使用js来完成大部分的功能，因此js作为一门前端的支撑语言也不仅仅是进行的简单的编码，越来越多框架性的东西出现了.

构建一个数据平台大体上包括数据采集、数据上报、数据存储、数据计算，以及数据的可视化展示等几个重要的环节. 前端数据采集与上报是整个流程中最重要的一环，只有确保前端数据生产的全面、准确、及时，最终产生的数据结果才是可靠的、有价值的. 美团点评对于前端埋点的要求很高，总结起来主要有三点需求：第一是数据的准确性和及时性，数据质量的好坏将直接影响依赖埋点数据的后端策略服务、与合作伙伴结算、以及运营数据报表等等.

每个页面的html标签要指定lang属性，. 采用定位的时候，将css去除，查看内容的阅读顺序是否符合有意义. 页面中必须包含一个title元素，并且不应为空. title中的内容应该少于60个字. title应该包含网站名字和页面的主题.

update：2019.06.17更新2.4文章链接. 2.1、自建Gitlab. 2.3、自动编译发布Jenkins. 3.2、以应用为单位划分前端项目. 3.3、基础组件库的建设. 3.8、登录系统设计（单点登录）. 3.11、多端共用一套接口. 我在2年之前，写过一篇中小型项目的前端架构浅谈.

前端，现代前端分工变得越来越细致，页面制作、JavaScript框架设计、组件插件、交互设计、工程化脚手架等，项目中前端的占比也越来越高，继而出现了BFF (Back-end for Front-end 服务于前端的后端)，这一切的助力离不开各大浏览器厂商的厮杀. 周末来跟大家分享大型组织中（前端工程师的人数开始超过15人）前端管理架构，主要涉及的是团队协作，如何让团队运作更加高效规范.

本文介绍最近几年美团MySQL数据库高可用架构的演进过程，以及我们在开源技术基础上做的一些创新. 同时，也和业界其它方案进行综合对比，了解业界在高可用方面的进展，和未来我们的一些规划和展望. 在2015年之前，美团（点评侧）长期使用MMM（Master-Master replication manager for MySQL）做数据库高可用，积累了比较多的经验，也踩了不少坑，可以说MMM在公司数据库高速发展过程中起到了很大的作用.

本文根据美团基础架构部/容器研发中心技术总监欧阳坚在2018 QCon（全球软件开发大会）上的演讲内容整理而成. 美团的容器集群管理平台叫做HULK. 漫威动画里的HULK在发怒时会变成“绿巨人”，它的这个特性和容器的“弹性伸缩”很像，所以我们给这个平台起名为HULK. 貌似有一些公司的容器平台也叫这个名字，纯属巧合.

根据产品设计需求，配合后台开发人员实现业务页面，维护及优化前端页面性能；. 学习前沿前端技术并进行实践和分享，参与制定前端开发规范并推进执行；. 熟练使用各种 Web 前端技术，包括但不限于 HTML(5)/CSS(3)/JavaScript(ES6+)，熟悉前端开发规范和 W3C 标准；. 熟悉 Vue 或 React 等 MV * 框架技术栈，至少掌握一种前端项目构建工具；.