如果你想从零开始学习React，就遵循这个学习路线图吧！

2 年 ago

清, 扬

1 minute

首先

你好！！@Sicut_study是我！

最近有了很多学习前端的机会，尝试了很多东西，我觉得未来会有更多的场合选择使用React。

因此，我认为初学者可以考虑学习JavaScript之后的下一个语言，所以我创建了这篇文章。

我个人于2022年9月开始自学React。

我最初对JavaScript一无所知，但通过学习React，我成功地理解了JavaScript，并且学会了使用React，从而能够开发出更多的个人项目。
起初，我对JavaScript了解甚少，但通过学习React，我成功地融会贯通了JavaScript，并且能够使用React进行个人开发，创造出更多的服务。

如果要我给去年的自己提供建议的话，

如果想从零开始学习React，可以按照这个学习路线图来学习。

努力是令人愉快的

制造物品很有趣

「我想还有其他方法可以更快地学习，比如说这样做。如果您能留下评论的话，我会很乐意回复！」

这篇文章的受众

勉強方法がわからない方

路线图 or 路线规划

最終目標是利用React推進个人开发的状态。而我个人非常重视的是，

无论如何，通过实践来学习。

进入现场并学习是成为工程师时最能成长的理念，而在舒适区之外不断学习是最快速度成长的必要条件。

我会提到这一点并介绍路线图。

通过实际操作来全面了解React。

(Note: This is a paraphrase of the given sentence. The translation may vary depending on the context and specific usage.)

使用React创建一个简单的应用程序。

用React来创建一个TODO应用程序

使用React进行简单的个人开发

我认为只需完成以下4个步骤，个人就能够培养出足够的基本能力来创建自己喜欢的服务。因此，对于正在努力学习的人来说，希望他们能够稳步地完成每个步骤，并在完成第四步后，回到这篇文章中留下他们的成果和感想的评论。

1. 通过实际操作来了解React的整体结构

学习一门新语言时，我认为使用公式提供的教程、书籍/udemy等实践教学方式是最快的。

实际上，只有解释语言功能而不知道哪些功能在哪里使用会使学习变得浅薄。
在实践中，只解释经常使用的功能，并且能够迅速理解实际应用场景，是很好的。

将Hands-on理解并完成到最后。

希望你能够以这里为目标去学习。在这个阶段，有些人（包括过去的我）在完成了很多教材后才准备迈向第二阶段，但如果想追求最快速度，请停止这种想法。不管怎样，我们是通过实践学习的，完成了一个或两个内容后就可以继续下一步。

在这一步，这是推荐的教材。

我认为在两天内完成这两件事情是最好的。

使用React创建一个简单的应用程序

在这里我们会从环境搭建开始，通过实际创建应用程序来理解那些我们还未理解的部分。我们会回顾之前所做的事情（重新观看视频），然后继续进行。

请在这里开发一个应用程序，包括以下内容

创建的东西：随机显示图片的网站

请提供一种随机的选项，以中文本地化对以下内容进行改写：https://source.unsplash.com/random

访问此网站，即可随机从Unsplash获取图片并展示。

当你在这里点击按钮时，图片会切换。

我将只制作这个简单的应用程序。
如果一开始就制作复杂的应用程序，因为缺乏知识和经验，完成它会非常困难，所以我将制作一个极其简化的应用程序。

顺便提一下，这个题目有一个容易出错的地方，希望你们能努力解决！

这里的应用程序在实用性方面稍微欠缺一些。

ランダムな画像を毎日プロフィールの写真に設定してくれる

我认为可以将在一些有趣的应用程序中所学到的知识应用起来。

用React创建一个TODO应用程序。

我将在这里创建我最喜欢的TODO应用程序。

实际上，由于已经在步骤1中创建了一个TODO应用程序，所以我们在这里将回想起来并继续创建它。
请尽量自己动脑筋思考，如果有不清楚的地方，请观看视频进行创建。

建议按照以下规范进行创建，不仅仅是制作一个TODO应用程序，只要模仿所有视频，就可以完成。

创造的东西：学习记录应用程序。

用户可以在应用程序中记录以下项目。

勉強した日付

只需对视频进行一点点修改，但如果手动学习的话，可能会增加一些难度并且更好。

个人而言，我认为在这里通过视频学习，学习使用styled-components和ChakuraUI等工具来提升界面的美观性也是不错的。

4. 使用 React 进行简单的个人开发

到了这一步，终于可以进行简单的个人开发来检验实力了。
主题是自由选择，但请务必遵守以下规则。

在一周之内制作出可以完成的规模。

把这个应用程序变得更加实用一点（能够解决一些问题）。

3. 竭尽所学，运用所学之道创造 (避免使用新技术的尝试)

只需要一种选项，对以下内容进行中文本地化的改写：

1认为在学习过程中完成某件事是最快的方法。
2希望能够从学习技术的乐趣转向创造物品的乐趣。
3希望不要因为尝试新事物而阻碍创造的进程。

我认为有了这个原因，一旦进入这个阶段，可以尝试使用 ChatGPT 进行代码实施时的辅助，并利用 Github Copilot。让我们理解代码含义并加以应用。

如果你在第四步创作过程中无法想出要创作什么，以下是我建议的一个例子，请尝试创建同样的内容。虽然其中涉及一些后端部分，但你可以只使用React静态数据来实现。

学习时的心态

我在前面的四个步骤中解释了最快学习路线图。

这四个步骤要做起来确实相当困难。

因为我一直在设定能够达到舒适区域之外极限的目标，但如果你真的想从零开始学习React，我希望你能够克服这种困难，并尽快掌握它。

一旦能够使用React，个人开发领域的广度就会大幅扩展。
就我个人而言，可以轻松地制作想做的东西，并将想法形状化，甚至可以自己开始创业。

虽然只是凭着直觉，但我觉得很多人都尝试过兼职工作。

为什么我想要学习React？

在进行这4个步骤的期间考虑这一点，通过学习一定能坚持到最后。
此外，我认为一旦完成每一个步骤，你一定会感受到成就感，所以请你挑战一下，因为你已经读到这里了。

如果您在这篇文章中留下评论或在Twitter上回复我，我也希望能够提供帮助，所以请随时与我联系！

结束

希望可以创作出能够吸引到更多人阅读的文章，以这篇文章的风格为基础。如果您读到这里，请务必点赞和收藏，非常感谢！

如果您能够关注@Sicut_study，我会非常高兴。

稍微宣传一下?????

我希望能够挑战自己，认真辅导那些想要成为工程师的人，在3个月的时间内帮助他们成为优秀的工程师。

如果有人真心希望成为工程师，并想尝试接受辅导，请在Twitter上发送像“我想学编程”这样的回复给我！

亲自以下：
让我们这周再接再厉，努力学习编程吧！