🚀2020年7月17日,GitHub上面向Web开发者的十大热门项目
超级表现力
快速地
Phaser - HTML5 游戏框架
表格图标
类星体框架
MDX:组件时代的 Markdown
🚀
安装
维特
⚡
GitHub个人资料自述文件生成器
《热门项目》以每周新闻简报的形式提供,请访问www.iainfreestone.com注册,以确保您不会错过任何一期。
1. 超级表现力
Super Expressive 是一个 JavaScript 库,它允许您使用几乎自然的语言构建正则表达式——无需额外的依赖项,并且代码占用空间很小(压缩 + gzip 后小于 3kb!)。
🦜 Super Expressive 是一个零依赖的 JavaScript 库,用于构建(几乎)自然语言的正则表达式。
超级表现力

Super Expressive是一个 JavaScript 库,它允许您使用几乎自然的语言构建正则表达式——无需额外的依赖项,并且代码占用空间很小(压缩 + gzip 后小于 4kb!)。
为什么?
正则表达式功能强大,但其简洁晦涩的词汇使得编写和与他人交流正则表达式成为一项挑战。即使是精通正则表达式的开发者,几个月后也可能难以理解自己编写的正则表达式!此外,它们也无法……
2. React Hook 表单
高性能、灵活且可扩展的表单,并带有易于使用的验证功能。
📋 React Hooks 用于表单验证(Web + React Native)
版本 7 |版本 6
特征
安装
npm install react-hook-form
链接
快速入门
import React from ' react' ;
import { useForm } from 'react-hook-form' ;
function App ( ) {
const {
register ,
handleSubmit ,
formState : { errors } ,
} = useForm ( ) ;
const onSubmit = ( data ) = > console.log ( data ) ;
return (
< form onSubmit = { handleSubmit ( onSubmit ) } >
< input { ... register ( 'firstName' ) } / > { /* 注册一个输入框 */ }
< input…
3. 微软快速
这是 FAST 的单体仓库,其中包含 Web 组件包、工具、示例和文档。FAST 技术既可以单独使用,也可以作为一套完整的解决方案来构建企业级网站、应用程序、组件、设计系统等等。

快速地



这是 FAST 的单体仓库,其中包含 Web 组件包、工具、示例和文档。FAST 技术既可以单独使用,也可以作为一套完整的解决方案来构建企业级网站、应用程序、组件、设计系统等等。
⭐
感谢您的好评,这对我们很有帮助!
介绍
FAST 是一套基于 Web 组件和现代 Web 标准的技术集合,旨在帮助您高效地应对网站和应用程序设计与开发中一些最常见的挑战。
太长不看
- 基于Web组件标准创建可重用的UI组件。
- 在您的应用程序中使用我们标准的预构建 Web 组件库。
- 在两种自适应设计系统之间进行选择:Fluent Design 和 FAST Frame。
- 无需重新实现组件逻辑,即可构建您自己的设计系统。
- 可与任何前端框架或构建系统集成。
有关 FAST 的深入解释,请参阅我们的文档介绍。
包裹
@microsoft/fast-element

该@microsoft/fast-element库是一种轻量级工具,可以轻松构建高性能应用程序……
4.相位器
Phaser 是一款快速、免费且有趣的开源 HTML5 游戏框架,支持在桌面和移动浏览器上进行 WebGL 和 Canvas 渲染。游戏可以通过第三方工具编译成 iOS、Android 和原生应用。您可以使用 JavaScript 或 TypeScript 进行开发。
Phaser 是一个有趣、免费且快速的 2D 游戏框架,用于制作适用于桌面和移动网络浏览器的 HTML5 游戏,支持 Canvas 和 WebGL 渲染。
5. Tabler 图标
这是一套包含超过 550 个免费 MIT 许可的高质量 SVG 图标的合集,供您在网页项目中使用。每个图标均采用 24x24 网格设计,并带有 2 像素的描边。
Devicon 拥有 78 个图标和 200 多个版本,而且还在不断增加!
一套包含超过 1250 个免费 MIT 许可的高质量 SVG 图标,供您在 Web 项目中使用。
表格图标
一套包含超过 1250 个免费 MIT 许可的高质量 SVG 图标,供您在网页项目中使用。每个图标都采用 24x24 网格设计,并带有2px描边。
如果你想支持我的项目并帮助我发展它,你可以在GitHub上成为赞助者,或者直接通过PayPal捐款:)
图标搜索:https://tabler-icons.io/
赞助商
预览

赞助商展台

安装
npm install @tabler/icons --save
或者直接从Github下载。
用法
所有图标均采用 SVG 格式构建,因此您可以将它们作为 <img> 标签放置<img>在background-imageHTML 代码中,也可以内联放置。
HTML图像
如果将图标加载为图像,则可以使用 CSS 修改其大小。
< img src =" path/to/icon.svg " alt ="图标标题" />
内联 HTML
您可以将图标文件的内容粘贴到您的 HTML 代码中,以便在页面上显示它。
< a href =""
…
6. 类星体
以创纪录的速度构建高性能的 VueJS 用户界面:响应式单页应用、SSR 应用、PWA、浏览器扩展、混合移动应用和 Electron 应用。如果您愿意,所有这些都可以使用同一套代码库!
Quasar框架 - 在创纪录的时间内构建高性能的VueJS用户界面
7. MDX:组件时代的 Markdown
MDX 是一种可编辑的 Markdown 格式,它允许您在 Markdown 文档中无缝使用 JSX。您可以导入组件(例如交互式图表或通知),并导出元数据。这使得使用组件编写长篇内容变得轻松愉快。
Markdown 中的 JSX,助力雄心勃勃的项目
MDX:组件时代的 Markdown
🚀

MDX是一种可编辑的格式,可让您在 Markdown 文档中无缝使用 JSX。您可以导入组件(例如交互式图表或通知),并导出元数据。这使得使用组件编写长篇内容变得非常有趣。
例子
观看 MDX 的实际应用:
import { Chart } from '../components/chart'
#这里有 一张 图表
图表 呈现在我们的MDX 文档中。
<图表 / >
引言
MDX 是面向组件时代的 Markdown。它允许你在 Markdown 中嵌入 JSX 代码。这是一个绝佳的组合,因为它既能让你使用 Markdown 通常简洁的语法(例如 `<div> # heading`)来处理简单的功能,又能让你使用 JSX 来构建更高级的组件。
❤️
功能强大:MDX 融合了 Markdown 和 JSX 语法,完美适用于基于 React/JSX 的项目。
💻
一切皆组件:在 MDX 中使用现有组件,并将其他 MDX 文件作为普通文件导入……
8. Video.js
Video.js 是一款专为 HTML5 环境从零开始构建的网页视频播放器。它支持 HTML5 和 Flash 视频,以及 YouTube 和 Vimeo(通过插件)。它支持在桌面和移动设备上播放视频。
Video.js - 开源 HTML5 和 Flash 视频播放器



Video.js 是一款专为 HTML5 环境从零开始构建的 Web 视频播放器。它支持 HTML5 视频和媒体源扩展 (MSE),以及其他播放技术,例如 YouTube 和 Vimeo(通过插件)。它支持在桌面和移动设备上播放视频。该项目始于 2010 年中期,如今该播放器已被应用于超过 100 款设备。
50,000
100,000
20万
40万60万个网站。
目录
快速入门
感谢Fastly的各位,他们提供了一个免费的、托管在 CDN 上的 Video.js 版本,任何人都可以使用。请将以下标签添加到您的文档中<head>:
< link href =" // vjs.zencdn.net/7.10.2/video-js.min.css " rel =" stylesheet " >
< script src =" // vjs.zencdn.net/7.10.2/video.min.js " > </script>
要获取最新版本的 video.js 和要使用的 URL,请查看“入门指南”页面……
9. 概要
一个使用 React 和 Node.js 构建的、开放的、可扩展的团队 wiki。
适用于成长型团队的最快维基和知识库。界面美观、功能丰富,并兼容 Markdown 格式。

一个使用 React 和 Node.js 构建的开放、可扩展的团队 wiki。
访问www.getoutline.com ,体验我们托管的 Outline 版本。


这是运行Outline及其所有相关服务的源代码。如果您想使用 Outline,则无需运行此代码,我们在getoutline.com上提供该应用的托管版本。
如果你想运行自己的 Outline 版本或参与开发,那么这里就是你的理想之地。
安装
Outline 需要以下依赖项:
自托管制作
Docker
对于手动自托管的生产环境安装,建议采取以下步骤:
-
首先需要搭建 Redis 和 Postgres 服务器,这超出了本指南的范围。
-
下载最新的官方 Docker 镜像,新版本已发布……
10. 维特
Vite 是一款具有鲜明风格的 Web 开发构建工具,它在开发过程中通过原生 ES 模块导入来提供代码,并在生产环境中将其与 Rollup 打包。

维特
⚡
下一代前端工具
-
💡
立即启动服务器
-
⚡️
闪电般快速的HMR
-
🛠️
丰富的功能
-
📦
优化构建
-
🔩
通用插件接口
-
🔑
完全类型化的 API
Vite(法语意为“快速”,发音为[ˈvɪt] /vit/)是一款新型前端构建工具,可显著提升前端开发体验。它由两大部分组成:
此外,Vite 通过其插件 API和JavaScript API具有高度可扩展性,并完全支持类型输入。
阅读文档了解更多信息。
从 1.x 版本迁移
如果您是从 1.x 版本升级,请查看迁移指南。
包裹
…
《热门项目》以每周新闻简报的形式提供,请访问www.iainfreestone.com注册,以确保您不会错过任何一期。
如果你喜欢这篇文章,可以关注我的推特账号,我会定期发布与HTML、CSS和JavaScript相关的实用技巧。
文章来源:https://dev.to/iainfreestone/10-trending-projects-on-github-for-web-developers-17th-july-2020-17ka