🚀GitHub 上面向 Web 开发者的 10 个热门项目 - 2020 年 9 月 18 日

React Pro 侧边栏

刷卡器

SurveyJS 表单库

汉堡包

悬停.css

AdminJS

它解决了什么样的问题

《Trending Projects》以每周简讯形式提供，请在www.iainfreestone.com上注册，以确保您不会错过任何一期。

1. React Pro 侧边栏

可定制且响应迅速的反应侧边栏库，带有下拉菜单和无限数量的嵌套子菜单

azouaoui-med / react-pro-sidebar

React Pro Sidebar 提供了一组用于创建高级和可定制的侧边导航的组件

React Pro 侧边栏

React Pro Sidebar 提供了一组用于创建高级和可定制的侧边导航的组件

旧版本

v0.x

实时预览

截屏

安装

纱

yarn add react-pro-sidebar

npm

npm install react-pro-sidebar

用法

import { Sidebar, Menu, MenuItem, SubMenu } from 'react-pro-sidebar';

<Sidebar>
  <Menu>
    <SubMenu label="Charts">
      <MenuItem> Pie charts </MenuItem>
      <MenuItem> Line charts </MenuItem>
    </SubMenu>
    <MenuItem> Documentation </MenuItem>
    <MenuItem> Calendar </MenuItem>
  </Menu>
</Sidebar>;

使用 React Router

你可以利用componentprop 来集成React Router链接

示例用法

import { Sidebar, Menu, MenuItem } from 'react-pro-sidebar';
import { Link } from 'react-router-dom';
<Sidebar>
  <Menu

…

在 GitHub 上查看

2. 征服完成

让你的 Vim/Neovim 像 VSCode 一样智能。

neoclide / coc.nvim

用于 vim 和 neovim 的 Nodejs 扩展主机，加载 VSCode 等扩展并托管语言服务器。

让你的 Vim/Neovim 像 VS Code 一样智能

带有代码片段支持的自定义弹出菜单

为什么？

🚀快速：分离的 NodeJS 进程大多数时候不会减慢 Vim 的速度。
💎可靠：类型语言，经过 CI 测试。
🌟特色：支持所有 LSP 3.16 功能，请参阅:h coc-lsp。
❤️灵活：像 VS Code 一样配置，Coc 扩展的功能与 VS Code 扩展类似

快速入门

确保使用 Vim >= 9.0.0438 或 Neovim >= 0.8.0。

安装nodejs >= 16.18.0：

curl -sL install-node.vercel.app/lts | bash

对于vim-plug用户：

" Use release branch (recommended)
Plug 'neoclide/coc.nvim', {'branch': 'release'}

" Or build from source code by using npm
Plug 'neoclide/coc.nvim', {'branch': 'master', 'do': 'npm ci'}

在你的.vimrc或init.vim，然后...

在 GitHub 上查看

3. Bot框架SDK

Bot Framework 为构建对话应用程序提供了最全面的体验。借助 Bot Framework SDK，开发人员可以构建以自由形式或引导式交互进行对话的机器人，包括使用简单文本或包含文本、图像和操作按钮的丰富卡片。

微软/ botframework-sdk

Bot Framework 为构建对话应用程序提供了最全面的体验。

Bot Framework 有哪些新功能？

Bot Framework 为构建对话应用程序提供了最全面的体验。

借助Bot Framework SDK，开发人员可以构建自由形式对话或引导式交互的机器人，包括使用简单文本或包含文本、图像和操作按钮的丰富卡片。

开发人员可以使用他们最喜欢的编程语言（包括 C#、JS 和 Python）建模和构建复杂的对话，以便开发人员和多学科团队设计和构建对话体验。

查看 Bot Framework 生态系统部分，了解有关 Bot Framework SDK 相关的其他工具和服务的更多信息。

快速链接

Bot 框架 SDK v4

Bot Framework SDK v4 是一个开源 SDK，使开发人员能够使用他们喜欢的编程语言建模和构建复杂的对话。

C#	JS	Python
稳定版本	包	包	包
文档	文档	文档	文档
示例

…

在 GitHub 上查看

4.Swiper

Swiper 是一款免费且最现代化的移动触控滑块，拥有硬件加速的过渡效果和出色的原生行为。它旨在用于移动网站、移动 Web 应用以及移动原生/混合应用。

刷卡器

Swiper - 是一款免费且最现代化的移动触控滑块，拥有硬件加速过渡和出色的原生行为。它旨在用于移动网站、移动 Web 应用以及移动原生/混合应用。

Swiper 并不兼容所有平台，它是一款现代触摸滑块，仅专注于现代应用程序/平台，以带来最佳体验和简便性。

赞助商

特征

可摇树：只有您使用的模块才会被导入到您的应用程序包中。
适合移动设备：旨在用于移动网站、移动网络应用程序和移动原生/混合应用程序。
库无关：Swiper 不需要任何 JavaScript 库（例如 jQuery），这使得 Swiper 更小巧、运行速度更快。它可以安全地与 jQuery、Zepto、jQuery Mobile 等库一起使用。
1：1触摸移动：默认情况下，Swiper提供1：1的触摸移动交互，但是这个比例可以……

在 GitHub 上查看

5. Strapi

API 创建变得简单、安全、快捷。最先进的开源无头 CMS，轻松构建强大的 API。

斯特拉皮/斯特拉皮

🚀 Strapi 是领先的开源无头 CMS。它 100% 基于 JavaScript/TypeScript，完全可定制，并且以开发者为先。

开源无头 CMS，自托管或云，由您控制。

领先的开源无头 CMS，100% JavaScript/TypeScript，灵活且完全可定制。

云·尝试现场演示

Strapi 社区版是一款免费的开源无头 CMS，可让您在任何地方管理任何内容。

自托管或云：您可以按照自己的方式托管和扩展 Strapi 项目。您可以节省时间，直接部署到Strapi Cloud，或者部署到您想要的托管平台**：AWS、Azure、Google Cloud、DigitalOcean。
现代管理面板：优雅、完全可定制且完全可扩展的管理面板。
多数据库支持：您可以选择您喜欢的数据库：PostgreSQL、MySQL、MariaDB 和 SQLite。
可定制：您可以通过完全定制 API、路由或插件来快速构建您的逻辑，以完美满足您的需求。
速度极快且功能强大：Strapi 基于 Node.js 和 TypeScript 构建，可提供可靠且稳定的性能。
前端不可知论者：使用任何……

在 GitHub 上查看

6. Day.js

具有相同现代 API 的 Moment.js 的快速 2kB 替代方案

iamkun / dayjs

⏰ Day.js 2kB 不可变日期时间库，可替代 Moment.js，具有相同的现代 API

具有相同现代 API 的 Moment.js 的快速2kB替代方案

Day.js 是一个极简的 JavaScript 库，它使用与 Moment.js 高度兼容的 API，解析、验证、操作和显示适用于现代浏览器的日期和时间。如果您使用过 Moment.js，那么您已经知道如何使用 Day.js。

dayjs().startOf('month').add(1, 'day').set('year', 2018).format('YYYY-MM-DD HH:mm:ss');

🕒 熟悉的 Moment.js API 和模式
💪 不可变
🔥 可链接
🌐 I18n 支持
📦 2kb 迷你图书馆
👫 支持所有浏览器

入门

文档

您可以在day.js.org网站上找到更多详细信息、API 和其他文档。

安装

npm install dayjs --save

📚安装指南

API

使用 Day.js API 来解析、验证、操作和……非常容易。

在 GitHub 上查看

7. SurveyJS

SurveyJS 是一种向网站添加调查问卷和表单的现代化方法。它提供适用于 angular2+、jQuery、knockout、react 和 vue 的版本。

SurveyJS 表单库

SurveyJS 表单库是一个免费的 MIT 许可客户端组件，它允许您在任何 JavaScript 应用程序中呈现基于 JSON 的动态表单，收集响应，并将所有表单提交数据发送到您选择的数据库。您可以将其用于任意长度和复杂程度的多页表单、弹出式调查、测验、计分调查、计算器表单等。SurveyJS 表单库原生支持 React、Angular、Vue 和 Knockout； jQuery 通过 Knockout 版本的包装器获得支持。该库使用 JSON 对象与服务器交互——用于表单元数据（也称为表单 JSON 模式）和结果。SurveyJS产品系列还包含一个强大的表单构建器库，可自动生成 JSON 格式的表单配置文件。表单构建器具有拖放式 UI、CSS 主题编辑器以及用于条件逻辑和表单分支的 GUI。

文档·路线图·查看演示·生成 JSON ……

在 GitHub 上查看

8.汉堡包

Hamburgers 是一个美味的 CSS 动画汉堡图标合集。此外，它还包含一个 Sass 库作为源代码。它采用模块化设计，可自定义，所以您可以制作自己的汉堡包。

jonsuh /汉堡包

美味的CSS动画汉堡包

汉堡包

Hamburgers 是一个美味的 CSS 动画汉堡图标合集。此外，它还包含一个Sass库作为源代码。它采用模块化设计，可自定义，所以您可以制作自己的汉堡包。

用法

下载CSS 并将其包含在<head>您的网站中：

<link href="dist/hamburgers.css" rel="stylesheet">

添加基本汉堡标记：

<button class="hamburger" type="button">
  <span class="hamburger-box">
    <span class="hamburger-inner"></span>
  </span>
</button>

如果坚持的话，您可以使用<div>s，但它们不能作为菜单按钮访问。

<div class="hamburger">
  <div class="hamburger-box">
    <div class="hamburger-inner"></div>
  </div>
</div>

附加类名...

在 GitHub 上查看

9. Hover.css

一组 CSS3 支持的悬停效果，可应用于链接、按钮、徽标、SVG、精选图片等。您可以轻松应用于您自己的元素、进行修改或仅用于激发灵感。支持 CSS、Sass 和 LESS。

伊恩·伦恩/悬停

一组 CSS3 支持的悬停效果，可应用于链接、按钮、徽标、SVG、精选图片等。您可以轻松应用于您自己的元素、进行修改或仅用于激发灵感。支持 CSS、Sass 和 LESS。

悬停.css

演示|教程

内容

下载/安装

新公共管理（NPM）：npm install hover.css --save
鲍尔：bower install hover --save
下载 Zip

如何使用

Hover.css 有多种使用方式；您可以复制粘贴想要使用的效果到您自己的样式表中，也可以引用样式表。然后，只需将效果的类名添加到您想要的元素即可……

在 GitHub 上查看

10. 管理员兄弟

AdminBro 是一个可以插入到您的应用程序中的自动化管理界面。作为开发者，您只需提供数据库模型（例如帖子、评论、商店、产品或应用程序使用的其他任何内容），AdminBro 就会生成 UI，供您（或其他受信任的用户）管理内容。

SoftwareBrothers / adminjs

AdminJS 是一个用 node.js 编写的应用程序管理面板

AdminJS

AdminJS是一个可以插入到你的应用程序中的自动化管理界面。作为开发者，你只需提供数据库模型（例如帖子、评论、商店、产品或应用程序使用的其他任何内容），AdminJS 就会生成 UI，供你（或其他受信任的用户）管理内容。

灵感来自：django admin、rails admin和active admin。

示例应用程序

查看我们的演示应用程序：

登录：admin@example.com
密码：password

https://demo.adminjs.co

您还可以查看我们定制的 AdminJS 仪表板，其中显示各种库统计信息：

https://stats.adminjs.co

入门

查看文档
尝试上面提到的现场演示

我们在 Discord 上的开源社区

加入社区以获得帮助和启发。

它解决了什么样的问题

现在你已经有一个用 Node.js 构建的可用服务了。它使用（例如）Hapi.js来渲染一些 REST 路由，并使用 mongoose作为数据库连接器。

一切…

在 GitHub 上查看

《Trending Projects》以每周简讯形式提供，请在www.iainfreestone.com上注册，以确保您不会错过任何一期。

如果您喜欢这篇文章，您可以在 Twitter 上关注我，我会定期发布与 HTML、CSS 和 JavaScript 相关的简短技巧。

文章来源：https://dev.to/iainfreestone/10-trending-projects-on-github-for-web-developers-18th-september-2020-jfj

🚀GitHub 上针对 Web 开发者的 10 个热门项目 - 2020 年 9 月 18 日 React Pro Sidebar Swiper SurveyJS 表单库 Hamburgers Hover.css AdminJS 它解决了哪些问题

🚀GitHub 上面向 Web 开发者的 10 个热门项目 - 2020 年 9 月 18 日

React Pro 侧边栏

刷卡器

SurveyJS 表单库

汉堡包

悬停.css

AdminJS

它解决了什么样的问题

1. React Pro 侧边栏

azouaoui-med / react-pro-sidebar

React Pro Sidebar 提供了一组用于创建高级和可定制的侧边导航的组件

React Pro 侧边栏

旧版本

实时预览

截屏

安装

纱

npm

用法

使用 React Router

2. 征服完成

neoclide / coc.nvim

用于 vim 和 neovim 的 Nodejs 扩展主机，加载 VSCode 等扩展并托管语言服务器。

为什么？

快速入门

3. Bot框架SDK

微软/ botframework-sdk

Bot Framework 为构建对话应用程序提供了最全面的体验。

Bot Framework 有哪些新功能？

快速链接

Bot 框架 SDK v4

4.Swiper

nolimits4web / swiper

大多数现代移动触摸滑块都具有硬件加速转换功能

刷卡器

赞助商

特征

5. Strapi

斯特拉皮/斯特拉皮

🚀 Strapi 是领先的开源无头 CMS。它 100% 基于 JavaScript/TypeScript，完全可定制，并且以开发者为先。

开源无头 CMS，自托管或云，由您控制。

6. Day.js

iamkun / dayjs

⏰ Day.js 2kB 不可变日期时间库，可替代 Moment.js，具有相同的现代 API

入门

文档

安装

API

7. SurveyJS

surveyjs /调查库

免费的 JavaScript 表单构建器库，集成 React、Angular、Vue、jQuery 和 Knockout。

SurveyJS 表单库

8.汉堡包

jonsuh /汉堡包

美味的CSS动画汉堡包

汉堡包

目录

用法

9. Hover.css

伊恩·伦恩/悬停

一组 CSS3 支持的悬停效果，可应用于链接、按钮、徽标、SVG、精选图片等。您可以轻松应用于您自己的元素、进行修改或仅用于激发灵感。支持 CSS、Sass 和 LESS。

悬停.css

内容

下载/安装

如何使用

10. 管理员兄弟

SoftwareBrothers / adminjs

AdminJS 是一个用 node.js 编写的应用程序管理面板

AdminJS

示例应用程序

入门

我们在 Discord 上的开源社区

它解决了什么样的问题