当前位置: 首页 > Web前端 > HTML5

前端大牛:2020年给前端开发工程师的10条学习建议

时间:2023-04-05 21:58:59 HTML5

毫无疑问,前端开发将成为2020年技术领域最热门的学科之一。前端领域的开发人员需要了解一些HTML、CSS和jQuery来创建交互式网站。但是今天,他们面临着广泛且不断变化的开发技能生态系统;要掌握的工具、库和框架;以及对个人教育不断投资的需要。在过去的几年里,针对使用JavaScript的主要Web应用程序(例如ReactJS、VueJS和Svelte)出现了强大的新库和框架。在这里,小编建了一个前端学习交流按钮群:132667127,自己整理的最新前端资料和进阶开发教程。如果愿意,可以进群一起学习交流。2020年一些指导你提升前端开发技术水平的攻略,不管你是刚开始编程还是已经有了一些经验,下面就和小编一起来看看吧!1.框架在2020年,我们可能会看到Facebook的ReactJS和社区驱动的VueJS之间的摊牌。目前,React在GitHub上有140,000颗星,而Vue有153,000颗星。例如,Angular只有53,000颗星。2019年,React(蓝线)、Vue(红线)、Angular(黄线)和Svelte(绿线)的搜索量支持这一假设——Vue略高于React。Angular在搜索量方面跟不上,而Svelte在这种比较中肯定不起作用。因此,对于2020年,使用或想使用JavaScript框架的前端开发人员应该将React和Vue作为他们的主要选择。如果您从事大型企业项目,Angular是一个有效的选择。2.静态站点生成器静态站点生成器结合了服务器端渲染(对SEO很重要,但对初始加载时间也很重要)和单页应用程序的强大功能。现在许多项目选择SSG,即使它们不需要服务器端渲染,因为Next或Nuxt等解决方案具有模块捆绑器、集成测试运行器等便利功能。如果你是认真的前端开发,你应该仔细看看以下项目并尝试获得一些实践经验:Next(基于React)Nuxt(基于Vue)Gatsby(基于React)Gridsome(基于Vue)3.JAMstack术语JAMstack代表JavaScript(在客户端运行-例如,React、Vue或VanillaJS)、API(服务器端进程通过HTTPS通过JavaScript抽象和访问)和标记(模板标记预-在部署时构建)。.这是一种构建网站和应用程序以提高性能的方法——降低扩展成本、提供更高的安全性并提供更好的开发人员体验。尽管这些术语本身并不新鲜,但它们有一个共同点——它们不依赖于网络服务器。因此,依赖Ruby或Node.js后端的整体应用程序,或使用服务器端CMS(如Drupal或WordPress)构建的网站,不是使用JAMstack构建的。如果你想使用JAMstack,这里有一些最佳实践:整个项目在CDN上提供服务由于不需要服务器,整个项目可以通过CDN提供服务,释放无与伦比的速度和性能。一切都在Git中每个人都应该能够从Git存储库中克隆整个项目,而无需数据库或复杂的设置。自动化构建您可以完美地自动化构建,因为所有标签都是预先构建的,例如使用webhooks或云服务。原子部署为了避免在大型项目中重新部署数百或数千个文件而出现不一致状态,原子部署将等待所有文件上传后再进行更改。即时缓存失效当站点上线时,必须确保CDN能够处理即时缓存破坏以使更改可见。Netlify或Zeit等知名主机支持JAMstack应用程序,大公司使用这些应用程序为其用户提供出色的体验。4.PWAsProgressiveWebApps(PWAs)无疑将在2020年成为现实。越来越多的公司正在选择PWAs来替代原生应用程序,以便为用户提供丰富的移动体验。PWA可靠(立即加载,无需互联网连接即可工作)、快速(流畅的动画、对用户交互的快速响应)和引人入胜(原生应用程序感觉、出色的用户体验)。他们使用ServiceWorker来提供离线功能,并使用Web应用程序清单文件来提供全屏体验。构建渐进式Web应用程序的原因是:·可以从浏览器添加到用户的主屏幕·即使没有互联网也能工作·支持网络推送通知以增强用户参与度·利用谷歌的Lighthouse功能5.GraphQLGraphQL是目前最热门的话题之一绝对是您在2020年需要学习或改进的东西。虽然REST长期以来一直被认为是通过提供无状态服务器等伟大概念来设计WebAPI的事实标准,但RESTfulAPI在跟上快速发展的步伐时变得越来越不灵活改变访问RESTfulAPI的客户。GraphQL由Facebook开发,旨在解决开发人员在处理RestfulAPI时面临的确切问题。使用RESTAPI,开发人员可以通过从具有特定目的的多个端点(例如/users/端点或/tours//location端点)获取数据来收集数据。使用GraphQL,这会有所不同。开发人员将查询连同他们的数据要求一起发送到GraphQL服务器。然后服务器将返回一个包含所有相应数据的JSON对象。使用GraphQL的另一个好处是它使用了强类型系统。GraphQL服务器上的所有内容都是使用GraphQL架构定义语言(SDL)通过架构定义的。创建模式后,前端开发人员和后端开发人员都可以彼此独立工作,因为他们知道定义的数据结构。6.代码编辑器/IDE与2019年一样,微软的VSCode将成为2020年大多数前端工程师的首选编辑器。它提供几乎与IDE类似的功能,例如代码补全和语法高亮,并且几乎可以无限扩展通过其扩展市场。尤其是市场让VSCode如此出色。作为前端开发人员,这里有一些很棒的扩展:·JavaScript(ES6)片段·npm·美化·CSSpeek·ESLint·LiveSass编译器·Chrome调试器这些都是很酷的例子。在VSCode中还有很多东西有待发现,所以如果您还没有使用过它,我建议您尝试一下。7.测试未经测试的代码不应该找出它是如何产生的。在您的个人项目中不进行任何测试似乎很方便,但在商业和企业环境中工作时,测试是必须的。因此,对于任何开发人员来说,最好将测试尽可能多地集成到开发工作流程中。可以区分以下测试用例:单元测试单独测试单个组件或功能。集成测试测试组件之间的交互。端到端测试测试浏览器中功能齐全的用户流程。测试方式较多,如手动测试、快照测试等。如果你想升到高级开发人员职位或打算在具有一定开发水平的大公司工作,你应该尝试测试你的技能。8.干净的代码能够编写干净的代码是一项伟大的技能,许多组织都非常需要它。如果你想从开发人员职位晋升到高级开发人员职位,你真的应该学习干净代码的概念。干净的代码应该优雅且易于阅读。它应该是有重点的,你应该注意这一点。所有测试都以干净的代码运行。它们不应包含重复项,并且应尽量减少实体(例如类、方法和函数)的使用。干净的代码开发人员应该做的一些事情是:·为变量、类、方法和函数创建有意义的名称·函数应该小并且参数尽可能少·完全没有注释-代码应该自己说话如果你想理解有关干净代码检查的更多信息,请阅读RobertC.Martin的书籍和帖子。9.Git毫无疑问,Git是当今Web开发中版本控制的标准。对于每个前端工程师来说,理解基本的Git概念和工作流程对于在各种规模的团队中有效工作是非常重要的。这里有一些你应该知道的流行的Git命令:gitconfiggitinitgitclonegitstatusgitaddgitcommitgitpushgitpullgitbranch知道这些命令来提高你的工作效率总是很好的,但是前端工程师也应该学习基本的Git的概念。10.软技能对于开发人员来说,一个经常被忽视但非常重要的事情是获得软技能。虽然它有助于理解事物的技术方面,但了解如何在团队中沟通也同样重要。如果您认真对待技术职业和/或计划晋升为高级职位,您应该培养以下软技能:同理心沟通团队合作平易近人且乐于助人耐心思想开放,解决问题尽责创造力时间管理永远记住:开发人员最重要的可交付成果是高级开发人员。(推销自己)结语Web前端小编在这篇文章中向大家展示了前端开发者在2020年应该尝试学习、提升或掌握的10件重要事情。这份清单并不意味着完整,但希望它会给你明年的灵感——选择权在你!