1. 基础定义
通俗释义:
如果软件研发是开一家连锁餐厅：后端工程师是后厨厨师，负责食材存储、菜品加工；前端工程师就是前厅整体搭建+大堂服务负责人。
搭建顾客看得见的前厅环境，把后厨加工好的数据（菜品）展示出来，保障顾客点餐、浏览、操作全程流畅舒适。
HR视角解读:
产品面向用户的最后一环，用户体验第一责任人。不深耕底层数据库、复杂运算，但直接决定普通用户打开产品的直观感受；同样一套后台数据，前端水平高低会直接拉开产品好用程度、界面美观度差距。
2. 核心工作内容
还原设计方案:
参照UI设计师视觉图纸，用代码搭建页面，保证界面样式、布局和设计标准保持一致（相当于按照装修图纸搭建餐厅前厅）。
实现各类交互动作:
完成点击弹窗、表单填写校验、切换菜单、滚动加载等操作反馈。缺少交互，页面只是一张静态图片。
对接后端交换数据:
通过API接口和后端通信：向前端拉取商品、信息，同时把用户输入的内容提交给后端，完成前后端协作。
多端适配 + 性能优化:
保障页面在电脑、手机、各类浏览器正常展示，不会排版错乱；持续优化页面加载速度，解决卡顿、加载缓慢问题。
线上bug修复、持续迭代:
处理页面样式异常、交互失效问题，跟随需求持续新增功能、优化用户操作流程。
3. 产出物（面试/绩效评估参考）
网页、后台管理系统、H5页面源代码；
小程序、移动端网页、跨平台客户端界面工程；
可复用组件（按钮、弹窗、表格等通用模块，团队“标准化积木”）；
打包完成、能够直接部署上线的静态资源文件；
组件说明文档、前端交互规范。
4. 常用技术栈｜HR通俗翻译语言
HTML 页面骨架 :如同房屋墙体结构，规定页面存在哪些内容：标题、图片、按钮。
CSS 页面外观装饰:负责颜色、字体、间距、布局，决定页面好不好看。
JavaScript（JS） 页面交互核心:赋予页面行动能力，控制点击、数据变化、动画效果。
Vue / React 主流开发框架:升级版高效开发工具，如同预制模块化建材，不用从零手写所有代码；中小企业普遍Vue，大型复杂项目多用React。
TypeScript（TS） 增强版JS:增加代码校验规则，减少大型项目出错概率，中大厂项目主流标配。
Vite / Webpack 代码打包流水线:整合、压缩零散代码，输出可以直接上线使用的文件。
响应式设计 自适应布局:一套页面自动适配电脑、平板、手机不同尺寸屏幕。
Axios 专门用来和后端接口通信:获取、提交数据的工具。
UI组件库（Element Plus/Ant Design）:现成成套界面积木，内置表格、弹窗、表单，大幅节省开发时间。
HR面试&简历筛选实操指南
1. 基础门槛：HTML + CSS + JavaScript 是硬性底层基础；只懂框架、原生基础薄弱的候选人，长期容易遇到瓶颈。
2. 框架区分：确认熟练Vue还是React，匹配团队现有技术栈，降低入职适应成本。
3. 层级判断
- 初级：只会页面还原、简单交互；
- 中级：熟练框架、独立对接后端、处理兼容性问题；
- 高级/资深：掌握TS、打包配置、封装通用组件、具备性能优化、工程化搭建能力。
4. 推荐面试提问方向
① 项目里遇到最难处理的交互场景是什么，如何解决？
② 页面加载慢，你会从哪些角度做性能优化？
③ 怎么理解前后端通过接口协同工作？
