diff --git a/README.md b/README.md index 6c9dab0..726e2d7 100644 --- a/README.md +++ b/README.md @@ -6,6 +6,7 @@ A collection of awesome browser-side [JavaScript](https://developer.mozilla.org/ * [Package Managers](#package-managers) * [Component management](#component-management) * [Loaders](#loaders) + * [Transpilers](#transpilers) * [Bundlers](#bundlers) * [Minimizers](#minimizers) * [Type Checkers](#type-checkers) @@ -75,14 +76,12 @@ A collection of awesome browser-side [JavaScript](https://developer.mozilla.org/ * [Full Text Search](#full-text-search) * [SDK](#sdk) * [Misc](#misc) - * [Podcasts](#podcasts) * [Worth Reading](#worth-reading) * [Other Awesome Lists](#other-awesome-lists) * [Contributing](#contributing) ---- - ## Package Managers *Host the JavaScript libraries and provide tools for fetching and packaging them.* @@ -98,7 +97,6 @@ A collection of awesome browser-side [JavaScript](https://developer.mozilla.org/ * [yarn](https://yarnpkg.com/) - Fast, reliable, and secure dependency management. * [pnpm](https://pnpm.io/) - Fast, disk space efficient package manager. - ## Component Management * [Bit](https://github.com/teambit/bit) - Create, find and reuse components (React, Angular, Node etc.) across applications. @@ -117,6 +115,10 @@ A collection of awesome browser-side [JavaScript](https://developer.mozilla.org/ * [ESL](https://github.com/ecomfe/esl) - Module loader browser first, support lazy define and AMD. * [modulejs](https://github.com/lrsjng/modulejs) - Lightweight JavaScript module system. +## Transpilers +*Software that converts the modern JavaScript syntax into the older JavaScript syntax.* + +* [SWC](https://swc.rs/) - Extensible Rust-based platform for compilation. ## Bundlers @@ -127,14 +129,13 @@ A collection of awesome browser-side [JavaScript](https://developer.mozilla.org/ * [Microbundle](https://github.com/developit/microbundle) - Zero-configuration bundler for tiny modules. * [FuseBox](https://github.com/fuse-box/fuse-box) - A bundler that does it right * [Snowpack](https://www.snowpack.dev/) - A lightning-fast frontend build tool, designed for the modern web. - +* [bundle](https://bundle.js.org) - A quick online npm package size checker. # Minimizers * [Terser](https://github.com/terser/terser) - parser, mangler and compressor toolkit for ES6+ * [Uglify](https://github.com/mishoo/UglifyJS) - parser / mangler / compressor / beautifier toolkit - ## Type Checkers * [TypeScript](https://www.typescriptlang.org/) - A typed superset of JavaScript that compiles to plain JavaScript. @@ -143,7 +144,6 @@ A collection of awesome browser-side [JavaScript](https://developer.mozilla.org/ * [TypL](https://github.com/getify/TypL) - the JavaScript Type Linter with a bias on type inference. * [Hindley Milner Definitions](https://github.com/xodio/hm-def) - runtime type checking for JavaScript functions using Haskell-alike Hindley Milner type signatures. - ## Testing Frameworks ### Frameworks @@ -159,6 +159,7 @@ A collection of awesome browser-side [JavaScript](https://developer.mozilla.org/ * [TestCafe](https://github.com/DevExpress/testcafe) - Automated browser testing for the modern web development stack. * [ava](https://github.com/avajs/ava) - 🚀 Futuristic JavaScript test runner * [Cypress](https://www.cypress.io/) - Complete end-to-end testing framework for anything that runs in a browser and beyond. +* [WebdriverI/O](https://webdriver.io/) - Next-gen browser and mobile automation test framework for Node.js ### Assertion @@ -251,6 +252,7 @@ A collection of awesome browser-side [JavaScript](https://developer.mozilla.org/ * [Blockly](https://github.com/google/blockly) - A library that adds a visual code editor to web and mobile apps by Google. * [Million](https://github.com/aidenybai/million) - <1kb compiler-focused virtual DOM. It's fast! * [Whatsup](https://github.com/whatsup/whatsup) - A frontend framework for chillout-mode development 🥤. JSX components on generators, fast mobx-like state management and exclusive cssx style system. +* [Remult](https://github.com/remult/remult) - A CRUD framework for full-stack TypeScript. ## Node-Powered CMS Frameworks @@ -300,7 +302,6 @@ A collection of awesome browser-side [JavaScript](https://developer.mozilla.org/ ## Articles and Posts * [The JavaScript that you should know](https://medium.com/@pedropolisenso/o-javasscript-que-voc%C3%AA-deveria-conhecer-b70e94d1d706) - Article about concepts of JavaScript Functional. -* [How JavaScript works](https://blog.sessionstack.com/tagged/tutorial) - A series of articles about the building blocks of JavaScript. * [Multi-threading using web-workers](https://www.loginradius.com/blog/async/adding-multi-threading-to-javascript-using-web-workers/) - Web Workers: Adding Multi-threading to JavaScript * [this keyword in JavaScript](https://www.loginradius.com/blog/async/breaking-down-this-keyword-in-javascript/) - Breaking down the 'this' keyword in JavaScript @@ -324,7 +325,6 @@ A collection of awesome browser-side [JavaScript](https://developer.mozilla.org/ * [cubism](https://github.com/square/cubism) - A D3 plugin for visualizing time series. * [dc.js](https://github.com/dc-js/dc.js) - Multi-Dimensional charting built to work natively with crossfilter rendered with d3.js * [vega](https://github.com/trifacta/vega) - A visualization grammar. -* [processing.js](http://processingjs.org/) - Processing.js makes your data visualizations work using web standards and without any plug-ins. * [envisionjs](https://github.com/HumbleSoftware/envisionjs) - Dynamic HTML5 visualization. * [rickshaw](https://github.com/shutterstock/rickshaw) - JavaScript toolkit for creating interactive real-time graphs. * [flot](https://github.com/flot/flot) - Attractive JavaScript charts for jQuery. @@ -392,7 +392,7 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [raptor-editor](https://github.com/PANmedia/raptor-editor) - Raptor, an HTML5 WYSIWYG content editor! * [popline](https://github.com/kenshin54/popline) - Popline is an HTML5 Rich-Text-Editor Toolbar. * [Summernote](https://github.com/summernote/summernote) - Super simple WYSIWYG editor. - +* [Everright-formEditor](https://github.com/Liberty-liu/Everright-formEditor) - A visual drag-and-drop low-code form editor ## Documentation @@ -411,7 +411,6 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [jsduck](https://github.com/senchalabs/jsduck) - API documentation generator made for Sencha JavaScript frameworks, but can be used for other frameworks too. * [codecrumbs](https://github.com/Bogdan-Lyashenko/codecrumbs) is a visual tool for learning and documenting a codebase by putting breadcrumbs in source code. - ## Files *Libraries for working with files.* @@ -421,7 +420,6 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [jsPDF](https://github.com/MrRio/jsPDF) - JavaScript PDF generation. * [PDF.js](https://github.com/mozilla/pdf.js) - PDF Reader in JavaScript. - ## Functional Programming *Functional programming libraries to extend JavaScript’s capabilities.* @@ -435,7 +433,7 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [rambda](https://github.com/selfrefactor/rambda) - Faster and smaller alternative to *Ramda*. * [fxts](https://github.com/marpple/FxTS) - Lazy evaluation and concurrency. * [wild-wild-path](https://github.com/ehmicky/wild-wild-path) - Object property paths with wildcards and regexps. - +* [sweet-monads](https://github.com/JSMonk/sweet-monads) - A utility library containing popular monads and lazy iterators. ## Reactive Programming *Reactive programming libraries to extend JavaScript’s capabilities.* @@ -475,6 +473,7 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [map-countdown](https://github.com/dawidjaniga/map-countdown) - A browser countdown built on top of the Google Maps. * [dayjs](https://github.com/iamkun/dayjs) - Day.js 2KB immutable date library alternative to Moment.js with the same modern API. * [luxon](https://github.com/moment/luxon) - Luxon is a library for working with dates and times in JavaScript. +* [tempo](https://github.com/formkit/tempo) - Parsing, formatting, and timezones — Tempo is a small tree-shakable library for native Date objects. ## String *String Libraries.* @@ -505,7 +504,6 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [Polynomial.js](https://github.com/infusion/Polynomial.js) - A polynomials library for JavaScript. * [Quaternion.js](https://github.com/infusion/Quaternion.js) - A quaternion library for JavaScript - ## Storage * [store.js](https://github.com/marcuswestin/store.js) - LocalStorage wrapper for all browsers without using cookies or flash. Uses localStorage, globalStorage, and userData behavior under the hood. @@ -530,7 +528,8 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [Lovefield](https://google.github.io/lovefield) - Lovefield is a relational database for web apps, By Google. * [Dexie.js](https://github.com/dexie/Dexie.js) - Dexie.js is a wrapper library for indexedDB. * [proxy-web-storage](https://github.com/KID-joker/proxy-web-storage) - Keep the type of storage value unchanged and change array and object directly. Supports listening to the changes and setting expires. - +* [PostgreSQL Browser](https://github.com/datawan-labs/pg) - Browser PostgreSQL Playground, no server, just client and pglite (postgresql wasm) + ## Color * [randomColor](https://github.com/davidmerfield/randomColor) - A color generator for JavaScript. @@ -561,7 +560,6 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [ObjectEventTarget](https://github.com/gartz/ObjectEventTarget) - Provide a prototype that add support to event listeners (with same behavior of EventTarget from DOMElements available on browsers). * [sporadic](https://github.com/marcoonroad/sporadic) - Composable concurrency abstractions (such as streams, coroutines and Go-like channels) on top of promises, for Node and browser engines. - ## Routing * [director](https://github.com/flatiron/director) - A tiny and isomorphic URL router for JavaScript. @@ -571,7 +569,6 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [davis.js](https://github.com/olivernn/davis.js) - RESTful degradable JavaScript routing using pushState. * [navaid](https://github.com/lukeed/navaid) - A navigation aid (aka, router) for the browser in 850 bytes~! - ## Security * [DOMPurify](https://github.com/cure53/DOMPurify) - A DOM-only, super-fast, uber-tolerant XSS sanitizer for HTML, MathML and SVG. @@ -579,7 +576,6 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [xss-filters](https://github.com/yahoo/xss-filters) - Secure XSS Filters by Yahoo. * [sanitize-html](https://github.com/apostrophecms/sanitize-html) - sanitize-html provides a simple HTML sanitizer with a clear API. - ## Log * [log](https://github.com/adamschwartz/log) - Console.log with style. @@ -593,13 +589,11 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [RegEx101](https://regex101.com/#javascript) - Online regex tester and debugger for JavaScript. Also supports Python, PHP and PCRE. * [RegExr](https://regexr.com/) - HTML/JS based tool for creating, testing, and learning about Regular Expressions. - ## Voice Command * [annyang](https://github.com/TalAter/annyang) - A JavaScript library for adding voice commands to your site, using speech recognition. * [voix.js](https://github.com/pazguille/voix) - A JavaScript library to add voice commands to your sites, apps or games. - ## API * [axios](https://github.com/axios/axios) - Promise based HTTP client for the browser and node.js. @@ -609,7 +603,6 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [jquery.rest](https://github.com/jpillora/jquery.rest) - A jQuery plugin for easy consumption of RESTful APIs. * [Rails Ranger](https://github.com/victor-am/rails-ranger) - An opinionated REST client for Ruby on Rails APIs. * [wretch](https://github.com/elbywan/wretch) - A tiny wrapper built around fetch with an intuitive syntax. -* [Bearer.sh](https://github.com/Bearer/bearer-js) - Universal API client that supports OAuth / API Key / Basic / etc. * [FarFetch](https://github.com/WebsiteBeaver/far-fetch) - Modern Fetch API wrapper for simplicity, with concise file uploading. * [Optic](https://github.com/opticdev/optic) - Optic automatically documents and tests your APIs. * [SWR](https://github.com/vercel/swr) - React Hooks library for remote data fetching. @@ -621,13 +614,11 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [Tailor](https://github.com/zalando/tailor) - Streaming layout service for front-end microservices, inspired by Facebook's BigPipe. - ## Vision Detection * [tracking.js](https://github.com/eduardolundgren/tracking.js) - A modern approach for Computer Vision on the web. * [ocrad.js](https://github.com/antimatter15/ocrad.js) - OCR in JavaScript via Emscripten. - ## Machine Learning * [ConvNetJS](https://github.com/karpathy/convnetjs) - Deep Learning in JavaScript. Train Convolutional Neural Networks (or ordinary ones) in your browser. @@ -640,7 +631,6 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [Synapses](https://github.com/mrdimosthenis/Synapses) - Lightweight cross-platform Neural Network library. * [m2cgen](https://github.com/BayesWitnesses/m2cgen) - A CLI tool to transpile trained classic ML models into a native JavaScript code with zero dependencies. - ## Browser Detection * [bowser](https://github.com/ded/bowser) - a browser detector. @@ -652,6 +642,7 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [benchmark.js](https://github.com/bestiejs/benchmark.js) - A benchmarking library. As used on jsPerf.com. * [matcha](https://github.com/logicalparadox/matcha) - A caffeine driven, simplistic approach to benchmarking. +* [bencher](https://github.com/bencherdev/bencher) - A suite of continuous benchmarking tools designed to catch performance regressions in CI. ## Web Worker @@ -671,7 +662,6 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [Highlight.js](https://github.com/isagalaev/highlight.js) - JavaScript syntax highlighter. * [PrismJS](https://github.com/PrismJS/prism) - Lightweight, robust, elegant syntax highlighting. - ## Loading Status *Libraries for indicate load status.* @@ -688,7 +678,6 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [Ladda](https://github.com/hakimel/Ladda) - Buttons with built-in loading indicators. * [css-loaders](https://github.com/lukehaas/css-loaders) - A collection of loading spinners animated with CSS - ## Validation * [Parsley.js](https://github.com/guillaumepotier/Parsley.js) - Validate your forms, frontend, without writing a single line of JavaScript. @@ -702,7 +691,6 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [Funval](https://github.com/neuledge/funval) - Data validation using functions interfaces (support TypeScript). * [vest](https://github.com/ealush/vest) - 🦺 Declarative form validation framework inspired by unit testing. - ## Keyboard Wrappers * [mousetrap](https://github.com/ccampbell/mousetrap) - Simple library for handling keyboard shortcuts in JavaScript. @@ -712,7 +700,6 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [jquery.hotkeys](https://github.com/jeresig/jquery.hotkeys) - jQuery Hotkeys lets you watch for keyboard events anywhere in your code supporting almost any key combination. * [jwerty](https://github.com/keithamus/jwerty) - Awesome handling of keyboard events. - ## Tours And Guides * [intro.js](https://github.com/usablica/intro.js) - A better way for new feature introduction and step-by-step users guide for your website and project. @@ -735,7 +722,7 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [smoke.js](https://github.com/hxgf/smoke.js) - Framework-agnostic styled alert system for JavaScript. * [notie](https://github.com/jaredreich/notie) - Simple notifications and inputs with no dependencies. * [notifire](https://github.com/notifirehq/notifire) - Open-source notification infrastructure for products. - +* [toastify-js](https://github.com/apvarun/toastify-js) - Pure JavaScript library for better notification messages. ## Sliders @@ -791,6 +778,7 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [Date Range Picker](https://github.com/dangrossman/daterangepicker) - creates a dropdown menu from which a user can select a range of dates. * [Duet Date Picker](https://github.com/duetds/date-picker) - open source version of Duet Design System’s accessible date picker, WCAG 2.1 accessibility complaint * [tui.calendar](https://github.com/nhn/tui.calendar) - A JavaScript schedule calendar that is full featured. Now your service just got the customizable calendar. +* [Schedule-X](https://github.com/schedule-x/schedule-x) - Material design event calendar. Features drag & drop, dark mode, multiple views and more. ### Select @@ -876,7 +864,6 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [Slide and swipe](https://github.com/JoanClaret/slide-and-swipe-menu) - A sliding swipe menu that works with touchSwipe library. * [mmenu](https://github.com/FrDH/jQuery.mmenu) - The best jQuery plugin for app look-alike on- and off-canvas menus with sliding submenus for your website and webapp. - ## Table/Grid * [jTable](https://github.com/hikalkan/jtable) - A jQuery plugin to create AJAX based CRUD tables. @@ -889,7 +876,6 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [Isotope](https://isotope.metafizzy.co/) - A filterable, sortable, grid layout library. Can implement Masonry, Packery, and other layouts. * [flexboxgrid](https://github.com/kristoferjoseph/flexboxgrid/) - Grid based on CSS3 flexbox. - ## Frameworks * [Semantic UI](https://semantic-ui.com/) - UI Kit with lots of themes and elements. @@ -923,7 +909,6 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [touchemulator](https://github.com/hammerjs/touchemulator) - Emulate touch input on your desktop. * [Dragula](https://github.com/bevacqua/dragula/) - Drag and drop so simple it hurts. - ## Maps * [Leaflet](https://github.com/Leaflet/Leaflet) - JavaScript library for mobile-friendly interactive maps. @@ -950,7 +935,6 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [Ion.Sound](https://github.com/IonDen/ion.sound) - Simple sounds on any web page. * [photobooth-js](https://github.com/WolframHempel/photobooth-js) - A widget that allows users to take their avatar pictures on your site. * [clappr](https://github.com/clappr/clappr) - An extensible media player for the web http://clappr.io - * [exifr](https://github.com/MikeKovarik/exifr) - The fastest and most versatile EXIF reading library. https://mutiny.cz/exifr/ * [ts-audio](https://github.com/EvandroLG/ts-audio) - an agnostic and easy-to-use library to work with the `AudioContext` API. * [AmplitudeJS](https://521dimensions.com/open-source/amplitudejs) - Open Source HTML5 Web Audio Library. Design your web audio player, the way you want. No dependencies required. * [ractive-player](https://github.com/ysulyma/ractive-player) - A library for making interactive videos in React.js. @@ -970,7 +954,6 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [FitText.js](https://github.com/davatron5000/FitText.js) - A jQuery plugin for inflating web type. * [Lettering.js](https://github.com/davatron5000/Lettering.js) - A lightweight, easy to use JavaScript `` injector for radical Web Typography. - ## Animations * [velocity](https://github.com/julianshapiro/velocity) - Accelerated JavaScript animation. @@ -988,7 +971,7 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [shuffle-images](https://github.com/peachananr/shuffle-images) - The Simplest Way to shuffle through images in a Creative Way. * [smoothState.js](https://github.com/miguel-perez/smoothState.js) - Unobtrusive page transitions with jQuery. * [Anime.js](https://animejs.com/) - A JavaScript animation engine. -* [Mo.js](http://mojs.io) - Motion graphics toolbelt for the web. +* [Mo.js](https://mojs.github.io/) - Motion graphics toolbelt for the web. * [particles.js](https://github.com/VincentGarreau/particles.js) - A lightweight JavaScript library for creating particles. * [tsParticles](https://github.com/matteobruni/tsparticles) - A new and improved version of particles.js with bug fixes and many new features. * [particles-bg](https://github.com/lindelof/particles-bg) - A lightweight React particles animation background component. @@ -1007,7 +990,7 @@ There're also some great commercial libraries, like [amchart](https://www.amchar * [es6features](https://github.com/lukehoban/es6features) - Overview of ECMAScript 6 features. * [es6-features](https://github.com/rse/es6-features) - ECMAScript 6: Feature Overview & Comparison. * [es6-cheatsheet](https://github.com/DrkSephy/es6-cheatsheet) - ES2015 [ES6] cheatsheet containing tips, tricks, best practices and code snippets. -* [ECMAScript 6 compatibility table](http://kangax.github.io/compat-table/es6/) - Compatibility tables for all ECMAScript 6 features on a variety of environments. +* [ECMAScript 6 compatibility table](https://compat-table.github.io/compat-table/es6/) - Compatibility tables for all ECMAScript 6 features on a variety of environments. * [Babel (Formerly 6to5)](https://github.com/babel/babel) - Turn ES6+ code into vanilla ES5 with no runtime. * [Traceur compiler](https://github.com/google/traceur-compiler) - ES6 features > ES5. Includes classes, generators, promises, destructuring patterns, default parameters & more. @@ -1061,11 +1044,8 @@ https://listjs.com * [lune](https://github.com/ryanseys/lune) - Library to calculate the phases of the moon accurately. * [jsemu](https://github.com/fcambus/jsemu) - A list of emulators written in the JavaScript programming language. -## Podcasts -* [Web of Tomorrow](https://www.orbit.fm/weboftomorrow) - Podcast about JavaScript for beginners. - # Worth Reading - + * [You Don't Know JS](https://github.com/getify/You-Dont-Know-JS) - Possibly the best book written on modern JavaScript, completely readable online for free, or can be bought to support the author. * [braziljs/js-the-right-way](https://github.com/braziljs/js-the-right-way/) - An easy-to-read, quick reference for JS best practices, accepted coding standards, and links around the Web. * [JSbooks](https://github.com/revolunet/JSbooks) - Directory of free JavaScript ebooks. @@ -1075,9 +1055,11 @@ https://listjs.com * [JavaScript Tutorials](https://hackr.io/tutorials/learn-javascript) - Learn Javascript online from a diverse range of user ranked online tutorials. * [Functional-Light JavaScript](https://github.com/getify/Functional-Light-JS) - Pragmatic, balanced FP in JavaScript. * [Clean Code JavaScript](https://github.com/ryanmcdermott/clean-code-javascript) - Clean Code concepts adapted for JavaScript. +* [Roadmap.sh JavaScript Roadmap](https://roadmap.sh/javascript) - Learn JavaScript from a community sourced learning roadmap. # Other Awesome Lists + * [sotayamashita/awesome-css](https://github.com/sotayamashita/awesome-css) * [emijrp/awesome-awesome](https://github.com/emijrp/awesome-awesome) * [bayandin/awesome-awesomeness](https://github.com/bayandin/awesome-awesomeness)