作为一名做过全栈和纯后端开发的程序员来说，当今AI时代前后端职责越来越糊，很多公司甚至裁掉前端，只留后端，这就要求我们必须会点前端，增加核心竞争力，以面对AI时代日渐严峻的就业形势。
具体原因，我总结了以下几点：
AI冲击
纯切页面、调接口画表单/列表的前端，被替代最快；前端在转全栈，后端也在转全栈。AI 能帮你生成页面，但你看不懂就改不动、也验收不了。岗位墙变矮了，很多JD（岗位介绍）要的就是能闭环交付的人。
中小公司
管理后台、内部工具经常没有专职前端或者已经裁掉前端，需要后端顶上。
个人OPC
一人公司更没得选：没有前后端分工，必须会全栈，才能自己把MVP（最小可行产品）做出来、尽快验证需求是否真实存在。
联调效率
前端说字段不对、分页对不上、结构不好用——你若完全不懂页面怎么消费数据，来回扯皮，半天耗在沟通上。出BUG也分不清是接口问题还是渲染问题。
成本
多招一个前端，或者为一点页面改动排期等联调，都是真金白银。后端会一点，很多需求自己就能收尾，人效直接上去。
会点前端，不是让我们去卷动画，而是：能看懂、能改、能自己顶一版简单页面，接口设计时也知道调用方要啥，也能清楚前端处理逻辑，不至于什么都留到后端处理（很多前端啥都想后端返回，一问就是前端做不了）。
先分清：和传统 MVC 不一样
MVC 是后端返回模型，.cshtml 用 @ 语法解析数据再输出 HTML，属于服务端渲染（SSR）；现在主流是SPA（单页面应用）——后端返回JSON，页面由前端组件渲染，一个页面会打多个接口。
你不再 return View(model)，而是 return Results.Ok(dto)；页面不是 .cshtml，而是 .vue / .tsx。
总所周知，前端有三大框架
-
Vue：上手快，模板接近HTML，国内岗位更多，中后台很常见，双向绑定语法糖写起来爽飞 -
React：JSX写UI，生态无敌，全球用户和开源项目最多，但是单向数据流setXXX个人认为不好用 -
Angular：后端设计哲学，我也试了试，整体偏重，学习曲线陡峭
我是熟悉Vue和React，这里来看下两者是如何处理数据的：
Vue核心：ref 存数据，双向绑定，改数据视图自动更新；常用 v-for / v-model 绑列表和表单。
<script setup>
import { ref, onMounted } from 'vue'
const list = ref([])
const keyword = ref('')
async function load() {
const res = await fetch('/api/products?kw=' + keyword.value)
list.value = await res.json() // 赋值用 .value
}
onMounted(load)
</script>
<template>
<input v-model="keyword" @keyup.enter="load" />
<ul>
<li v-for="item in list" :key="item.id">
{{ item.name }} - {{ item.price }}
</li>
</ul>
</template>
记住：
list.value = xxx改数据；模板里直接写list，不用.value。
React核心：useState 存数据，单向数据流，必须setXxx 更新；请求放 useEffect（需要依赖项，更新副作用）
import { useState, useEffect } from 'react'
export default function ProductList() {
const [list, setList] = useState([])
const [keyword, setKeyword] = useState('')
async function load() {
const res = await fetch('/api/products?kw=' + keyword)
setList(await res.json()) // 用 setter 更新，直接改list不生效
}
useEffect(() => { load() }, [])
return (
<>
<input value={keyword} onChange={e => setKeyword(e.target.value)}
onKeyDown={e => e.key === 'Enter' && load()} />
<ul>
{list.map(item => (
<li key={item.id}>{item.name} - {item.price}</li>
))}
</ul>
</>
)
}
Vue 偏模板声明，React 偏 JS 里写 UI；本质都是：状态变 → 视图更新 → 再调你的 .NET 接口同步。
思考
前后端分离还在，但边界没那么硬了。全栈不一定更轻松，薪资待遇可能不变或更低，而且往往更累，但很多岗位的真实需要会点前端，这样才能扩大找工作的范围。
相关文章
