Resources that every developer should know.

2025-05-27

每个开发人员都应该知道的资源。

大家好!我创建这个帖子,是因为我想分享一些我在开发应用时日常使用的工具或资源。其中一些或许对你有用。快来开始吧!

在线代码编辑器。

有时,在开发应用程序时,我们需要执行某个流程、创建某个算法,但我们不想在项目中执行这些操作。我们可以选择创建一个新项目并进行测试。但有时我们需要快速完成,因此在线代码编辑器并不理想。

代码沙盒。

其定义为“让团队能够更快速地协同构建,
利用协作沙盒创建、共享和获取反馈,从而实现快速的 Web 开发”。访问以下链接:https://codesandbox.io

Codesandbox 图片

代码打开。

CodePen 被定义为“构建、测试和发现前端代码的最佳平台。CodePen 是一个面向前端设计师和开发者的社交开发环境。在这里,您可以构建和部署网站,展示您的作品,编写测试用例进行学习和调试,并寻找灵感。” 访问以下链接:https://codepen.io

Codeopen 图像

堆叠闪电战。

被定义为“地球上最快、最安全的开发环境”。访问以下链接:https://stackblitz.com

Stackblitz 图像

其他在线代码编辑器。

测试。

当我们完成我们的应用程序时,就该测试我们所做的一切是否正常工作,并防止在生产中出现问题。

Cypress.io

Cypress 是一款专为现代 Web 构建的前端自动化测试工具。Cypress 基于全新架构,与被测应用程序的执行周期相同。因此,Cypress 能够为浏览器中运行的所有内容提供更好、更快、更可靠的测试。Cypress 适用于任何前端网站或框架。访问以下链接:https://www.cypress.io

Cypress.io 图片

API 平台。

我在创建 API 时会用到这个工具,而且我不想在开发 API 时同时开发前端。我知道 VSCode 里有一些扩展,比如 REST Client。不过我想跟大家分享一些程序。

邮差。

Postman 是一个用于构建和使用 API 的平台。Postman 简化了 API 生命周期的每个步骤,并简化了协作,以便您能够更快地创建更优质、更高效的 API。您可以从以下链接下载:https://www.postman.com

Postman 图像

失眠。

其定义为“通过标准以及与 Insomnia API 设计平台的协作,交付高质量的 API”。您可以在以下链接下载:https: //insomnia.rest

失眠图片

电子邮件测试。

很多时候,当我们想要为用户添加电子邮件验证功能,或者开发电商平台时,需要向客户发送优惠信息,这时就需要发送电子邮件。以下是一些可以帮助我们测试整个流程的工具。

邮件陷阱。

这是我开发需要发送电子邮件的应用程序时用过的最好的工具之一。点击以下链接:https://mailtrap.io

邮件陷阱图像

发送网格。

现在,sendgrid 带来了新功能,其中之一就是能够在正式上线前测试我们的邮件。点击此处:https://sendgrid.com/solutions/email-marketing/email-testing

Senedgrid 测试图像

其他工具。

模拟数据。

数据生成器。在开发应用程序时,我们经常需要生成一些数据,以便进行测试并检查一切是否运行正常。想象一下,您正在创建一个虚拟商店,其中包含产品、类别、客户、促销等信息。如果您意识到数据量很大,而且输入这些数据是一项繁琐乏味的任务,那么就请尝试一下。有了这些工具,您就可以减轻这个负担。

莫卡罗。

Mockaroo 是一个网站,你可以在几秒钟内创建数千个测试数据,修改数据库模型的字段等等……就我个人而言,这是我最常用的网站。访问以下链接:https://www.mockaroo.com

图片 Mockaroo

生成数据。

Generatedata,一个允许您立即创建虚假数据的网站,您可以获取街道、地址、姓名和电话号码。此外,您还可以指定所需的格式,例如 JSON、HTML、SQL 等等。请访问以下链接:https://generatedata.com

生成的数据图像

其他生成数据。

图像。

在网站上添加图片是很常见的,但有时我们想要高清的图片。因此,我给大家推荐了一些图片质量最好的网站。

拉开。

允许您添加 SVG 图像。此外,它还允许您进行美观更改,使其与我们的网站同步。访问以下链接:https://undraw.co/illustrations

取消绘制图像

Pexels。

这是我最常用来向我的网站添加图像的网站之一。

Pexels 图片

UiAvatars。

如果你想知道谷歌如何添加带有你的名字和姓氏的头像,请查看此处:https://ui-avatars.com

UiAvatars 图片

Unsplash。

其定义为“互联网上免费使用图片的来源,
由世界各地的创作者提供支持”。访问以下链接:https://unsplash.com

Unsplash 图片

其他网站。

图像压缩。

有时候,我们的图片太大,会减慢网站的加载速度。这时,就需要缩小图片大小,或者使用延迟加载。

TinyPNG。

本网站允许我们压缩所有分辨率和扩展名的图片。点击以下链接:https://tinypng.com

TinyPNG图像

其他网站。

网站图标生成器。

当我们即将部署一个应用程序(或正在开发中)时,我们希望在页面上看到一个图标。该图标如下。

Favivon 示例

Favicon.io

您下一个项目所需的唯一网站图标生成器。快速从文本、图像或数百个表情符号中生成您的网站图标。网站https://favicon.io

Favicon.io 图片

其他网站。

颜色。

最安全的情况是你已经知道这些页面,但无论如何我都会把它们留在这里。

扁平颜色。

在本页面,您可以找到一些漂亮的颜色,可以添加到您的页面、网站或网络应用中。访问以下链接:https://flatuicolors.com

Flatuicolors 图像

Ui渐变。

这个网站,我通常需要渐变色的时候用。访问以下链接:https: //uigradients.com

UiGradient 图像

Html颜色代码。

HtmlColorCodes 图像

其他网站。

图标。

当我们开发应用程序时,我们需要在按钮、卡片、工具栏和其他内容上添加图标。

盒子图标。

您可以在本网站找到许多可添加到组件的图标。点击以下链接:https://boxicons.com

Boxicons 图像

真棒字体。

好吧,每个几周大的开发人员都知道这个工具。😂😂😂我留下链接:https://fontawesome.com

Font Awesome 图像

Google 图标。

Google 也提供了非常漂亮的图标,并且支持按类别、名称等进行筛选,这样我们就能更快地找到想要的图标。点击此处:https://fonts.google.com/icons

Google 图标图片

其他网站。

文本生成器。

当我们开发应用程序时,如果需要添加填充文本来查看效果,文本生成器就非常有用。但事实上,添加填充文本非常繁琐,尤其是在文本量较大的情况下。以下是一些网站:

Loremipsum.io

图片 Lorem Ipsum

Lorem Ipsum 是一种占位符文本,常用于图形、图表和出版行业,用于预览视觉布局和模型。点击以下链接:https://loremipsum.io

其他网站。

在撰写本文时,这些是我日常使用的工具,至少是我记得的那些。如果您也使用过其他工具,请不要忘记评论,这对我们社区的成长非常有帮助。此致,下次再见。

在社交网络上关注我。

文章来源:https://dev.to/ivanzm123/resources-that-every-developer-should-know-3jkd
PREV
5 种强大的编程语言,拓展你的大脑
NEXT
当我还是一名初学者时,我希望从经验丰富的开发人员那里听到什么