初级前端2023年总结与思考

概述

大家好,这里作为一个初级前端开发工程师来和大家讨论讨论我2023年做前端开发的总结/思考/迷茫/规划。 希望能帮助一些入坑前端的新人,也比较迷茫,也希望前辈大佬给一些建议。 我将从以下几点开始说说。

  • 个人背景
  • 2023年技术&&成长(技术栈/成长回忆吐槽)
  • 项目经验(项目比较有意思的点分享)
  • 迷茫想跳槽(不涨薪倒扣补贴/纯拧螺丝/瓶颈)
  • 思考(生活/发展)
  • 2024年规划期望 在这里感谢一直善待我的领导和同事们,还有一开始太忙不想要我的前端导师。

背景

  • 22届三本科班生。
  • 22届应该是最惨的一届,三年疫情大学,网课大学生,自己也是学渣,所以选择了自学前端。
  • 21年亚信科技实习前端,毕业后22年8月在某边缘云服务提供商工作(校招,P4)至今(领导说年初准备晋升P5,感觉像画饼),虽然对这家公司诸多不满,但他也让我成长了很多。

技术&&成长

技术栈会很多,但是不精通,是比较痛苦的

技术栈

前端有很多细分的领域,我这块基本都是做WEB开发的(什么牛马都能做得)

  • 自学前端:
    • HTML/CSS/简单JS/ES6/
    • Vue3/Vant/ElementUI/Vuex(学的时候还没有Pinia)
    • Npm/Axios/简单webpack
    • 开发H5项目。
    • 微信小程序/UniApp
  • 亚信实习:
    • Vue2
    • ElementUI
    • vue-template-admin
    • Node/Express
  • 某边缘云服务提供商(2023年成长最大的一次,下面简单说一说技术栈,到后面的项目经验中会分享到使用场景)
    • Vue2全家桶/Echarts/Nuxt2
    • React/Antd/Datav/Mbox/UmiMax/Procomponents
    • Ejs/JQuert/Bootstrap(移动端适配)
    • 微前端(singleSpa,qiankun)
    • 工程化webpack/vite,node/js脚本(不是很熟悉,但是做了这个事,就要说出来~)
    • CICD/Docker/Nginx
    • Git(实习的时候只会简单的add,commit,push,pull,在这家多人开发会rebase/reset/cherry-pick/merge/show/log等等等~)
    • 一些杂七杂八没用封装的npm库
      这么数一数自己好像会的还挺多,为什么工资还这么低!!!!!!!!!!越想越气

成长

为什么说这家公司给我带来了巨大成长,可能因为也是公司有完备的机制,分开发成长和人情世故两点随便摆摆。

开发经验成长

  • 完备的开发上线流程

我在第一家亚信,是在外包做联通项目,几个开发和一个经理(按他们说,经理就是一个说嘴的)。需求开发基本是后端去对接,对完了和我前端说怎么做,开发完自己测直接打包上线,流程很简陋。

而在现在这家公司有一个一个完整的/比较规范的开发流程,这个就让我有了很大的成长,开阔了我的眼界。懂了什么是敏捷开发,大概流程如下

  • 需求评审/文档
  • 排期
  • UI
  • 开发
  • 测试
  • 代码review
  • 提单上线
  • 上线回归

我之前在的初创和外包是没有这样完善的流程的,导致刚来这个公司的时候虽然有实习经验,但是也是菜的不行。

  • 恶心代码中成长(炫技/滥用/烂封装/过度封装),如果不想听我吐槽,请跳过

我能进这个公司,也是因为这个项目的前端被裁了。是一个P7/P6(前端开发专家/资深前端开发)的存在。代码恶心归恶心,但在其中也学会了很多用法。说一说恶心的点。

  • 代码没规范(据说开始外包,后面收回)
  • 代码反人类设计
  • 组件二次封装,封装了寂寞,没有任何附加功能,把element原有的api都封装没了(怀疑为了完成代码KPI)
  • 组件过度封装,二包组件再包二包组件,套娃,功能套个寂寞。
  • 滥用Mixins,全局到处是Mixin文件,一个大Mixins套四五个小mixins,小mixins套Vuex,,明明Vuex一行代码可以访问的变量。他硬是让我翻了五六个文件,维护起来据恶心。
  • 代码Bug层出不穷,不错错误处理,去维护排查,痛苦不堪。
  • 一直迭代了五六年的项目,相关文档少之又少,加上上面所说的问题,简直是屎山巨无霸。感觉之前看亚信一个五六千行的vue文件都是小事。
  • 业务比较专业复杂,他是一个web安全方面的,可能自己吧功能开发完成了,都不知道是干上面用的。

虽然吐槽了这么多,但在他搞的乱七八糟中自己也学会了很多高阶的东西,自己看代码,处理问题,使用工具等各方面都有了很大成长。希望下一家不要有shi了

人情世故成长

本来是想说公司同事离职/被裁/不能转正等等等的事,还有导师领导不会主动教你,要你自己主动去学去问什么乱七八糟的事的,这里突然不知道说啥了,反正感谢我的同事们,帮我解决了很多问题,让我有了很大的成长。

项目分享

我手上的项目会有七八个项目,主要迭代比较频繁的会有两三个(官网/用户平台/运营平台)。这里说一说我觉得比较值得分享的。

  • 官网

官网有两个一个是用Ejs写的,奇怪的项目之一(公司有很多奇怪的项目,起这个项目的兄弟都不知道怎么启动)一个是Nuxt2来完成的,算是一个比较新的项目,这个项目现在是我来做。

  • Nuxt服务端渲染
    • 静态渲染(也就是把每个页面打包成单独的html文件,达成seo的目的,开始的做法,展示的内容不是接口最新的,鸡肋)
    • 服务端渲染(这里使用了Docker+PM2来做的,这里虽然消耗服务器,但是比上面的鸡肋问题好)
  • 移动端适配
    • 这里采用了Bootstrap4+Jquery来完成的,大概基本是配合bootstrap的css和flex布局完成适配,少部分使用bootstrap的组件。因为这个项目之前大部分是外包的回来的,所以有些代码丑的不行,也写了大量的媒体查询。
  • 用户平台

用户平台就是我吐槽了半天的那个迭代了五六年的项目。讲一些比较有趣的东西。

  • 五六年的老项目,几千个vue,js文件,短时间如何做国际化?

    • 国际化首先是用的I18n这个插件,也是比较常用的库,比较简单,有兴趣的可以去看一下,大概就是你有了中英文的翻译,然后用$t函数翻译就好了。

    • 那么多页面文件,短时间如何做?手撸?好在之前那个P7大佬留下了一个Node脚本,用来解析Vue/js文件的中文。可以帮我们做翻译(虽然他的代码很屎,但是还是挺牛的)。我这里大概讲一下思路,如果你有兴趣,可以私聊我。

    • Node脚本大概思路是文本解析JS文件,Vue文件则用vue-template-compiler这个插件来解析内容,用正则表达式匹配出中文内容,并把中文替换成 <math xmlns="http://www.w3.org/1998/Math/MathML"> t 函数并写入文件,就完成了对 v u e / j s 文件的 t 函数并写入文件,就完成了对vue/js文件的 </math>t函数并写入文件,就完成了对vue/js文件的t改造。同时把中文放到一个文件中,调用百度api去进行一个翻译,弄出一个英文的文件,这样就有了$$t的中英文件,就可以翻译了。但百度翻译不一定是我们想要的,这个时候我们就要手工去校验和修改了(繁琐的工作,但是总比手撸强,因为脚本翻译完词条有三四万条呢)

  • 老项目重构

    • 这里要保证老项目能够正常迭代运行,同时又要新架构迭代开发。重构采用了UmiMax/antd/Procomponents/qiankun微前端那一套,按模块慢慢进行重构,也是当前正在做的一个内容,这里是我的导师主导在做,我跟着学习做,也学到了蛮多东西,如果你想学习Umi,可以看我的主页有相关的教学,再更新中。
  • 运营平台

这里运营平台也是个老项目,采用了 Vue前端模板框架--vue-admin-template,他的权限做的很好,你可以访问github搜索他,他有相关的权限设计教学。

迷茫想跳槽

跳槽是涨薪最快的方式,但又面临着很多问题。

先说想跳槽的原因吧

  • 工资低(根本原因,校招工资),不涨工资,补贴也没了(房补)
  • 辛辛苦苦干了一年,本以为努力就会得到回报,但是没有,很失落,没期待。
  • 公司基本CURD的业务,而且业务很专业,代码很烂,经常被恶心,已经没太多成长空间了。
  • 被裁风险?虽然前端有时候饱和,有时候缺人。但在业务线目前比较忙,核心业务,暂无被裁风险。
  • 公司福利差,公司虽然不打卡六险一金满额,但也仅此了。春节端午中秋过年过节什么都没有,但凡发个红包也好。吐槽聚餐,没有报销,占用周末时间,要么领导请,要么aa醉了。
  • 前端地位极其低,没有发光发热的地方,做的业务也很普通,存续,就是不能让公司发大财那种。工资堪比保安大爷。

迷茫

  • 迷茫原因干了一年工作,快过年了,一分钱没存到(想一想买车买房装修,结婚酒席五金一钻生子养育)
  • 前端很杂,学到什么程度才能拿到高薪?天花板是前端组长?
  • 上述的一大堆技术栈,我会的很多吧?除了vue用的非常熟练,但是其他的类似webpack架构之类的,虽然都能够解决业务问题,但是比如一问到原理,遇到进阶的东西,真的不会啊,学不完。。。
  • 继续前端开发?学后端开发,从零开始?考研?考公?考事业单位?
  • 跳槽能不能找到比这家好的?看了掘金的面试,都是原理?我只会curd?
  • 头好痛。。。。。。。。。。。。。。。
  • 喜喜睡吧

思考

我的生活和未来发展如何选择?

从生活角度出发

  • 社交

2023年也算是22届工作的第一个年头。出了校门进入社会,好像除了同事,好像基本社交都变少了,更何况是女朋友这种东西。除了以前认识的,基本零社交了。在老家本地的还好,还有一些社交,可是去了外省,一线城市,是不是都两点一线?但是在老家薪资又好低。

  • 刚毕业就被催婚?和上面社交好像是同一条
  • 上班像坐牢?

不是我喜欢的工作,但是我又不会别的。

  • 暂时想不到别的了。

从发展事业出发

  • 打工永远翻不了身

这是我打工这一年悟到最深刻的一条,但是我除了打工好像也不能做别的。

  • 创业/副业实现财富自由

之前做短视频来着,但是发现自己又没精力去做视频,后面又放弃了。

想过创业,但是做什么,擅长什么?这些都是很头痛的事,最近突发奇想,既然不知道创业做什么,不然就做个关于创业的app吧。市面上的创业app都是大公司创业的什么案例,我搞什么摆地摊,小卖铺的创业app。,不过也只是自己的幻想。

2024年规划期望

  • 多读书,读书计划是我开始迷茫的时候开始的。最近读了一本觉得还不错,俞敏洪的《在对的时间做对的事》。
  • 不涨薪或没晋级机会,年后找机会跳槽,背八股文,继续找前端工作,学后端。
  • 出去旅游一次,散散心
  • 尝试找副业!!搞钱!!!

结尾

最后年底了,希望大家心想事成,年终奖翻倍,涨薪!涨薪!2024顺顺利利。

相关推荐
GISer_Jing9 分钟前
React跨平台
前端·javascript
qq_544329179 分钟前
从0学习React(4)---更新组件状态setState
前端·学习·react.js
@山海@15 分钟前
React 中的无限滚动加载数据实现
前端·javascript·react.js
掘金安东尼44 分钟前
上周前端发生哪些新鲜事儿? #382
前端·javascript·面试
Easonmax1 小时前
【HTML5】html5开篇基础(5)
前端·html·html5
_斯洛伐克1 小时前
关于vue2+uniapp+uview+vuex 私募基金项目小程序总结
前端·小程序·uni-app
zpjing~.~1 小时前
uniapp中h5环境添加console.log输出
前端·javascript·uni-app
wang_book1 小时前
uniapp学习(002 常用的内置组件)
前端·学习·微信小程序·小程序·uni-app·node.js·vue
Yz前端知识1 小时前
为什么vue加载select大量数据会使页面造成卡顿
前端·javascript·vue.js
yr10192 小时前
XSS(内含DVWA)
前端·xss