2019年React 开发工程师 RoadMap

React JS或简单的React是用于开发Web应用程序的前端或GUI的领先JavaScript库之一。

在Facebook的支持下,React JS近年来实现了跨越式发展,并成为基于组件的GUI开发的事实上的库。

虽然还有其他前端框架,如Angular和Vue.js可用,但React与其他框架的区别在于它可能只关注基于组件的GUI开发而不会侵入其他领域。

例如,Angular是一个完整的框架,为您提供了许多开箱即用的功能,例如依赖注入,路由系统,表单处理,HTTP请求,动画,i18n支持和强大的模块系统延迟加载。

所以,如果你已经有了库来完成这些工作,或者你可能根本不需要它们,那么React是一个很好的选择,但是学习React并不是那么容易,特别是如果你在Web开发中开始时那么新鲜。

当我今年开始学习React JS时,我有一些Web开发的背景,之前使用过HTML,CSS和JavaScript,并且知道前端开发的一两件事,但我也很努力学习React JS。事实上,我还在学习它。

当我正在研究正确学习React JS的方法时,我遇到了这个优秀的React 开发工程师 RoadMap,它概述了什么是强制性的,什么是好的知识,以及你可以学习React开发人员的一些额外的东西。

这个React 开发工程师 RoadMap是由adam-golab构建的,它概述了您可以采用的路径以及您希望学习成为React开发人员的库。

那么,如果您想知道接下来作为React开发人员应该学什么?然后这个路线图可以帮助你。

与令人敬畏的Web 开发工程师 RoadMap和DevOps RoadMap类似,这个React JS路线图也非常适合探索React,您可以使用它来成为更好的React开发人员。

但是,如果您想知道在哪里学习这些必修技能,那么不用担心,我还分享了一些免费和付费的在线价格,您可以学习这些技能。

2019年ReactJS开发者路线图

无论如何,这里是我所说的React 开发工程师 RoadMap:

图片来源:https://github.com/adam-golab/react-developer-roadmap/blob/master/roadmap.png

现在,让我们一步一步地浏览RoadMap,了解如何在2019年学习成为React 开发工程师的基本技能:

1.Basics

无论你在Web开发中学习哪个框架或库,你都必须了解基础知识,当我说基础时,我指的是HTML,CSS和JavaScript,这三个是Web开发的三大支柱。

HTML
它是Web开发人员的第一支柱和最重要的技能之一,因为它提供了网页的结构。

如果您想学习HTML,可以在Udemy上查看使用HTML5和CSS3价格构建响应式真实世界网站。

使用HTML5和CSS3构建响应式真实世界网站

如果您不介意从免费资源中学习,那么您还可以查看我的免费HTML价格列表。

CSS
它是Web开发的第二个支柱,用于设置网页样式,使其看起来很好。如果你想学习CSS,那么你可以在我的免费网络开发价格列表中找到几个免费的CSS价格。

JavaScript的
这是Web开发的第三个支柱,用于使您的网页具有交互性。这也是React框架背后的原因,因此在尝试学习React JS之前,您应该了解JavaScript并了解它。

如果你想从头开始学习JavaScript,我建议加入完整的JavaScript价格2019:构建真实的项目价格。它简直太棒了。

首先,您还可以查看我的免费JavaScript价格列表。

顺便说一句,不要单独学习这些技术,最好加入一个完整的Web开发价格,如Colt Steele的Web 开发工程师 Bootcamp,它将教你成为Web开发人员所需的所有基本技能。

2.一般发展技巧

无论您是前端开发人员还是后端开发人员,甚至是全栈软件工程师,都无关紧要。您必须了解一些在编程世界中生存的一般开发技能,以下是其中一些的列表

2.1学习GIT
您必须在2019年完全了解Git。尝试在GitHub上创建一些存储库,与其他人共享您的代码,并学习如何从您喜欢的IDE下载Github上的代码。

如果你想学习然后Git完成:Git的权威,分步指南是一个很好的价格。

如果您需要更多选择并且不介意从免费资源中学习,那么您还可以浏览我的免费价格列表来学习Git。

2.2了解HTTP(S)协议
如果您想成为一名Web开发人员,那么了解HTTP并了解它是绝对必要的。

我不是要求您阅读规范,但您至少应该熟悉常见的HTTP请求方法,如GET,POST,PUT,PATCH,DELETE,OPTIONS以及HTTP / HTTPS的工作原理。

2.3。学习终端
虽然前端开发人员学习Linux或终端并不是强制性的,但我强烈建议你熟悉终端,配置你的shell(bash,zsh,csh)等。如果你想学习终端和bash那么我建议你去看看在这个关于Udemy的Linux Command Line Basics价格中。

如果您需要更多选择,还可以浏览我的开发人员免费Linux价格列表。

2.4。算法和数据结构
好吧,这又是一般编程技巧之一,不一定需要成为React开发人员,但绝对需要首先成为程序员。

要学习数据结构和算法,您可以阅读一些书籍或加入一个好的价格,如算法和数据结构第1部分和第2部分。

如果您需要更多选择,还可以查看我的免费数据结构和算法价格列表。

而且,如果您喜欢的价格不仅仅是价格,那么每个开发者都应该阅读10本算法书籍清单。

2.5。学习设计模式
就像算法和数据结构一样,学习设计模式以成为React 开发工程师并不是必须的,但是通过学习它将为自己创造一个美好的世界。

设计模式是经过试验和测试的软件开发中常见问题的解决方案。

了解它们将帮助您找到能够经受住时间考验的解决方案。您可以阅读一些有关设计模式的书籍来学习它们,或者加入像Design Patterns库这样的综合价格。

如果您需要更多选择,还可以查看我的OOP和设计模式价格列表以获得更多想法。

3.学习React JS

现在,这是主要的交易。你必须学习React并学习它成为一名React开发人员。学习React的最佳地点是官方网站,但作为初学者,它对你来说可能有点压倒性。

这就是为什么我建议你报名参加Max’s React MasterClass或Stephen Grider的React和Redux等几门价格来学习React。这两个是我最喜欢的React价格,也受到成千上万的Web开发人员的信任。

如果你认真对待你的React技能,我强烈建议你看看这些价格。

  • React 16- Max的完整指南
  • 与斯蒂芬格里德的Redux现代反应

而且,如果您不介意从免费资源中学习,那么您还可以查看这个免费的React JS价格列表。

4.学习构建工具

如果你想成为一名专业的React开发人员,那么你应该花些时间熟悉一下你将作为web开发人员使用的工具,如内置工具,单元测试工具,调试工具等。

首先,本路线图中提到了一些构建工具:

点评经理

  • NPM
  • PNPM
  • 任务跑步者
  • npm脚本
  • 的WebPack
  • 成交量起

顺便说一句,学习所有这些工具并不重要,只需学习npm和Webpack应该足够初学者。一旦您对Web开发和React Ecosystem有了更多的了解,您就可以探索其他工具。

如果您想学习Webpack,那么Webpack 2:完整的开发人员指南是一个很好的开始。

5.造型

如果您的目标是成为像React开发人员这样的前端开发人员,那么了解一些Styling就不会受到伤害。尽管RoadMap提到了很多东西,比如CSS预处理器,CSS框架,CSS架构和JS中的CSS。

我建议你至少学习一下Bootstrap,这是你最不会使用的最重要的CSS框架。而且,如果您需要一门价格,Bootstrap 4 From Scratch With 5 Projects是一个方便的价格。

而且,如果你想学习bootstrap,如果你想提前一步,你也可以学习Materialise或Material UI。

6.国家管理

这是React开发人员关注的另一个重要领域。路线图提到了要掌握的以下概念和框架:

  • 组件状态/上下文API
  • 终极版
  • 异步操作(副作用)
  • Redux Thunk
  • Redux更好的承诺
  • Redux Saga
  • Redux Observable
  • 助手
  • 复赛
  • 重新选择
  • 数据持久性
  • Redux坚持
  • Redux Phoenix
  • Redux表格
  • MobX

如果这对你来说听起来太多了,我建议你只关注Redux,这很棒,而且Stephen Grider有一个很好的价格来学习Redux框架。

Max’s React 16-完全指南和Stephen Grider的Modern React with Redux价格也详细介绍了React和Redux中的状态管理。

React 16-完整指南

7.键入Checkers

由于JavaScript不是一种强类型语言,因此您没有足够的编译器来捕获那些与欺骗类型相关的错误。

随着应用程序的增长,您可以通过类型检查捕获大量错误,尤其是如果您可以使用Flow或TypeScript等JavaScript扩展来键入检查整个应用程序。

但即使你不使用它们,React也有一些内置的类型检查功能,学习它们可以帮助你尽早发现bug。

由于Angular也使用TypeScript,我认为值得学习TypeScript和JavaScript,如果您也这么认为,那么您可以查看Udemy上的Ultimate TypeScript价格。

终极TypeScript

而且,如果您需要更多选择,并且不介意从免费资源中学习,那么您还可以查看我的Web开发人员免费TypeScript价格列表。

8.表格助手
除了Type Checkers之外,学习像Redux Form这样的Form Helps也很不错,它提供了在Redux中管理表单状态的最佳方法。除了Redux Form之外,您还可以查看Formik,Formsy和Final表单。

9.路由
组件是React强大的声明性编程模型的核心,而路由组件是任何应用程序的重要组成部分。

React Router提供了一组导航组件,这些组件与您的应用程序以声明方式组合。

无论您是希望Web应用程序具有可收藏的URL还是可以在React Native中导航的可组合方式,React Router都可以在React呈现的任何位置工作。

除了React-Router之外,您还可以查看Router 5,Redux-First Router和React Router。

Max’s React 16 — The Complete指南和Stephen Grider的Modern React with Redux价格也详细介绍了React Router。

与Redux的现代反应

10. API客户端

在今天的世界中,您很少会构建一个独立的GUI,相反,您将有更多机会使用REST和GraphQL等API构建与其他应用程序通信的东西。

值得庆幸的是,React开发人员可以使用许多API客户端,以下是它们的列表:

休息

  • 的SuperAgent
  • 爱可信

GraphQL

  • 阿波罗
  • 中继
  • urql

Apollo Client是我的最爱,它提供了一种使用GraphQL构建客户端应用程序的简便方法。客户端旨在帮助您快速构建使用GraphQL获取数据的UI,并且可以与任何JavaScript前端一起使用

顺便说一句,如果您不了解GraphQL和REST,我建议您花点时间学习它们。如果您需要价格,以下是我的建议:

  • 带有React的GraphQL:完整的开发人员指南
  • REST API设计,开发和管理

11.公用图书馆

这些库使您的工作更轻松。 React开发人员可以使用许多实用程序库,如下所示:

  • Lodash
  • 时刻
  • 类名
  • 数字
  • RxJS
  • Ramda

我建议你不要学习所有这些,道路地图也是如此。如果你仔细观察Lodash,Moment和Classnames是用黄色绘制的,说明你应该从它们开始。

12.测试
现在,这是React 开发工程师s经常被忽视的重要技能之一,但是如果你想在竞争中保持领先,那么你应该专注于学习能够帮助你进行测试的库。此外,您还拥有用于单元测试,集成测试和端到端测试的库。

以下是路线图中提到的库列表:
单元测试

  • 笑话
  • 兴农
  • 摩卡
  • AVA
  • 胶带

端到端测试

  • Selenium,W​​ebdriver
  • 木偶
  • Cucumber.js
  • Nightwatch.js

集成测试

  • 因果报应

您可以学习所需的库,但建议使用Jest和Enzyme。完整的React Web开发人员价格(使用Redux)还涵盖了涵盖Jest和Enzyme的Testing React应用程序。

13.国际化
这是开发前端的另一个重要主题,在全球范围内使用。您可能需要支持日本,中国,西班牙和其他欧洲国家的本地GUI版本。

RoadMap建议您学习以下技术,但他们都知道:

  • React Intl
  • 反应i18next

这两个库都提供了React组件和API来格式化日期,数字和字符串,包括复数和处理翻译。

14.服务器端渲染
您可能会想到服务器端呈现和客户端呈现之间的区别,在讨论支持使用React的服务器端呈现的库之前,请先清楚一下。

好吧,在客户端渲染中,您的浏览器会下载一个最小的HTML页面。然后它呈现JavaScript并将内容填充到其中。

在服务器端呈现的情况下,React组件在服务器上呈现,输出HTML内容将传递到客户端或浏览器。

RoadMap建议遵循服务器端渲染:

  • Next.js
  • After.js
  • 流氓

但是,我建议只学习Next.js应该足够了,谢天谢地,Max的React 16 —完整指南也涵盖了Next.js的基础知识,它应该足够开始。

15.静态站点生成器
Gatsby.js是一个现代静态站点生成器。您可以使用Gatsby创建个性化的登录体验网站。它们将您的数据与JavaScript相结合,并创建格式良好的HTML内容。

16.后端框架集成
React on Rails将Rails与Facebook的React前端框架(服务器渲染)集成在一起。它提供Server渲染,通常用于SEO爬虫索引和UX性能,而不是rails / webpacker提供的。

17.手机
这是学习React真正有益的另一个领域,因为React Native正迅速成为用JavaScript开发具有原生外观的移动应用程序的标准方法。

RoadMap建议您学习以下库:

  • 反应原生
  • 科尔多瓦/ PhoneGap的

但是,我认为,只要学习React Native就足够了。

值得庆幸的是,有一些很好的价格可以学习React Native也可以像Stephen Grider的The Complete React Native和Redux Course那样教你如何快速构建完整的React Native移动应用程序

18.桌面
还有一些基于React的框架来构建像React Native Windows这样的桌面GUI,它允许您使用React构建本机UWP和WPF应用程序。

框架建议使用以下库:

  • Proton Native
  • 电子
  • 反应原生Windows

但是,它们都是为了进一步探索。如果你已经掌握了React,你可以看看它们。

19.虚拟现实
如果您对构建基于虚拟现实的应用程序感兴趣,那么您也有一些像React 360这样的框架,它允许您使用React激发360和VR体验。如果您对该领域感兴趣,可以进一步探索React 360。

这就是** 2019 React RoadMap **。它确实非常全面,很有可能你不会在剩下的2019年中学到所有这些,但不要担心,所有技术在2019年仍然有效,你可以有效地使用它作为成为一个称职的指南在未来几年内反应开发人员。

您可能喜欢的其他编程文章
在2019年学习Python的10个理由
10种编程语言你可以在2019年学习
每个Java开发人员应该知道的10个工具
学习Java编程语言的10个理由
10框架Java和Web 开发工程师应该在2019年学习
在2019年成为更好的Java开发人员的10个技巧
2019年要学习的5大Java框架
10每个Java开发人员应该知道的测试库
2019年DevOps RoadMap for Senior 开发工程师s

结算笔记

感谢您阅读本文至今。你可能会认为有很多东西需要学习,很多价格要加入,但你不必担心。

您很可能已经了解了大部分内容,并且还有许多有用的免费资源可以使用,我也在这里和那里连接了最好的资源,这些资源当然不是免费的,但是完全值得你的时间和金钱。

我是Udemy价格的特别粉丝,不仅因为我在购买价格时会收取佣金,而且因为它们非常实惠且提供了很多非常少量的价值,但您可以自由选择您想要的价格。

在一天结束时,你应该对这里提到的事情有足够的知识和经验。

祝你的React JS之旅好运这当然不是一件容易的事,但是通过遵循这个路线图和指南,你离成为React 开发工程师更近了一步,你一直想成为

如果您希望收到每个新帖子的通知,请考虑进入订阅此博客,并且不要忘记在Twitter上关注javarevisited和javinpaul。

最适合你的React之旅

附: —如果您不介意从免费资源中学习,那么您还可以查看我的Free React JS价格列表,开始您的旅程。

 

资讯来源:由0x资讯编译自DEV,原文:https://dev.to/javinpaul/the-2019-react-developer-roadmap-54ca ,版权归作者所有,未经许可,不得转载
你可能还喜欢