【前端开发】很棒的前端开发资源

Trend Micro

CSS Styles

• trendmicro-ui - CSS styles for creating a user interface according to Trend Micro UI style guides.

Linter

• eslint-config-trendmicro - This package provides .eslintrc as an extensible shared config.

Component Generator

• react-component-template - React component template.

React Components

• react-anchor - React Anchor component (demo).
• react-breadcrumbs - React Breadcrumbs component (demo).
• react-buttons - React Buttons component (demo).
• react-checkbox - React Checkbox component (demo).
• react-datepicker - React DatePicker component (demo).
• react-dropdown - React Dropdown component (demo).
• react-form-control - React Form Control component (demo).
• react-grid-system - React Grid System component (demo).
• react-iframe - React iFrame component (demo).
• react-interpolate - A React component that renders elements into a format string containing replacement fields (demo).
• react-liquid-gauge - React Liquid Gauge component (demo).
• react-loader - React Loader component (demo).
• react-modal - React Modal component (demo).
• react-navs - React Navs component (demo).
• react-navbar - React Navbar component (demo).
• react-notifications - React Notifications component (demo).
• react-paginations - React Paginations component (demo).
• react-popover - React Popover component (demo).
• react-portal - React Portal component (demo).
• react-radio-button - React Radio Button component (demo).
• reacr-sidenav - React SideNav component (demo).
• react-table - React Table component (demo).
• react-toggle-switch - React Toggle Switch component (demo).
• react-tooltip - React Tooltip component (demo).
• react-validation - React Validation component (demo).

---

Ask Me Anything

• https://github.com/sindresorhus/ama
• https://github.com/kentcdodds/ama

Audio

• Tone.js - A Web Audio framework for making interactive music in the browser.

Awesome

• awesome - A curated list of awesome lists.
• awesome-creative-coding - 🎨 Creative Coding, Generative Art, Interaction Design, Resources.
• awesome-docker - A curated list of Docker resources and projects.
• awesome-electron - Useful resources for creating apps with Electron.
• awesome-iot - A curated list of awesome Internet of Things projects and resources.
• awesome-nodejs - A curated list of delightful Node.js packages and resources.
• awesome-programming-for-kids - A curated list of resources for teaching kids programming.
• awesome-react - A collection of awesome things regarding React ecosystem.
• awesome-redux - Awesome list of Redux examples and middlewares.
• awesome-vue - A curated list of awesome things related to Vue.js.

Algorithms

• AlgorithmVisualizer - Algorithm Visualizer.
• @trekhleb/javascript-algorithms - Algorithms and data structures implemented in JavaScript with explanations and links to further readings.
• @mgechev/javascript-algorithms - JavaScript implementation of different computer science algorithms.

Animation

• scenejs - 🎬 Scene.js is JavaScript & CSS timeline-based animation library. http://daybrush.com/scenejs/

Authentication

• passport - Simple, unobtrusive authentication for Node.js.
• passport-saml - SAML 2.0 authentication with Passport.

Automation

• chromeless - 🖥 Chrome automation made simple. Runs locally or headless on AWS Lambda.
• headless-recorder - Headless recorder is a Chrome extension that records your browser interactions and generates a Puppeteer or Playwright script.
• playwright - Node.js library to automate Chromium, Firefox and WebKit with a single API. https://playwright.dev/
• probot - 🤖 A framework for building GitHub Apps to automate and improve your workflow. https://probot.github.io
• puppeteer - Headless Chrome Node API.
• puppeteer-recorder - Puppeteer recorder is a Chrome extension that records your browser interactions and generates a Puppeteer script.
• robotjs - Node.js Desktop Automation. Control the mouse, keyboard, and read the screen.

Boilerplate

• babel-plugin-boilerplate - A setup to get you started on building babel plugins.
• electron-react-boilerplate - Live editing development on desktop app.
• html5-boilerplate - A professional front-end template for building fast, robust, and adaptable web apps or sites.

Books

• You-Dont-Know-JS - A book series on JavaScript. @YDKJS on twitter.
• react-in-patterns - A free book that talks about design patterns/techniques used while developing with React. https://www.gitbook.com/book/krasimir/react-in-patterns/

Build Tools

• browserify - Browser-side require() the node.js way.
• eslint - A fully pluggable tool for identifying and reporting on patterns in JavaScript.
• extract-text-webpack-plugin - Extract text from bundle into a file.
• gulp - The streaming build system.
• html-webpack-plugin - Simplifies creation of HTML files to serve your webpack bundles.
• lodash-webpack-plugin - Smaller modular Lodash builds.
• node-gyp - Node.js native addon build tool.
• node-pre-gyp - Node.js tool for easy binary deployment of C++ addons.
• parallel-webpack - Builds multi-config webpack projects in parallel.
• rollup - Next-generation ES6 module bundler. http://rollupjs.org
• size-limit - Prevent JS libraries bloat. If you accidentally add a massive dependency, Size Limit will throw an error.
• webpack - A module bundler that bundles JavaScript and other assets for the browser.
• webpack-blocks - 📦 Configure webpack using functional feature blocks.
• webpack-dashboard - A CLI dashboard for webpack dev server.

Cheatsheet

• modern-js-cheatsheet - Cheatsheet for the JavaScript knowledge you will frequently encounter in modern projects.
• react-component-composition-cheatsheet - React component composition cheatsheet.
• react-native-styling-cheat-sheet - Most of the React Native styling material in one page.
• react-redux-cheatsheet - React Redux Cheat Sheet on Workflow & Concept.

Color

• color - 🌈 Javascript color conversion and manipulation library
• color-name - A JSON with color names.
• colornames - Map color names to HEX color values.

Command-line & Terminal Utilities

• blessed - A high-level terminal interface library for node.js.
• chalk - Terminal string styling done right.
• cli-table - Pretty unicode tables for the CLI with Node.js.
• commander.js - Node.js command-line interfaces made easy.
• Inquirer.js - A collection of common interactive command line user interfaces.
• node-progress - Flexible ascii progress bar for nodejs.
• playwright-cli - CLI for common Playwright actions. Record and generate Playwright code, inspect selectors and take screenshots.
• shelljs - Portable Unix shell commands for Node.js.
• terminalizer - 🦄 Record your terminal and generate animated gif images.
• xterm.js - Full xterm terminal, in your browser. http://xtermjs.org/

Compiler

• emscripten - Emscripten: An LLVM-to-JavaScript Compiler. http://kripken.github.io/emscripten-site/

Computer Vision

• node-opencv - OpenCV Bindings for node.js.
• tracking.js - A modern approach for Computer Vision on the web.

Control Flow

• async - Async utilities for node and the browser.
• co - The ultimate generator based flow-control goodness for nodejs (supports thunks, promises, etc).

CSS

• 30-seconds-of-css - A curated collection of useful CSS snippets. https://atomiks.github.io/30-seconds-of-css/
• animate.css - A cross-browser library of CSS animations. As easy to use as an easy thing.
• css-modules - A CSS file in which all class names and animation names are scoped locally by default.
• normalize.css - A collection of HTML element and attribute style-normalizations.
• postcss - Transforming styles with JS plugins.
• purifycss - Remove unused CSS. Also works with single-page apps.
• styled-components - Comparing different ways to style components.
• uncss - Remove unused styles from CSS.

CSS Preprocessor

• Less - Leaner CSS.
• Sass - Sass makes CSS fun again.
• Stylus - Expressive, robust, feature-rich CSS language built for nodejs.

Data Visualization

• c3 - A D3-based reusable chart library.
• Chart.js - Simple HTML5 Charts using the <canvas> tag. http://www.chartjs.org/
• d3 - Bring data to life with SVG, Canvas and HTML.
• d3-node - Server-side D3 for static chart/map generation.
• recharts - Redefined chart library built with React and D3. http://recharts.org
• vx - react + d3 = vx | visualization components. https://vx-demo.now.sh/

Database

• mongojs - Node.js module that implements the offical mongo api.

Date

• moment - Parse, validate, manipulate, and display dates in javascript.
• moment-timezone - Timezone support for moment.js.

Debugging

• ndb - ndb is an improved debugging experience for Node.js, enabled by Chrome DevTools.

Deep Learning

• convnetjs - Deep Learning in Javascript. Train Convolutional Neural Networks (or ordinary ones) in your browser.

Documentation

• apidoc - RESTful web API Documentation Generator.
• documentation - Beautiful, flexible, powerful js docs.

DOM

• class-list - A cross-browser class list.
• component-delegate - Event delegation component.
• delegate-dom - Event delegation library.
• element-class - Like .addClass and .removeClass from jquery but without dependencies.
• dom-classes - Cross-browser element class manipulation.
• dom-events - DOM event binding and emitting.
• dom-select - Select DOM.
• dom-style - Library to manipulate CSS properties.
• dom-value - Get / set form input values.
• dom-to-image - Generates an image from a DOM node using HTML5 canvas.
• in-view - Get notified when a DOM element enters or exits the viewport.
• is-dom - Check if the given object is a dom node.
• jsdom - A JavaScript implementation of the WHATWG DOM and HTML standards, for use with Node.js.
• offset - Get the xy offset of an element.
• synthetic-dom-events - Create DOM events for builtin event types.

Electron

• electron-tabs - Simple tabs for Electron applications.

Feature Control - LaunchDarkly

• featureflags - The guide to decoupling feature rollout from code deployment for feature flag-driven development. Feature flags give a software organization the power to reduce risk, iterate quicker, and get more control.
• js-client-sdk - LaunchDarkly Client-side SDK for Browser JavaScript.
• js-sdk-common - Code shared between all LaunchDarkly client-side JS-based SDKs.
• node-server-sdk - LaunchDarkly Server-side SDK for Node.js.
• node-client-sdk - LaunchDarkly Client-side SDK for Node.js.
• react-client-sdk - LaunchDarkly Client-side SDK for React.js.

Frontend Performance

• Front-End-Performance-Checklist - 🎮The only Front-End Performance Checklist that runs faster than the others.

Game

• boardgame - State management and more for turn based games. http://boardgame.io/
• gamepad - Gamepad specification.

Graphics

• charts - Simple, responsive, modern SVG Charts with zero dependencies (https://frappe.github.io/charts).
• chartjs - Simple HTML5 Charts using the <canvas> tag (http://www.chartjs.org/).
• node-canvas - Node canvas is a Cairo backed Canvas implementation for NodeJS.
• obelisk.js - JavaScript library for building pixel isometric graphics with HTML5 canvas.
• sigma.js - A JavaScript library dedicated to graph drawing.
• three.js - JavaScript 3D library.

Grid

• grid - Drag and drop library for two-dimensional, resizable and responsive lists.

HTTP

• node-fetch - A light-weight module that brings window.fetch to node.js and io.js.
• node-http-proxy - A full-featured http proxy for node.js
• request - Simplified HTTP request client.
• superagent - Ajax with less suck - (and node.js HTTP client to match).

I18n

• i18next - An internationalization framework.
• i18next-scanner - Scan your code, extract translation keys/values, and merge them into i18n resource files.

Icon Fonts

• feather - Simply beautiful open source icons. https://feathericons.com
• font-awesome - The iconic font and CSS toolkit.

Image Processing

• color-thief - Grabs the dominant color or a representative color palette from an image. Uses javascript and canvas.
• cropper - A simple jQuery image cropping plugin.
• cropperjs - JavaScript image cropper.
• pixelmatch - The smallest, simplest and fastest JavaScript pixel-level image comparison library.
• zooming - Image zoom that makes sense. http://desmonding.me/zooming/

Inversion of Control

• awilix - Extremely powerful Inversion of Control (IoC) container for Node.JS.
• awilix-express - Awilix helpers/middleware for Express.

IoT

• cylon - JavaScript framework for robotics, drones, and the Internet of Things (IoT).
• Espruino - The Espruino JavaScript interpreter.
• johnny-five - JavaScript Robotics and IoT programming framework.
• node-hid - Access USB HID devices through Node.JS.
• node-red - A visual tool for wiring the Internet of Things
• node-serialport - Node.js package to access serial ports for reading and writing OR Welcome your robotic JavaScript overlords.
• node-usb - Improved USB library for NodeJS.

Job Scheduling and Queues

• agenda - ightweight job scheduling for Node.js.
• agendash - Agenda Dashboard.
• agenda-rest - Scheduling as a Service.
• bull - Premium Queue package for handling distributed jobs and messages in NodeJS.

Json Web Token (JWT)

• express-jwt - connect/express middleware that validates a JsonWebToken (JWT) and set the req.user with the attributes.
• node-jsonwebtoken - JsonWebToken implementation for node.js.
• socketio-jwt - Authenticate socket.io incoming connections with JWTs.

Logging

• universal-logger - A universal logging library for Node and the browser.
• universal-logger-browser - Browser plugins for universal logger.
• winston - A multi-transport async logging library for node.js.

Machine Learning

• brain.js - 🤖 Neural networks in JavaScript http://brain.js.org
• ml5-library - Friendly machine learning for the web! 🤖 https://ml5js.org
• tfjs - A WebGL accelerated, browser based JavaScript library for training and deploying ML models. https://js.tensorflow.org
• tfjs-examples - Examples built with TensorFlow.js. https://js.tensorflow.org/

Markdown

• render-markdown-javascript - Renders markdown files to HTML with highlighted code blocks BUT ALSO RENDERS THE JAVASCRIPT ONES.

Math

• big - A small, fast JavaScript library for arbitrary-precision decimal arithmetic.
• bignumber.js - A JavaScript library for arbitrary-precision decimal and non-decimal arithmetic.
• expr-eval - Mathematical expression evaluator in JavaScript.
• frac - ➗ Rational approximation with bounded denominator. http://oss.sheetjs.com/frac/

Mail

• nodemailer - Send e-mails with Node.JS – easy as cake!

Messaging Applications

• amqp.node - AMQP 0-9-1 library and client for Node.js. https://squaremo.github.io/amqp.node/

Micro Frontend

• oc - OpenComponents, serverless in the front-end world for painless micro-frontends delivery. https://opencomponents.github.io/
• qiankun - 📦🚀Blazing fast, simple and completed solution for micro frontends.
• simple-single-spa-webpack-example - A simple example of how to use webpack with single-spa.
• single-spa - Microfrontends made easy. https://single-spa.js.org/
• [single-spa-examples](https://github.com/CanopyTax/single-spa-examples] - Examples of single-spa applications. https://single-spa.surge.sh
• tailor - A streaming layout service for front-end microservices. http://www.mosaic9.org

Micro-generator Framework

• plop - Micro-generator framework that makes it easy for an entire team to create files with a level of uniformity.

Notifications

• HTML5-Desktop-Notifications - Desktop notifications plugin for Chrome, Safari, Firefox and IE9.
• notify.js - A handy wrapper for the Web Notifications API.
• push.js - A compact, cross-browser solution for Javascript desktop notifications.

Object

• deepmerge - A library for deep (recursive) merging of Javascript objects.
• defaults-deep - Like extend but recursively copies only the missing properties/values to the target object.
• flat - 🚂 Flatten/unflatten nested Javascript objects
• merge-deep - Recursively merge values in a JavaScript object.
• omit-deep - Recursively omit specified keys from an object.
• pretty-format - ✨ Stringify any JavaScript value.
• sort-object - Sort the keys in an object.
• sortobject - Deeply sort an object by its keys without mangling any arrays inside of it.

P2P

• p2p-graph - Real-time P2P network visualization with D3.
• peerjs - Simple peer-to-peer with WebRTC.
• webtorrent - ⚡ Streaming torrent client for the web.
• discovery-channel - Search for a key across multiple discovery networks and find peers who answer.
• discovery-server - A tcp/utp server that auto announces itself using discovery-channel.
• discovery-swarm - A network swarm that uses discovery-channel to find peers.

Polyfill

• babel-polyfill - Provides polyfills necessary for a full ES2015+ environment.
• es5-shim - ECMAScript 5 compatibility shims for legacy (and modern) JavaScript engines.
• es6-shim - ECMAScript 6 compatibility shims for legacy JavaScript engines.
• es6-symbol - ECMAScript 6 Symbol polyfill.
• es7-shim - ECMAScript 7 compatibility shims for legacy JavaScript engines.
• fetch - A window.fetch JavaScript polyfill.
• polyfill - JavaScript Polyfills, Shims and More.
• polyfill-service - Automatic polyfill service. https://polyfill.io/v2/docs/
• webvr-polyfill - Use WebVR today, without requiring a special browser build.

Presentation

• cleaver - 30-second slideshows for hackers. http://jdan.github.io/cleaver
• code-surfer - Rad code slides <🏄/>. https://codesurfer.pomb.us/
• mdx-deck - ♠️ React MDX-based presentation decks. https://mdx-deck.jxnblk.com
• reveal.js - The HTML Presentation Framework.
• spectacle - ReactJS based Presentation Library.
• spectacle-boilerplate - Boilerplate project for getting started with Spectacle Core.
• spectacle-code-slide - 🤘 Present code with style.
• spectacle-editor - Drag and drop Spectacle editor.

Private NPM

• verdaccio - A lightweight private npm proxy registry (sinopia fork).

Productivity

• pre-commit - Automatically installs a git pre-commit script in your git repository which runs your npm test on pre-commit.
• pre-push - Adiciona hook para pre-push do git.

Protocol Buffers

• protobuf.js - Protocol Buffers for JavaScript (& TypeScript).
• protocol-buffers - Protocol Buffers for Node.js.
• protocol-buffers-encodings - Base encodings for protocol-buffers.

React

• create-react-app - Create React apps with no build configuration.
• flux-standard-action - A human-friendly standard for Flux action objects.
• formsy-react - A form input builder and validator for React JS.
• drei - 🌭 useful helpers for react-three-fiber. https://drei.pmnd.rs/
• qrcode.react - A component for use with React.
• grid-styled - Responsive React grid system built with styled-components.
• immer - Create the next immutable state by mutating the current one.
• ink - 🌈 React for interactive command-line apps.
• react - A declarative, efficient, and flexible JavaScript library for building user interfaces.
• react-a11y - Identifies accessibility issues in your React.js elements.
• react-addons-css-transition-group - A ReactTransitionGroup add-on component as a low-level API for animation, and a ReactCSSTransitionGroup for easily implementing basic CSS animations and transitions.
• react-addons-pure-render-mixin - A performance booster under certain situations.
• react-addons-shallow-compare - A helper function to achieve the same functionality as PureRenderMixin while using ES6 classes with React.
• react-animate-height - Lightweight React component for animating height using CSS transitions. Slide up/down the element, and animate it to any specific height. https://muffinman.io/react-animate-height
• react-animated-tree - 🌲Simple to use, configurable tree view with full support for drop-in animations.
• react-animations - 🎊 A collection of animations for inline style libraries.
• react-anything-sortable - A ReactJS component that can sort any children with touch support and IE8 compatibility.
• react-async-hook - React hook to handle any async operation in React components, and prevent race conditions.
• react-base-table - A react table component to display large datasets with high performance and flexibility. https://autodesk.github.io/react-base-table/
• react-blessed - A react renderer for blessed.
• react-bootstrap - Bootstrap 3 components built with React.
• react-circle - Renders a svg circle + progress, it just works 💘. https://zzarcon.github.io/react-circle
• react-click-outside - ClickOutside component for React.
• react-clock - An analog clock for your React app. http://projects.wojtekmaj.pl/react-clock
• react-codemod - React codemod scripts.
• react-collapse - Component-wrapper for collapse animation with react-motion for elements with variable (and dynamic) height.
• react-color - 🎨 Color Pickers from Sketch, Photoshop, Chrome, Github, Twitter & more.
• react-content-loader - ⚪ SVG-Powered component to easily create placeholder loadings (like Facebook cards loading). http://danilowoz.com/create-content-loader/
• react-contexify - Add a context menu to your react app with ease.
• react-countup - 💫 A configurable React component wrapper around CountUp.js. https://react-countup.now.sh
• react-csv - React components to build CSV files on the fly basing on Array/literal object of data. http://elegance.abdennoor.com/react-csv/
• react-custom-scrollbars - React scrollbars component.
• react-datepicker - A simple and reusable datepicker component for React.
• react-dates - An accessible, easily internationalizable, mobile-friendly datepicker library for the web.
• react-datetime - A lightweight but complete datetime picker react component.
• react-detect-offline - Offline and Online components for React.
• react-dnd - Drag and Drop for React.
• react-draggable - React draggable component.
• [react-dropzone](Convert hierarchical tree structure to flat structure.) - Simple HTML5 drag-drop zone with React.js.
• react-enroute - React router with a small footprint for modern browsers.
• react-event-timeline - A responsive event timeline in React.js.
• react-extras - Useful components and utilities for working with React.
• react-facebook-login - A Component React for Facebook Login.
• react-faq - A collection of links to help answer your questions about React.js.
• react-favicon - Set or animate your React app's favicon.
• react-final-form - 🏁 High performance subscription-based form state management for React.
• react-flow - Highly customizable library for building interactive node-based UIs, editors, flow charts and diagrams.
• react-fns - Modern React components, render-props, hoc's, and utility functions.
• react-grid-layout - A draggable and resizable grid layout with responsive breakpoints, for React.
• react-grid-system - A no CSS Bootstrap-like responsive grid system for React.
• react-hi-text - React text highlight component.
• react-highlight-words - React component to highlight words within a larger body of text.
• react-horizontal-timeline - A Timeline component.
• react-hotkeys - Declarative hotkey and focus area management for React.
• react-icon-base - base icon for https://github.com/gorangajic/react-icons.
• react-icons - ❤️ svg react icons of popular icon packs http://gorangajic.github.io/react-icons.
• react-idle - Notifies your app when the user is idle.
• react-image-crop - A responsive image cropping tool for React.
• react-infinite - A browser-ready efficient scrolling container based on UITableView.
• react-infinite-calendar - ✨ Infinite scrolling date-picker built with React, with localization, range selection, themes, keyboard support, and more.
• react-infinite-tree - The infinite-tree library for React.
• react-joyride - Create walkthroughs and guided tours for your features.
• react-lines-ellipsis - Simple multiline ellipsis component for React.JS. https://xiaody.github.io/react-lines-ellipsis/
• react-liquid-gauge - React Liquid Gauge component.
• react-loadable - A higher order component for loading components with promises.
• react-modal - Accessible modal dialog component for React.
• react-motion - A spring that solves your animation problems.
• react-movable - 🔀 Drag and drop for your React lists and tables. Accessible. Tiny. https://react-movable.netlify.com
• react-move - React Move 🌀 Beautiful, data-driven animations for React. https://react-move.js.org
• react-music - Make beats with React!
• react-native - A framework for building native apps with React.
• react-overflow-indicator - Detect overflow and render shadows, fades, arrows, etc.
• react-pdf - Display PDFs in your React app as easily as if they were images. http://projects.wojtekmaj.pl/react-pdf
• react-pdf - Create PDF files using React.
• react-perimeter - Create an invisible perimeter around an element and respond when its breached.
• react-placeholder - A React component to easily replicate your page with nice placeholders while the content is loading.
• react-pledge - Declarative way to track promise lifecycle states using "render props" 🕶.
• react-popover - React wrapper around Popper.js (official). https://fezvrasta.github.io/react-popper/
• react-range - 🎚️Range input with a slider. Accessible. Bring your own styles and markup. https://react-range.netlify.app/
• react-redux - Official React bindings for Redux.
• react-repeatable - A press and hold wrapper component that can trigger hold action multiple times while holding down.
• react-resizable - A simple React component that is resizable with a handle.
• react-resize-observer-hook - ResizeObserver + React hooks. https://zzarcon.github.io/react-resize-observer-hook/
• react-responsive - Media queries in react for responsive design.
• react-router - A complete routing library for React.
• react-scroll-shadow - Pure CSS shadow to indicate more content in scrollable area. https://zzarcon.github.io/react-scroll-shadow/
• react-selection - Like the normal OS selection.
• react-sidebar - A sidebar component for React.
• react-simple-chatbot - 💬 Easy way to create conversation chats. https://lucasbassetti.com.br/react-simple-chatbot/
• react-slick - React carousel component. http://react-slick.neostack.com/
• react-sortable - A React component built on top of Sortable.
• react-sparklines - Beautiful and expressive Sparklines React component.
• react-spring - ✌️ A spring physics based React animation library. https://www.react-spring.io
• react-spring-examples - React spring examples.
• react-sticky - component for awesome React apps.
• react-tappable - Tappable component for React.
• react-timer-hook - React timer hook.
• react-toggled - Component to build simple, flexible, and accessible toggle components. https://codesandbox.io/s/m38674w9vy
• react-toolbox - A set of React components implementing Google's Material Design specification with the power of CSS Modules.
• react-three-fiber - ☘️ React renderer for Threejs (web and react-native) https://spectrum.chat/react-three-fiber
• react-toastify - React notification made easy 🚀! https://fkhadra.github.io/react-toastify
• react-toast-notifications - 🍞 A toast notification system for react. https://jossmac.github.io/react-toast-notifications/
• react-to-print - Print React components in the browser. Supports Chrome, Safari, Firefox and EDGE.
• react-use - React Hooks — future of React 👍 react-use. http://streamich.github.io/react-use
• react-vertical-timeline - Vertical timeline for React.js.
• react-video-renderer - Build custom video players effortless. https://zzarcon.github.io/react-video-renderer/
• react-visibility-sensor - Sensor component for React that notifies you when it goes in or out of the window viewport.
• react-vr - Create amazing 360 and VR content using React.
• react-webcam - Webcam component.
• react-xp - Library for cross-platform app development.
• react-youtube - react.js powered YouTube player component.
• styled-email-components - 💌 styled-components for emails.
• svgr - Transform SVG into React components 🦁.
• uncontrollable - Wrap a controlled react component, to allow specific prop/handler pairs to be uncontrolled.
• window-table - Windowing Table for React based on React Window. https://window-table.netlify.com/
• why-did-you-update - 💥 Puts your console on blast when React is making unnecessary updates.

React Hooks

• awesome-react-hooks - Awesome React Hooks.
• react-adaptive-hooks - Deliver experiences best suited to a user's device and network constraints.
• react-hooks-visible - React Hooks library for element visibility. Uses the intersection observer API.
• react-use-gesture - 👇Bread n butter utility for component-tied mouse/touch gestures in React.
• react-use-measure - 🙌 Utility to measure view bounds.
• use-asset - 📦 A data fetching strategy for React Suspense.
• usePosition - React hook for get position of element.

React Virtualization

• react-tiny-virtual-list - A tiny but mighty 3kb list virtualization library, with zero dependencies 💪 Supports variable heights/widths, scrolling to index, and more!
• react-virtualized - React components for efficiently rendering large lists and tabular data.
• react-virtualized-auto-sizer - Standalone version of the AutoSizer component from react-virtualized.
• react-window - React components for efficiently rendering large lists and tabular data.

React Native

• 30-days-of-react-native - 30 days of React Native demos.
• react-native-windows - A framework for building native apps with React.

Real-time

• socket.io - Realtime application framework (Node.JS server).

Redux

• redux - Predictable state container for JavaScript apps.
• redux-auth - Complete token authentication system for react + redux that supports isomorphic rendering.
• redux-connect - Provides decorator for resolving async props in react-router, extremely useful for handling server-side rendering in React.
• redux-devtools - DevTools for Redux with hot reloading, action replay, and customizable UI.
• redux-form - A Higher Order Component using react-redux to keep form state in a Redux store.

Regex

• learn-regex - Learn regex the easy way.

Security

• csurf - CSRF token middleware.
• helmet - Help secure Express apps with various HTTP headers.

Serverless

• serverless - Serverless Framework – Build web, mobile and IoT applications with serverless architectures using AWS Lambda, Azure Functions, Google CloudFunctions & more!
• examples - Serverless Examples – A collection of boilerplates and examples of serverless architectures built with the Serverless Framework on AWS Lambda, Microsoft Azure, Google Cloud Functions, and more. https://www.serverless.com/examples/

State Machine

• state-machine-cat - write beautiful state charts 🙀. https://state-machine-cat.js.org
• xstate - State machines and statecharts for the modern web. https://xstate.js.org/docs
• xstate-examples - A series of examples showing how to model application state with statechart using xstate. https://stateskit.com

Static Site Generator

• gatsby - Transform plain text into dynamic blogs and websites using React.js.
• gatsby-starter-blog - Gatsby starter for creating a blog
• gatsby-starter-default - The default Gatsby starter.
• gatsby-starter-documentation - Starter for building documentation site with GatsbyJS.

Storage

• keyv - Simple key-value storage with support for multiple backends.
• store.js - Cross-browser storage for all use cases • Used across the web • See below for v2.0 news!

Talks

• wtfjs - A list of funny and tricky JavaScript examples. http://bit.ly/wtfjavascript

Terraform

• cf-to-tf - CLI tool for generating Terraform configuration and state for existing CloudFormation resources.
• terraform-aws-cloudfront-cdn - Terraform Module that implements a CloudFront Distribution (CDN) for a custom origin.
• terraform-aws-cloudfront-s3-cdn - Terraform module to easily provision CloudFront CDN backed by an S3 origin.
• terraform-aws-ec2-instance - Terraform Module for providing a general EC2 instance provisioned by Ansible.
• terraform-aws-s3-website - Terraform Module for Creating S3 backed Websites and Route53 DNS.

Testing

• BackstopJS - Automates CSS regression testing of your responsive web UI by comparing DOM screenshots at various viewport sizes.
• enzyme - JavaScript Testing utilities for React.
• istanbul - Yet another JS code coverage tool.
• jest - Painless JavaScript Unit Testing.
• leakage - 🐛 Memory leak testing for node.
• mocha - A simple, flexible, fun JavaScript test framework for node.js and the browser.
• nightmare - A high-level browser automation library. http://nightmarejs.org
• node-tap - Test Anything Protocol tools for node.
• nyc - A code coverage tool that works well with subprocesses.
• redux-saga-test-plan - Test Redux Saga with an easy plan. http://redux-saga-test-plan.jeremyfairbank.com/

Text Editor

• ckeditor-dev - The development repository of CKEditor 4. https://ckeditor.com/ckeditor-4/
• ckeditor5 - Development environment for CKEditor 5; the best browser-based rich text editor. https://ckeditor.com
• ckeditor5-engine - CKEditor 5 editing engine. https://ckeditor5.github.io
• pell - 📝 the simplest and smallest (~1kB) WYSIWYG text editor for web, with no dependencies

Tools

• arkit - JavaScript architecture diagrams and dependency graphs.
• autocannon - fast HTTP/1.1 benchmarking tool written in Node.js.
• bash-git-prompt - An informative and fancy bash prompt for Git users.
• codemod - Codemod is a tool/library to assist you with large-scale codebase refactors that can be partially automated but still require human oversight and occasional intervention.
• concurrently - Run commands concurrently. Like npm run watch-js & npm run watch-less but better.
• cz-cli - The commitizen command line utility.
• fx - Command-line JSON processing tool 🔥.
• gnomon - Utility to annotate console logging statements with timestamps and find slow processes.
• httpie - CLI HTTP client, user-friendly curl replacement with intuitive UI, JSON support, syntax highlighting, wget-like downloads, extensions, etc.
• http-server - A simple zero-configuration command-line http server.
• imagemin - Minify images seamlessly.
• js-code-to-svg-flowchart - A visualization library to convert any JavaScript code into beautiful SVG flowchart. Learn other’s code. Design your code. Refactor code. Document code. Explain code.
• jscodeshift - A JavaScript codemod toolkit.
• json-server - Get a full fake REST API with zero coding in less than 30 seconds (seriously).
• node-mkdirp - Recursively mkdir, like mkdir -p, but in node.js.
• node-prune - Remove unnecessary files from node_modules (.md, .ts, etc).
• npm-check-updates - Find newer versions of package dependencies than what your package.json or bower.json allows.
• nvm - Node Version Manager - Simple bash script to manage multiple active node.js versions.
• ora - Elegant terminal spinner.
• pageres - Capture website screenshots.
• pageres-cli - Capture website screenshots.
• prepack - Prepack is a partial evaluator for JavaScript. Prepack rewrites a JavaScript bundle, resulting in JavaScript code that executes more efficiently. https://prepack.io
• pv - A node.js implementation of the Pipe Viewer utility, useful for inspecting a pipe's traffic.
• release-it - CLI release tool for Git repos and npm packages.
• shellcheck - ShellCheck, a static analysis tool for shell scripts. http://www.shellcheck.net
• statsd - Daemon for easy but powerful stats aggregation.
• visual-center - This is a tool that will find the visual center of your images.
• yarn - 📦🐈 Fast, reliable, and secure dependency management.

Touch Screen

• hammer.js - A javascript library for multi-touch gestures.
• virtualjoystick - A virtual joystick library to emulate a joystick on touch screen in javascript.

Utilities

• 30-seconds-of-code - Short JavaScript code snippets for all your development needs. https://www.30secondsofcode.org/
• animateplus - A+ animation module for the modern web. http://animateplus.com/examples/getting-started
• array-lru - A really fast LRU cache for array items (numeric keys).
• binary-message-stream - Duplex stream that allows you to send messages, including binary messages.
• chained-function - Chained function calls.
• chokidar - A neat wrapper around node.js fs.watch / fs.watchFile / fsevents.
• classnames - A simple javascript utility for conditionally joining classNames together.
• console.js - A game console (video game cli) for browsers. https://amio.github.io/console.js/
• cross-env - Cross platform setting of environment scripts.
• csv-parser - Streaming csv parser inspired by binary-csv that aims to be faster than everyone else.
• debug - Tiny node.js & browser debugging utility for your libraries and applications.
• delay - Delay a promise a specified amount of time.
• detect-browser - Unpack a browser type and version from the useragent string.
• dragmove - A super tiny Javascript library to make DOM elements draggable and movable. ~500 bytes and no dependencies.
• dumper.js - A better and pretty variable inspector for your Node.js applications.
• element-ready - Detect when an element is ready in the DOM.
• emergence.js - Detect element visibility in the browser.
• escape-html - Escape string for use in HTML.
• esprima - ECMAScript parsing infrastructure for multipurpose analysis.
• faker.js - generate massive amounts of realistic fake data in Node.js and the browser. https://rawgit.com/Marak/faker.js/master/examples/browser/index.html
• feature.js - Feature.js is a fast, simple and lightweight browser feature detection library in 1kb.
• final-form - 🏁 Framework agnostic, high performance, subscription-based form state management.
• find-imports - Find all imported modules in JavaScript files.
• fingerprintjs - Browser fingerprinting library with the highest accuracy and stability.
• fitty - Makes text fit perfectly.
• flattree - Convert hierarchical tree structure to flat structure.
• flow.js - A JavaScript library providing multiple simultaneous, stable, fault-tolerant and resumable/restartable file uploads via the HTML5 File API.
• glob - glob functionality for node.js.
• globby - Extends glob with support for multiple patterns.
• hashlru - Simpler, faster LRU cache algorithm.
• html5-tag - A simple utility for creating HTML5 tags.
• iframe-resizer - Keep same and cross domain iFrames sized to their content with support for window/content resizing, in page links, nesting and multiple iFrames.
• js-search - JS Search is an efficient, client-side search library for JavaScript and JSON objects. http://bvaughn.github.io/js-search/
• json-server - Get a full fake REST API with zero coding in less than 30 seconds (seriously).
• jsonplaceholder - A simple online fake REST API server. https://jsonplaceholder.typicode.com/
• lodash - A modern JavaScript utility library delivering modularity, performance, & extras.
• lowdb - ⚡️ lowdb is a small local JSON database powered by Lodash (supports Node, Electron and the browser).
• memoize-one - A memoization library which only remembers the latest invocation.
• moize - The consistently-fast, complete memoization solution for JS. https://planttheidea.github.io/moize/
• mousetrap - Simple library for handling keyboard shortcuts in Javascript.
• moveTo - A lightweight scroll animation javascript library without any dependency.
• multiline-template - Multiline tagged templates using a pipe |, followed by a space, to signal line start, no more crazy indent hacks.
• multimatch - Extends minimatch.match() with support for multiple patterns.
• node-cbor - Encode and decode CBOR documents, with both easy mode, streaming mode, and SAX-style evented mode.
• node-html-to-text - Advanced html to text converter.
• node-lur-cache - A cache object that deletes the least-recently-used items.
• node-schedule - A cron-like and not-cron-like job scheduler for Node.
• node-semver - The semver parser for node (the one npm uses).
• node-which - Like which(1) unix command. Find the first instance of an executable in the PATH.
• on-change - Watch an object or array for changes.
• PapaParse - Fast and powerful CSV (delimited text) parser that gracefully handles large files and malformed input. https://www.papaparse.com/demo
• parse-json - Parse JSON with more helpful errors.
• path-to-regexp - Express-style path to regexp.
• perfect-arrows - A set of minimal functions for drawing perfect arrows between points and shapes.
• platform.js - A platform detection library.
• popper.js - A kickass library to manage your poppers. https://popper.js.org
• PubSubJS - Dependency free publish/subscribe for JavaScript.
• qs - A querystring parser with nesting support.
• scroll-into-view-if-needed - Element.scrollIntoViewIfNeeded ponyfill that can animate the scrolling.
• shine.js - A library for pretty shadows.
• stacktrace.js - Framework-agnostic, micro-library for getting stack traces in all web browsers.
• streamx - An iteration of the Node.js core streams with a series of improvements.
• superstruct - A simple and composable way to validate data in Javascript.
• table - Formats data into a string table.
• text-spinners - Pure text, CSS only, font independent, inline loading indicators.
• text-width - Measure the text width in browsers.
• threads.js - Easy to use, yet powerful multi-threading library for node.js and the browser.
• ua-parser-js - Lightweight JavaScript-based User-Agent string parser.
• waypoints - Waypoints is a library that makes it easy to execute a function whenever you scroll to an element. imakewebthings.com/waypoints/
• xregexp - Extended JavaScript regular expressions.
• ytplayer - Simple, robust, blazing-fast YouTube Player API.

Validation

• isemail - Validate an email address according to RFCs 5321, 5322, and others.

Verdaccio

• verdaccio - 📦🔐A lightweight private npm proxy registry. https://www.verdaccio.org/
• verdaccio/monorepo - 🏰Monorepo to keep all the packages for Verdaccio ecosystem

Verdaccio Ecosystem

• docker-verdaccio-s3 - Private NPM container that can backup to s3.

Docker Examples

• docker-examples - 🐳 ⛴A collection of Docker and Kubernetes examples for verdaccio. https://verdaccio.org/docs/en/docker.html

Docker Custom Builds

• docker-verdaccio-gitlab - Docker Container for verdaccio with gitlab authentication.
• docker-verdaccio - Verdaccio in Docker.
• docker-verdaccio-s3 - Private NPM container that can backup to s3.
• docker-verdaccio-ldap - docker-verdaccio-ldap.
• verdaccio-compose-local-bridge - Verdaccio run with Docker-Compose using local storage and on bridge network.
• docker-verdaccio - dockerized verdaccio, is fork of sinopia.
• verdaccio-docker - alpine based verdaccio(https://github.com/verdaccio/verdaccio) docker file.
• verdaccio-server - A private/local npm registry server.
• coldrye-debian-verdaccio - docker image providing verdaccio from coldrye-debian-nodejs.

Video

• jsmpeg - MPEG1 Video Decoder in JavaScript.
• node-fluent-ffmpeg - A fluent API to FFMPEG (http://www.ffmpeg.org).
• node-rtsp-stream - Stream any RTSP stream and output to websocket for consumption by jsmpeg.
• youtube-player - YouTube iframe API abstraction.

Virtualization

• Clusterize.js - Tiny vanilla JS plugin to display large data sets easily.
• virtualized-list - A tiny, Vanilla JS, dependency free, virtualization library.

Virtual Reality

• aframe - Building Blocks for the VR Web.

Vue

• vuera - 👀 React in Vue, Vue in React. Seamless integration of the two.

Web Builder

• grapesjs - Free and Open source Web Builder Framework. Next generation tool for building templates without coding.

Web Component

• html-include-element - Easily include external HTML into your pages.

Web Framework

• express - Fast, unopinionated, minimalist web framework for node.
• koa - Next generation web framework for Node.js.

Web Socket

• localcast - A shared event emitter that works across multiple processes on the same machine, including the browser!

Web Worker

• greenlet - 🦎 Move an async function into its own thread.
• node-webworker-threads - Lightweight Web Worker API implementation with native threads.
• worker-loader - Worker loader module for webpack.
• workerize - 🏗️ Run a module in a Web Worker.
• workerize-loader - 🏗️ Automatically move a module into a Web Worker (Webpack loader).

原文：https://github.com/trendmicro-frontend/awesome