前端简历-前端特定写作技巧和示例

---

为了申请前端工程师职位的面试，我们必须提交一份通过公司简历筛选过程的简历。 虽然有许多现有的资源可帮助你制作好的软件工程师简历，但很少针对前端工程师。 有关通用软件工程师简历提示，请参考面试手册。

在本页上，我们提供了一些前端特定的技巧，以帮助前端工程师改进他们的简历并进入面试阶段。

基本要求​

• 如果您有不到 5 年的经验，则最好不要超过一页，最多不要超过两页。
• 使用 Microsoft Word、Google Docs、Pages 或 LaTeX 构建，以便应聘者跟踪系统（ATS）可以解析简历。 避免使用设计软件。
• 提交 PDF 格式。

格式和美观度​

前端工程师经常处理用户界面，并且期望他们有敏锐的设计感。 如果您的简历外观不美观，那么这将给你身为前端工程师的形象带来很不好的影响。

• 使用单列格式。
• 使用大多数操作系统上可用的常见字体，例如 Arial、Calibri 或 Garamond。 避免花俏的字体。
• 只使用一个或最多两个字体（一个用于标题，另一个用于正文）。
• 最小字体大小为 11px。

你的简历不需要过分漂亮和花哨，它只需要看起来整洁和视觉上令人愉悦即可。 如果你有多余的现金，最快创建美观且适合 ATS 的简历的方法是从FAANG Tech Leads购买简历模板。

工作经验部分​

简历的工作经验部分是最重要的，应占据简历的大部分空间。 此部分应着重强调您对过去或目前雇主的业务目标的贡献，

为了提高简历的 ATS 排名，应在可能的情况下在简历中散布“Front End”。 如果您的正式头衔是“软件工程师”，但您已作为工作的一部分进行了大量的前端开发，请考虑将您的头衔更改为“前端工程师”/“前端软件工程师”/“软件工程师（前端）”等，以提高相关性。

人们常犯的一个错误是没有提供关于他们的经验和成就的足够细节。 为了脱颖而出，重要的是要提供有关您的经验和成果的规模、复杂性和影响的足够信息。

• 差 👎：“使用 HTML、CSS 和 JavaScript 构建了一个网站”。
• 更好 👍：“构建了一个高性能的电子商务网站，允许用户浏览数百种商品，将商品添加到购物车并使用 PayPal 结账。 该网站每月有 20k 的活跃用戶，加载速度低于 2 秒，Lighthouse 得分为 98。 使用的技术：Next.js、React、GraphQL、CSS 模块”。

以下是一个前端相关的技术成就列表，适合提到：

• 产品工作：详细说明产品内部构建的功能。
• 性能：提供的性能改进，以及它们所带来的百分比收益。 例如， 页面加载大小、页面加载时间、Lighthouse 得分改进等。
• 测试：编写测试的数量，它们覆盖了多少重要流程，测试覆盖率的百分比增加。
• SEO：SEO 错误/警告的降低占百分比或是具体数字。 如果公司使用 SEO 工具如 Ahrefs 和 Semrush，则可以轻松获得此度量标准。
• 可访问性(a11y)：修复的 a11y 错误数量，改进了符合 WCAG AA/AAA 级标准的流程数目，以及增加的 a11y 组件数目。
• 工具：现代化技术在代码库中的现代化，例如将 jQuery 代码库迁移到 React、通过引入 TypeScript 提高类型安全性等。 要么描述产品，要么提到代码行数/工程师数量，以更好地理解规模和复杂性。

技能部分​

“技能”部分是你拥有的语言和技术的列表，可作为当 ATS/招聘人员/招聘经理阅读此部分时的快速清单/摘要。 至少，应该为“语言”和“技术”类别有两个列表项：

由于构建前端应用程序需要多种不同的技术，您可能会发现您有许多要添加到简历技能部分中的技术。 但不要添加每个技术！ 这会削弱实际重要技能的权重。 优先考虑以下语言/技术：

1. 在工作列表中出现​

如果某项技能出现在工作列表中并且你有使用它的经验，一定要将其添加进去。

2. 仅列出影响架构的关键技术​

像 React 这样的库对其他相关技术选择产生了很大影响，而像 Underscore/Lodash 这样的库与架构无关，可以轻易地被替换掉。 优先考虑前者，省略小型/实用库，这些库易于替换。

3. 广为人知或迅速走红​

这表明你跟上了现代前端生态系统的发展。 公司也可能正在考虑迁移到该技术，如果您在该技术方面有经验，这是一个加分项。

4. 展示您的广度​

列出所有的 React、Angular 和 Vue（所有前端视图框架）是过度的，即使您确实熟悉它们中的所有内容。 很少有工作列表会列出多个用于同一目的的技术（如果他们这样做，这是一个红旗信号）。 添加过多的技术（特别是同一类别的技术）会使读者更难以了解您的技能。

尝试列出至少一个，最多两个属于以下类别的技术。 不能全部都适用于您，因此只包含相关的内容。 下面是一些热门的例子。

• View：React、Angular、Vue、Svelte
• Rendering Frameworks：Next.js、Gatsby、Nuxt、SvelteKit
• State Management：Redux、Flux、Jotai、Zustand、Relay
• CSS：CSS Modules、Styled Components、Tailwind CSS、Sass、Less
• CSS 框架：Bootstrap、Material UI、Chakra UI、Bulma
• 单元测试：Jest、Vitest、Storybook、Mocha、Jasmine、Karma
• 数据获取：GraphQL、tRPC、TanStack Query、swr
• 集成测试：Cypress、Selenium、Puppeteer、WebdriverIO、Playwright
• 语言工具：Babel、TypeScript、Flow、ESLint
• 编译工具（可选）：webpack、Vite、Parcel、Gulp、Rollup、Browserify
• 软件包管理（可选）：npm、Yarn、pnpm

示例​

这是我们的简历的“技能”部分的示例：

• 语言：HTML、CSS、JavaScript、TypeScript
• 技术：React、Next.js、Tailwind CSS、Jest、Storybook、Cypress、React Query、Yarn、webpack

这恰好是用于构建 GreatFrontEnd 的技术堆栈。 您的“语言”项目下应该有 HTML、CSS、JavaScript，否则可能存在大问题。

项目部分​

前端领域随着新的 JavaScript 框架和 CSS 方法的不断出现而不断发展。 在简历中列出项目表明您热爱这个领域，为了跟上最新的前端技术而付出了额外的努力，尤其是如果它们没有在你的工作中使用，这是一个巨大的正面信号。 列出每个项目所使用的技术，特别是如果它们是公司使用的现代技术。 这有助于提高简历的 ATS 排名并留下更深的印象。 在可能的情况下，将代码放在 GitHub 上，并梳理 README 以包括产品的截图。 将项目代码和现场网站的链接添加到简历中。

开源贡献，尤其是对复杂代码库的非微小更改，被视为技术能力的标志。 如果您已经创建或是开源项目的维护者，则更好。

总结​

虽然面试手册的通用软件工程师简历提示对前端工程师来说基本上已经足够了，但上述技巧将帮助您提升前端工程师简历并将其提到更高的层次。