想成为顶级开发者？你需要多练习！请收好这些资源

末蓝、 2022-05-24 13:13 192阅读 0赞

每个人都很清楚要掌握一项技能需要充满激情积极地努力工作。如果你想在某一方面成为专家，那么你必须投入充分的精力。

没有任何好东西是可以轻易得到的。虽然很难，但是值得去尝试。我们都很喜欢写代码，但是往往没有好的想法，不知道写什么来锻炼自己的动手能力。在这里我给你们列出了一系列有挑战又有趣的项目。

## 1. Node.js配合[GraphQL][]来写后端 ##

[![graphql.gif][]][graphql.gif]

[GraphQL][]可以说是革命性的改变了我们发送和接收数据的方式。因此，绝对值得你花时间去琢磨一下。

#### 具体操作 ####

*  用Node.js的Express框架创建一个服务器，并使用MongoDB和graphQL；
 *  对数据进行基本的创建、读取、更新和删除(CRUD)操作;
 *  从一个简单的前端获取数据。

我建议你可以看看这个Youtube视频教程：[Introduction to GraphQL][]

## 2. 终端app ##

[![terminal.png][]][terminal.png]

一个终端应用就是一个可以在终端(terminal)下运行的程序。

可以从一个很小的简单的应用开始。终端应用的机制很简单：给定输入，返回输出。

#### 一些简单的思路 ####

*  请求用户输入名字，然后输出结果；
 *  显示一些数学公式，然后让用户给定输入，返回输出结果。

这里有一系列[终端应用示例][Link 1]可以学习。

## 3. [Electron][]桌面应用 ##

[![electron.png][]][electron.png]

[Electron][]可以让你使用网页技术比如HTML、CSS和JavaScript来开发桌面应用。

一些非常出名的Electron应用： [Visual studio code][], [Atom][], [Slack][], 和[Webtorrent.io][]。

推荐一个Electron的YouTube介绍视频:[What is Electron: The Hard Parts Made Easy][What is Electron_ The Hard Parts Made Easy]。

再强调一遍，从一个简单的小应用开始，然后逐步构建复杂的。比如，你可以先创建一个Electron应用，给定输入，然后输出到终端。如果你对Web开发熟悉，那么你将会认为Electron非常方便。

## 4. 克隆Instagram ##

[![instagram.png][]][instagram.png]

Instagram是一个很复杂的应用，如果你能把它写出来，你会学到很多知识。如果你自己搭建一遍Instagram，你可以学到：

*  复杂的Grid管理(请尝试用新的CSS grid技术)；
 *  多点调用API/数据流管理（请尝试用GraphQL)；
 *  可以搭建真实的大型应用。

你可以自由选择其他适合的技术。

非常棒的一点是：[Instagram提供了API][Instagram_API]

## 5. 使用[D3.js][]做数据可视化 ##

[![d3.png][]][d3.png]

[D3][D3.js]是Data-Driven-Documents的缩写。D3是一个非常流行的库。当然，他不是唯一的选择，还有[ChartJS][]和[plotly.JS][]。

D3js的介绍视频：[D3js Workshop(Intro Into Creative Visualizations with SVG and D3)][D3js Workshop_Intro Into Creative Visualizations with SVG and D3]。

真的非常棒！你可以从这里获取足够多的数据来练习：[Awesome GitHub repository consisting of free-to-use public datasets][]。

[![public_datasets.png][]][public_datasets.png]

以上提供的一些练习项目希望能够助你锻炼开发的能力，就像[Fundebug][]能够助你Debug一样！

原文链接： [Fundeug博客-][Fundeug_-] [想][Fundeug_-]成为顶级开发者？你需要多练习！请收好这些资源

[GraphQL]: https://graphql.org/
[graphql.gif]: /images/20220524/51ccf3c231b947218d6363df60c15bdc.png
[Introduction to GraphQL]: https://youtu.be/Y0lDGjwRYKw
[terminal.png]: /images/20220524/d3ab24a3a5b34c6896849001ec4c80a3.png
[Link 1]: https://nodeschool.io/
[Electron]: https://electronjs.org/
[electron.png]: /images/20220524/f9dd4c5ea75e48aea1ae2790f3d1d522.png
[Visual studio code]: https://code.visualstudio.com/
[Atom]: https://atom.io/
[Slack]: https://slack.com/
[Webtorrent.io]: https://webtorrent.io/
[What is Electron_ The Hard Parts Made Easy]: https://youtu.be/8YP_nOCO-4Q
[instagram.png]: /images/20220524/c4ddc58ab2c748868b5b815e11af57ac.png
[Instagram_API]: https://www.instagram.com/developer/
[D3.js]: https://d3js.org/
[d3.png]: /images/20220524/3594f479fb534d3f96893c01c3c9fd1e.png
[ChartJS]: https://www.chartjs.org/
[plotly.JS]: https://plot.ly/javascript/
[D3js Workshop_Intro Into Creative Visualizations with SVG and D3]: https://youtu.be/qVgOTbx4RW8
[Awesome GitHub repository consisting of free-to-use public datasets]: https://github.com/awesomedata/awesome-public-datasets
[public_datasets.png]: /images/20220524/71e4e01d7d254427bdc533e6f46da376.png
[Fundebug]: https://www.fundebug.com/
[Fundeug_-]: https://blog.fundebug.com/2018/05/28/way-to-top-developer/