Web前端开发需要学习什么

格桑2021-12-15 14:05

  过去,前端领域的开发人员只要了解一些HTML、CSS和jquery,就足以创建互动网站;但今天,他们需要面对广泛而不断变化的生态系统,开发各种技能;他们需要掌握许多工具、数据库和框架;必须不断投资自己来学习新知识。

Web前端开发需要学习什么

  近年来出现了一系列基于JavaScript的优秀库和框架新产品,如ReactJS、VueJS和Svelte;它们为主流Web应用带来了强大的动力。

  1、框架

  2020年,我们可能会看到Facebook的ReactJS和社区驱动的VueJS之间的对抗。目前React在GitHub上有1、4万星,而Vue甚至有1、5万星。相比之下,像Angular这样的项目只有5.3万星。

  2019年,React(蓝线)、Vue(红线)、Angular(黄线)和Svelte(绿线)的搜索趋势也可以证明这一假设——Vue略高于React。Angular的搜索量相差甚远,而Svelte在这场对抗中几乎没有存在感。

  因此,在2020年,使用或希望使用JavaScript框架的前端开发人员应该将React和Vue作为他们的主要选择。如果你在处理大型企业项目,Angular也是可行的选择。

  如果您想了解更多关于这些框架的信息,请查看以下重要资源:

  React

  Vue、js。

  2、静态站点生成器。

  静态站点生成器集成了服务器渲染(SEO非常重要,也会影响初始加载时间)和单页应用的能力。

  如今,许多项目选择SSG,即使不需要服务器渲染,因为Next或Nuxt等解决方案有许多方便的功能,如markdown支持、模块包装器和集成测试操作器。

  如果你非常重视前端开发,你应该仔细研究以下项目,并尝试获得一些实践经验:

  Next(基于React)

  Nuxt(基于Vue)

  Gatsby(基于React)

  Gridsome(基于Vue)

  这些可能是2020年最受欢迎的项目,当然还有很多选择。如果您想了解更多关于它们的信息,请查看这些资源:

  Next、js。

  Nuxt、js。

  Gatsby。

  Gridsome。

  3、JAMstack。

  JavaScript(在客户端上运行,如React、Vue或VanilaJS)、API(服务端过程通过HTTPS抽象访问JavaScript)和Markup(部署时预构建的模板标记)。

  这是一种构建性能更好的网站和应用程序的方法——降低扩展成本,提供更高的安全性和更好的开发体验。

  虽然这些术语本身并不新鲜,但它们有自己的共同点——它们不依赖Web服务器。因此,依靠Ruby或Node、js后端或使用服务端CMS(如Drupal或WordPress)构建网站的单个应用程序不是由JAMstack构建的。

  如果您想使用JAMstack,以下是一些最佳实践:

  整个项目提供CDN服务。

  由于JAMstack不需要服务器,整个项目可以通过CDN提供服务,从而释放出无与伦比的速度和性能。

  把一切都放在Git里。

  每个人都应该能够在没有数据库或复杂设置的情况下从Git存储库中克隆整个项目。

  自动化构建

  您可以完美地自动构建,因为所有的标记都是预构建的——例如,使用webhooks或云服务来构建标记。

  原子部署

  为避免在大型项目中重新部署数百或数千份文件时出现不一致状态,原子部署将等待所有文件上传,然后进行更改。

  即时缓存失效。

  网站上线时,必须确保CDN能够处理即时缓存清除任务,以便更改可见。

  像Netlify或Zeit这样的著名主机支持JAMstack应用程序,许多大公司使用它们为用户提供卓越的体验。

  作为一名前端开发者,你绝对想在2020年学习使用JAMstack。如果你想了解更多关于JAMstacks的信息,这里有一些很棒的资源:

  (https:/jamstack、org/)

  wtf(https:/jamstack)

  刚接触JAMstack?您需要了解的所有入门知识(https://snipcart、com/blog/jamstack)

  4、PWA

  渐进式Web应用程序(PWA)绝对是2020年的热门话题。越来越多的公司选择用PWA代替本地应用,从而为用户提供丰富的移动体验。

  PWA非常可靠(即时加载,无需连接互联网即可工作),速度快(动画流畅,对用户交互响应快),能提供有吸引力的体验(类似本土应用的感受,优秀的用户体验)。

  它们使用服务worker提供脱机功能,并使用web-app列表文件提供全屏体验。

  构建渐进式Web应用程序的原因可能包括:

  可以从浏览器添加到用户的主屏幕。

  即使没有互联网也能正常工作。

  支持网络推送通知,增强用户参与度。

  利用谷歌的Lighthouse功能。

  如果您想了解更多关于PWA的信息,请随时查看以下资源:

  渐进式Web应用(https://developers、google、com/web/progressive-web-apps)

  您的第一个渐进式Web应用程序(https://codelapp/#0)

  5、GraphQL。

  GraphQL是目前最热门的话题之一,绝对是你2020年需要学习或提升的东西。

  虽然REST提供了无状态服务器等优秀概念,一直被认为是设计WebAPI的事实标准,但由于访问这些RESTfulAPI的客户端变化太快,这些相对笨拙的API越来越不灵活。

  Facebook开发了GraphQL,旨在解决开发者在处理RestfulAPI时面临的一些具体问题。

  开发人员在使用RESTAPI时,可以从具有特定目的的多个端点(如一个/users/端点或一个/tours//location端点)中获取数据,然后收集数据。

  使用GraphQL时,工作机制不同。开发人员将查询与他们的数据需求一起发送到GraphQL服务器。然后,服务器将返回具有所有相应数据的JSON对象。

  使用GraphQL的另一个好处是它使用了一个强大的系统类型。GraphQL服务器上的所有内容都是通过schema定义的GraphQLschema定义语言(SDL)。创建schema后,前端和后端开发人员可以独立工作,因为他们都知道定义的数据结构。

  更多关于GraphQL的信息,请查看以下重要资源:

  GraphQL。

  如何开始GraphQL(https://www、howtographql、com/)

  GraphQLContentAPI介绍(https://www、contentful、com/developers/docs/tutorials/general/graphql/)

  GraphQL:数据查询语言(https://enginering、fb、com/core-data/graphql-a-data-query-language/)

  以上就是小编为大家整理发布的“Web前端开发需要学习什么”一文,更多相关内容尽在开课吧广场Web教程频道。

免责声明:本站所提供的内容均来源于网友提供或网络搜集,由本站编辑整理,仅供个人研究、交流学习使用。如涉及版权问题,请联系本站管理员予以更改或删除。
有用
分享