100+ 值得收藏的 Web 开发资源

1,474 阅读5分钟
原文链接: zhuanlan.zhihu.com

对于 Web 工程师来说做好和最糟糕的事都是 Web 技术的日新月异。这也意味着作为一个 Web 开发者来说一定要不断的学习,适应变化。

因此,作者列举出了自己开发和学习过程中遇到的好工具和资源,在这里分享给大家:

JavaScript Libraries

  • jQuery:最知名的 JavaScript 库。
  • BackBoneJS:为复杂 WEB 应用程序提供 MVP 结构。
  • D3.js:最流行的 Javascript 可视化图形库之一。
  • React:Facebook 开源的 JavaScript 库。
  • jQuery UI:以 jQuery 为基础的开源 JavaScript 网页用户界面代码库。
  • jQuery Mobile:jQuery 框架的一个组件,提供完整统一的移动 UI 框架。
  • Underscore.js:提供了一整套函数式编程的实用功能,但是没有扩展任何 JavaScript 内置对象。
  • Moment.js:一个JavaScript 日期处理类库,用于解析、检验、操作、以及显示日期。
  • Lodash:一个具有一致接口、模块化、高性能等特性的 JavaScript 工具库。

前端框架

  • Bootstrap:著名的快速开发响应式 Web 应用程序的前端工具包。
  • Foundation:一个易用、强大而且灵活的前端框架,用于构建基于任何设备上的 Web 应用。
  • Semantic UI:全语义化的前端界面开发框架。
  • uikit:一款轻量级开源的前端框架。

数据库

  • MySQL:最流行的关系型数据库管理系统。
  • MariaDB:由 MySQL 早期员工开发,属于 MySQL 的一个分支。
  • MongoDB:基于分布式文件存储的数据库。
  • Redis:一个开源、支持网络、基于内存、键值对存储数据库。
  • PostgreSQL:开源的对象 - 关系型数据库管理系统,Uber 早期就是用得这个。

Task Runners / Package Managers

  • Grunt:JavaScript 世界的构建工具。
  • Gulp:基于流的自动化构建工具。
  • Bower:Web 包管理器,包括 HTML,CSS,JavaScript,字体、甚至图片资源。
  • NPM:Node 包管理器。

CSS 预处理器

  • Sass:一个强大、成熟、稳定的 CSS 扩展。
  • Less:作为一个 CSS 的扩展,其兼容性非常好,学习成本很低。
  • Stylus:提供更有效、优雅的方式来生成 CSS。

Markdown 编辑器

  • StackEdit:一个开放源码免费使用的 MarkDown 编辑器, 基于 PageDown。
  • Dillinger:也是在线编辑器,提供云存储,并支持 HTML5,PDF 等多种导出格式。
  • Mou:Mac OS X 上一款出色的 Markdown 编辑器。
  • Texts:同时支持 Windows 和 Mac OS X。

Icon 资源

Git Clients / Services

  • SourceTree:一款免费并且很酷的 Git 客户端,支持 Windows 和 Mac。
  • GitKraken (Beta):一款免费、直观、漂亮的跨平台 Git 客户端。
  • Tower 2:APP 很漂亮,需付费。
  • GitHub Client:官方客户端。
  • Gogs:一个极易搭建的自助 Git 服务。
  • GitLab:对私有项目也免费。

本地开发环境

  • XAMPP:完全免费,容易安装的 Apache 分布式环境。包括:MariaDB,PHP,Perl。
  • MAMP:Apache + MySQL + PHP + Python + Perl。
  • WampServer:Windows 下的 Web 开发环境,可以创建基于 Apache 2,PHP 和 MySQL 的 Web 应用。
  • Vagrant:安装和配置简单、轻量级。
  • Laragon:快速、容易搭建的 Windows 本地开发环境。包括:MySQL,PHP,Redis,Apache。

文件比对

  • Diffchecker:文件比对的在线网站。
  • Beyond Compare:老牌软件,能快速比较文件和文件夹,功能强大。

Code Sharing / Experimenting

  • codeshare:能和其他开发者实时共享代码。
  • JS Bin:可以将编辑后的代码保存到本地,或将 URL 地址发给其他人,让其协助调试代码。支持 HTML,CSS,JavaScript,Markdown,Jade 和 Sass。
  • JSfiddle:能自定义环境来测试你的 HTML,CSS,JavaScript 代码。
  • Dabblet:Web playground,交互效果不错。

团队协作

  • Slack:为团队打造的交流应用,我们部门就在用,强力推荐。
  • Trello:完全免费,灵活性高,可视化,和任何人一起管理任何事情。
  • Glip:支持实时消息、视频、视频会议、日历分享等等功能。
  • Asana:帮助追踪、记录团队成员的工作情况。
  • Jira:这个大家应该都用过吧,老牌团队协作应用。

激发灵感

  • CodePen:能在上面分享和找到出色的设计,还会有其他开发者为你提出建议。
  • Dribble:一个设计师分享他们作品的社区。

网站性能测试

  • Website Speed Test:KeyCDN 提供的免费网站调试工具。
  • Google PageSpeed Insights:测试之后还会提出优化意见。
  • WebPageTest:支持全球多地区速度测试和多种浏览器。
  • Pingdom:测试页面加载速度,为你找出性能瓶颈。
  • GTmetrix:不光能测试速度,还能帮助分析是否有法律风险,并提出优化建议。

Web 开发者社区


Web 开发资讯

  • wdrl.info:每周推送精心挑选的 Web 开发相关文章。
  • web tools weekly:主要推送 Web 开发工具。
  • webopsweekly.com:每周推送关于 Web 运营、部署等方面的文章。
  • /dev tips:每周分享开发小技巧。
  • friday front-end:每天在 twiiter 发开发相关资讯,可订阅然后每周发汇总邮件。
  • front-end dev weekly:手工挑选的 Web 开发、工具和创意资讯,每周推送。
  • smashingmagazine.com:面向 Web 设计师和开发者的一款在线杂志,内容质量很高,每个月的第二个星期二发布。

作者在原文中还分享了一些编辑器和开发语言,个人感觉都比较常见,故没有在这里列举出来,感兴趣的可以去原文查看。: )

原文地址:100+ Useful Web Development Tools and Resources.