篇一：小爝 - 如何推动基础架构项目落地
基建经历
前端工程化 ===> 前端统一开发环境 ===> GUI 工程化环境 ===> CI/CD/Docker 服务
如何建设基建团队
需要什么样的人
爱折腾、善于总结、乐于分享、代码涉猎广泛、能够抽象归纳总结、沟通推广
需要做什么样的事
埋点、UI、jsBridge、SDK、打包上线、自动化测试、CI任务编写、各种管理平台、测试后台、新技术调研与应用、业务组件迭代、node 框架落地
需要掌握什么技能
语言层面不设限、开发领域（前后客户端）不设限、项目管理 UI/UE
需要什么性格的人
激进派？保守派？相互配合、换位思考
项目基建落地方法论
- 脸皮厚：主动推进，坚持不懈
- 亲耕策略：参与业务开发，体会业务痛点，基建有导向，减少试错成本
- 轮岗：参与不同工作内容，在实际中发现问题
- 奉献精神：勇于承担脏活累活
- 同理心：换位思考，真真切切有效用
实际案例
Nodejs Web Framework
Express JS ===> Koa ===> DARUK(ts、1.0开源)
使用 TS 避免低级 bug，规避语法层面问题
Web 服务两条线：Request way、Server init
基建链路：CI/CD 触发 tag 脚本驱动上线 ===> Docker 容器滚动代码更新 ===> 日志链路追踪 ===> SDK/中间件 ===> 业务代码标准化
Hybrid Release System
一个搞定 APP 和 Hybrid 离线包关系的系统（详见知乎live）
APP 启动时从 PHP 服务器拉取 Hybrid 配置 api
Gitlab CI/CD
Pipeline + Nodejs Cli + CI Lifecycle
搭建流程：CI server 服务器通过申请 Gitlab group token 与全组项目关联，项目中添加 gitlab-ci.yml 就可以出发对应 pipeline 中的 stages
CI 运行分析：CI-runner-script 是集合所有 CI 任务能力的 npm 包，即包含很多 plugin；包可以获取 git 信息，解析源码脚手架配置文件，从而驱动包中的不同 plugin 执行各种任务，即检查代码、上线等
Scheme Data Center
Scheme 的文档，案例，测试自动化
FE Statistical
性能，错误，业务等基础监控搭建
应对劫持前端能做哪些事（详见知乎）
Universal framework
编写跨端差异性代码
总结
- 落地必要条件
- 基建与业务的关系
- 团队意义
篇二：堂主 - 如何推动前端团队基础设施建设
理解技术基建
业务支撑 & 技术基建
业务支撑是当下，技术基建是未来
基建的意义
- 解决实际问题
- 团队练兵
- 梯队建设
- 影响力建设
- 闲时练兵、战时亮剑，基建应基于解决实际问题
基建搞什么
研发流程闭环
开发准备阶段 ===> 编码&联调阶段 ===> 调试优化阶段 ===> 构建部署阶段 ===> 上线后数据采集&分析阶段
体系方向
- 开发规范：编码规范、命名规范、流程规范、权限规范、安全规范
- 基础资产：Node 工具、Web 工具、物料体系、DSL
- 研发流程：协作模式、解耦分层、面向接口、去依赖
- 工程能力：应用管理、领域解耦、单人单应用全流程控制
- 性能体验：加载效率、渲染效率、人机交互体验、用户感知引导
- 统计监控：异常监控、数据采集、响应时效
- 安全防控：代码合规、包安全、XSS、CSRF
- 质量保障：单元测试、UI 查验、链路测试
基建的目标
为业务赋能：提效、体验、稳定性
基建怎么搞
- 规范 & 文档
- CLI 本地工程套件（架构）：差异抹平、自动初始化、重心分离
- 可视化工程辅助（GUI、架构）
- 项目工程管理（架构）：项目创建、项目开发、项目发布、数据分析、环境依赖
- 组件工程管理：组件管理、组件创建、组件发布、量化统计
- 模板工程管理（架构）：模板归纳、模板开发、模板发布、页面创建、环境依赖
- 物料体系结构：规范层、工具层、基础层、业务层、应用层、量化统计
- CI/CD 构建部署（架构）：CSS lint、JS lint、死链接、合规检测
- 可视化搭建（结构、部署流程）：外部服务、搭建服务、路由服务、反向代理、多型支持
- 性能检测（架构）：针对业务设计检测模型、图片体积、懒加载；基础层、服务层、网关层、应用层、运维
- 数据埋点：PV、UV、链路统计、用户画像
基建之外
- 解决问题，从场景出发找方案（不是为了做而做，跟随业务成长）
- 业务阶段匹配性（不同的业务阶段会匹配不同的团队能力和产出）
- 初创期（0 到 1）：满足一般功能
- 起步期（工具化）：前后分离解耦、编码/联调/提测/选型等局部规范、单点工具/脚手架涉及/构建部署
- 快速发展期（工程化）：标准化、自动化、系统化，工具串联等
- 成熟期（智能化）：云端化、集成化、产品化
- 打破职业思维惯性：帮助业务解决问题，为业务赋能；不止于用户界面层 ===> 网关/应用/领域/技术设施
- 技术的价值，在于解决业务问题：业务架构、业务支撑、流程/制度、基础设施
因为你，什么会变得不一样？
篇三：Scott - 如何在人单力薄时立项推动基建
提效降本的基础就是基建
基建三要素
- 基建的真正价值：提效、降本、成长
- 研发实力 = 研发模式 + 工程师能力 + 基础设施
- 基建难点皆为现状，终点皆为管理
- 基建再高大上，也要有目标和节奏
- 基建也是项目，没有度量就没有共识
基建三难
- 判断与决策难：做不做、做什么、怎么做
- 共识与授权难：不给人、不给钱、不认同
- 实现与推广难：无大牛、无方向、无方案
定位：基建与前端团队的关系
什么是基建
广义：一切有利于研发效能提升，直接或间接助力于业务开展的能力建设皆为基建
Eg：技术方案、文当沉淀、技术培训；UI 组件、业务模板、集成框架、规范约定、Mock 工具、打包服务等等等
团队的生命周期
- 人肉时代：点式思维，个人视角
- 工具时代：线面式思维，团队视角
- 工程时代：面体式思维，部门视角
- 智能时代：生态思维，公司与行业视角
基建与团队的关系：稳、快、强
摸底：问题与场景的识别方法
- 从问题点归类出发
- 复盘现场
- 从现场到方案终局
- 从方案回到人头流程
- 从流程到团队基本面：开发、打包、推包、发布、上线
- 点状问题 => 线状思考 => 面状方案 => 体系化诊断
- 基于点线面定夺做事节奏
选人：如何提升团队基建氛围
- 高频 Review 代码：代码 review 是基建中的基建
- 中频技术分享
- 低频职责调整，能力意愿是基建选拔标准
推进：基建到底如何立项开发
- 获得授权之前形成有效判断
- 团队的技术现状
- 行业的参考对象
- 团队问题的识别
- 组织业务的了解
- 基建价值的衡量
- 做事节奏的理顺
- 有数字，量化结果，事实不可逃避
- 有优先级，规划的价值-基建紧迫性
篇四：芋头 - 大搜车大前端基建经验分享
核心基建介绍
应该有的
- 脚手架：工程规范、持续集成配合、常用工具集成
- 开发框架：简化复杂度、项目标准化
- UI 资产：抽象兼容性、设计标准化、开发提效
- 基础环境：开发和运行时、基础环境管理
- 客户端：客户端核心组件
- 基本服务：开发必备相关服务
日常沉淀
- 前端基础库：抹平三方平台差异、封装方法和最佳实践、开箱即用
- 开发工具、客户端基础库、Nodejs基础库、可视化
感悟
- 从日常痛点中积累：有积累意识、对复用敏感
- 主动挖掘业务痛点：为业务赋能，突破项目本身为更多业务场景赋能
- 适当时机打造正规军：正确理解基建团队职责
- 边界试探强化团队价值：从为前端赋能，到输出完整解决方案；了解行业动态，映射团队现状和未来
典型项目介绍
- 基础组件：差异抹平、UI 设计标准、主体能力、业务组件管理
- 社群生态服务：微信生态、直播生态、底层能力
组织架构探索
- 养成不断调整队形的习惯：脱离了业务场景不存在“架构”
- 基础设施逐步成熟后更多考虑对业务的直接影响
项目管理的探索
技术项目管理
- 立项方法：长远规划、调研、分析需求方案
- 推进方法：开发前确定产品、技术、迭代方案，管理上项目制
- 运营方法：文档/手册/站点/分享，生命周期、里程碑运营
- 规范和管理：里程碑分解，应该是功能产品的不断迭代优化，而不是割裂的独立模块
总结核心关键
- 贴近业务、商业、行业
- 组织架构保证
- 有意识的沉淀和积累
- 项目立项推进方式保障
篇五：崇志 - 如何设计大型前端团队的基建整合
前端工程化之路
- 混荒时代：前后端耦合、没有本地开发环境、依赖后端开发环境
- 工程化时代：前后端分离、开箱即用、完善的本地开发环境、接口管理平台、数据埋点统计、云端构建/部署
- 前端基建与工程化的关系：前端基建 ==整合==> 工程化 ==目标==> 提效
前端开发全链路中包含的基建
项目初始化 => 本地开发 => 接口联调=> 数据埋点 => 构建发布 => 性能监控
包含基建：代码管理、框架体系、组件体系、可视化搭建、本地开发服务、接口管理、字体图标、图表体系等
跨项目加载 view：微前端
接口 host 隔离、css 样式隔离、通用样式本地化、目录结构约定、组件共享、资源按需加载等
总结
工程化就是将散落在各个点上优秀的基建串联起来形成体系
若有收获，就点个赞吧
0 人点赞
