跳到主要内容
极客日志极客日志面向AI+效率的开发者社区
首页博客GitHub 精选镜像工具UI配色美学隐私政策关于联系
搜索内容 / 工具 / 仓库 / 镜像...⌘K搜索
注册
博客列表
JavaScriptNode.js大前端java

前端三年复盘:从迷茫摸索到互联网工程实战

前端职业生涯三年回顾,记录了从传统软件企业到低代码平台,再到互联网公司的完整技术演进路径。内容涉及 CSS 布局实战、工程化体系搭建(Webpack/SSR)及 Node.js 应用,同时分享了面试技巧与职业心态调整经验。从 Java 背景转向前端,经历了工具链对比、自学补强、团队协作冲突到独立承担核心模块的过程,为开发者提供了从入门到进阶的实战参考。

小熊软糖发布于 2026/3/22更新于 2026/6/1920 浏览
前端三年复盘:从迷茫摸索到互联网工程实战

前端三年复盘:从迷茫摸索到互联网工程实战

2022 年 1 月,我正式踏入职业生涯。每当看到浏览器中运行的网站、手机里流畅的 APP,或是点击按钮后转动的 loading 图标,都会想到这些产品背后凝聚着无数开发者的心血。既期待能成为创造数字世界的一员,又难免担心技术储备是否足够,会不会被身边优秀的同事远远甩在身后。

起步与转型(2022 ~ 2024)

我的职业生涯始于一家颇具特色的企业。原本以为会从事移动应用或网站开发,没想到公司专注于打造一款独特产品——我们开发了一系列可复用组件,配合自主研发的拖拽式平台,能够快速搭建 Web 站点。这种模式与后来流行的低代码平台颇有相似之处。

作为一名 Java 工程师加入公司后,却发现实际工作内容与预期有较大差异。当时还不了解前端开发这个概念,只是困惑于为何很少接触 Java 开发,反而需要维护各种组件。初期内心十分抗拒,既没有相关技术储备,又担心长期从事前端工作会导致 Java 技能生疏,更忧虑职业发展路径的偏离。

随着对前端技术的深入探索,我逐渐发现了这个领域的魅力所在。Chrome 浏览器提供的强大调试工具、Sublime 和 VS Code 等现代化编辑器的流畅体验,与 Java 开发中 IDEA 那种修改代码后需要漫长重启的繁琐流程形成鲜明对比,更加轻量高效。这种愉悦的开发体验,让我逐渐转变了最初对前端工作的抵触情绪,最终不仅接受了这个方向,更开始享受其中的乐趣。

这是一家规模很小的创业公司,办公环境简单明了。由于公司产品以客户端软件为主,版本发布节奏稳定规律,员工们保持着朝九晚六的作息。印象中,整个任职期间仅有一次加班到晚上 10 点,工作氛围轻松,鲜少感受到压力。

总觉得安逸会消磨竞争力,在这种想法的驱使下,我开始考虑跳槽。通过梳理日常工作内容,我发现自己从事的工作其实有个专业名称——前端工程师,于是便将这个职位作为新的职业目标。

第一次内推机会来自一家名为鱼无极的公司。面试经历让我记忆犹新:原本以为日常工作涉及的技术已经覆盖前端领域,信心十足地前去面试,却遭遇了滑铁卢。面试官提出的 CSS 布局问题让我措手不及——需要在纸上画出一个圆形图片和右侧文字排版的实现方案。由于平时工作中主要使用现成组件,通过组件 API 来调整样式,这种需要手写 CSS 解决实际问题的场景完全超出了我的经验范围。

不出所料,这次面试以'回去等通知'告终,但也让我清楚地认识到自身技术上的不足。

这次失利让我意识到自己在前端领域的知识储备严重不足,于是决定暂缓求职,转而开始系统性自学。我采取了多种学习方式:研读前端专业书籍、分析 H5 模板站的实现原理、在技术社区研读大牛的文章。

在学习过程中,我发现一位博主的前端技术文章质量极高,恰好他的签名栏附有一个微信联系方式。大佬带我入圈,为了达到入群要求,我专门注册了 GitHub 账号并撰写了几篇技术博客,最终成功加入该群。这个技术交流群后来成为了我学习成长的重要资源库,为后续的进步提供了关键支持。

经过几个月的刻苦自学,我自认为已经掌握了前端开发的基础技能,于是开始在招聘平台上投递简历。很快,我收到了一家公司的面试邀请。这次面试过程异常顺利,我成功以前端工程师的职位加入了这家公司。

然而命运似乎总爱开玩笑。入职后我才了解到,公司之所以招聘前端开发,是因为原先的前端工程师突然离职,留下了一堆未完成的项目和一个只有美工背景的同事。这个出人意料的局面,成为了我职业生涯中又一个意想不到的转折点。

还记得入职第一天,用 card:nth-of-type(3n+1) 选择器精确控制特定位置的元素样式,避免了使用额外的类名或复杂的 JavaScript 操作,在内心安慰自己:可以了,至少你现在在做正常的前端工作了。

在接下来的几个月里,我逐渐意识到公司对前端工程师的定位与我的预期相去甚远。除了常规开发工作外,我甚至需要协助客户端开发同事完成从设计稿中将元素切割导出为可用于网页或 App 开发的图片资源切图这样的基础工作。不过值得庆幸的是,公司保持着 9:00-18:00 的稳定工作时间,这让我有充足精力投入到技术研究中。在这段时期,我成功将 Less、Redux、axios 请求库引入老旧项目,显著提升了开发效率。更令人欣喜的是,我业余开发的一个图片旋转小游戏意外获得了公司的认可,被采纳为公众号的日常互动小游戏。这些小小的成就让我一度觉得工作还算顺心。

然而好景不长,当我在技术方案上与担任 Java 开发的老板产生分歧时,一句'这是最佳实践方案'的武断决策,彻底浇灭了我的工作热情。这种缺乏技术依据的专断让我倍感无力,也再次萌生了寻找新机会的念头。

职业发展的重要转折出现在一次偶然的社群招聘中。从传统 IT 企业到互联网公司的面试经历形成了鲜明对比:开放式办公环境、创意装饰、完善的休闲设施展现了完全不同的企业文化。技术面试环节,当被问及技术愿景时,我提出了云端同步工具的开发构想。这次成功的面试使我顺利加入,完成了从传统软件到互联网行业的关键转型。

互联网大潮中的探索与突破(2025)

入职前已通过技术预研和作业考核,涉及 Node.js、React、Next.js、Koa、Express、Redis、MySQL、RocketMQ、RabbitMQ 等技术栈,为后续工作打下坚实基础,使得入职后能够快速适应互联网开发节奏。

'我们不是在建造流水线,而是在培育热带雨林。'产品的团队 Leader 能力很强,业余时产品经理从零食柜能掏出两打啤酒,入职互联网公司后的氛围感让我一个从传统软件行业过来的人觉得非常棒。虽说互联网公司的工作氛围是非常轻松愉快的,但工作内容实打实地带给我了压力。App 功能的迭代是非常迅速的,从项目需求介绍、产品设计、技术选型、技术架构图到业务流程设计,这些工程工作量是非常大的。

第一次接触到了工程化,当时工程内处于 Grunt、Gulp 并存的状态,工程又被构建升级为了 Webpack,也是经由这些工程能够有场景实际使用 React 来进行开发。在这里第一次接触到了工程上线,H5 也都是采用的 SSR,因此工作中不可避免的接触到了 Node。非常感谢这份工作带给我的成长。在机缘巧合下,总是有机会出现在自己的眼前,每次也都能比较好的抓住,每当重要机会出现时总能及时把握,加上领导的信任,让我的工作成果始终保持在第一梯队,很幸运在职业发展关键节点遇到重要机会。

总结

回顾来看这三年:

  • 记得最初两年就像在迷雾中摸索前行,每次尝试都带着不确定
  • 踏入互联网领域,那些熬夜啃文档、周末泡技术文章的日子,硬生生逼自己一把

技术之路漫长,保持热爱,持续精进。

目录

  1. 前端三年复盘:从迷茫摸索到互联网工程实战
  2. 起步与转型(2022 ~ 2024)
  3. 互联网大潮中的探索与突破(2025)
  4. 总结
  • 免费图片AI生成工具免费生成了解详情
  • Magick API 一键接入全球大模型注册送1000万token查看
  • 免费图片视频在线生成30秒,将你的创意变成现实开始设计
  • X/Twitter免费视频下载器免登陆无限额度免费视频解析下载了解详情
  • 100+免费在线小游戏爽一把
极客日志微信公众号二维码

微信扫一扫,关注极客日志

微信公众号「极客日志V2」,在微信中扫描左侧二维码关注。展示文案:极客日志V2 zeeklog

更多推荐文章

查看全部
  • 循环神经网络(RNN)与序列数据处理实战
  • 基于 OpenClaw 与飞书集成构建 AI 新闻推送机器人
  • OpenClaw 跨平台安装教程:Windows、macOS、Linux
  • Claude Agent SDK Python 技术文档
  • 前端三年成长记:从理想主义到工程实战的蜕变
  • 大型语言模型解决组合问题研究:旅行商问题案例
  • 工业大模型市场图谱:53 个工业大模型梳理
  • Linux 包管理器速成:yum/apt 指令与镜像源配置指南
  • Flutter WebDriver 在 OpenHarmony 环境下的适配与实战
  • OpenClaw 接入飞书机器人配置教程
  • Redis 主从复制架构详解
  • Linux 环境下 C++ 线程池设计与实现
  • 谷歌 TurboQuant 内存压缩与 RWKV-6 架构优化大模型部署
  • Qwen2.5-7B 生产级部署:vLLM + Docker + OpenResty 高并发架构
  • C++ Qt 网络编程:QUdpSocket、QTcpSocket 与 Http 实战
  • 基于 Coze 构建知识库与 AI 聊天机器人实战指南
  • C++ 类和对象(二):默认成员函数深度解析
  • 大模型降低 AIGC 率指令策略与实战指南
  • 从树到森林——决策树、随机森林与可解释性博弈
  • 机器学习:聚类分析算法详解

相关免费在线工具

  • Keycode 信息

    查找任何按下的键的javascript键代码、代码、位置和修饰符。 在线工具,Keycode 信息在线工具,online

  • Escape 与 Native 编解码

    JavaScript 字符串转义/反转义;Java 风格 \uXXXX(Native2Ascii)编码与解码。 在线工具,Escape 与 Native 编解码在线工具,online

  • JavaScript / HTML 格式化

    使用 Prettier 在浏览器内格式化 JavaScript 或 HTML 片段。 在线工具,JavaScript / HTML 格式化在线工具,online

  • JavaScript 压缩与混淆

    Terser 压缩、变量名混淆,或 javascript-obfuscator 高强度混淆(体积会增大)。 在线工具,JavaScript 压缩与混淆在线工具,online

  • Base64 字符串编码/解码

    将字符串编码和解码为其 Base64 格式表示形式即可。 在线工具,Base64 字符串编码/解码在线工具,online

  • Base64 文件转换器

    将字符串、文件或图像转换为其 Base64 表示形式。 在线工具,Base64 文件转换器在线工具,online