GithubHelp home page GithubHelp logo

moklick / frontend-stuff Goto Github PK

View Code? Open in Web Editor NEW
8.7K 401.0 695.0 460 KB

๐Ÿ“ A continuously expanded list of frameworks, libraries and tools I used/want to use for building things on the web. Mostly JavaScript.

License: Other

frontend javascript

frontend-stuff's Introduction

Frontend stuff

A continuously expanded list of frameworks, libraries and tools I used/want to use for building things on the web. Mostly Javascript stuff.

Table of Contents

CSS/UI Frameworks

  • bootflat - Bootstrap with a flat design theme
  • Bootswatch - A collection of themes for Bootstrap
  • bulma - CSS framework based on Flexbox
  • cardinal - Cardinal is a small mobile first CSS framework
  • caramel - A simple, beautiful, responsive, modern CSS framework
  • corpus - A collection of CSS things
  • HTML Starterkit - HTML5 template to kick off your responsive websites
  • kube - Minimalistic Web framework
  • Material Design Lite - Material Design Lite Components in HTML/CSS/JS
  • materialize - A modern responsive front-end framework based on Material Design
  • Metro UI - A front-end framework for developing website in Windows Metro Style
  • milligram - Minimal setup of styles for a fast starting point.
  • mini.css - A minimal, responsive, style-agnostic CSS framework/toolkit
  • mui - A Lightweight HTML/CSS/JS Framework implementing Material Design
  • NES.css - NES-style CSS Framework
  • paperCSS - The Less Formal CSS Framework
  • papier - Material design like minimal CSS framework
  • pavilion - Unopinionated CSS framework
  • picnicss - Lightweight UI library
  • pure - A set of small, responsive CSS modules
  • semantic-ui - UI Kit with lots of themes and elements
  • Tailwind CSS - A utility-first CSS framework
  • tachyons - Modular UI framework
  • tacit - CSS framework without classes
  • uikit - A lightweight and modular front-end framework
  • wing - Minimal CSS framework

back to top

Frontend Frameworks/ Ui Component Libraries

  • Angular - HTML enhanced for web apps
  • Aurelia - UI framework for the browser, mobile or desktop apps
  • choo - Isomorphic, single state, functional frontend framework
  • deku - Library for rendering interfaces using pure functions and virtual DOM
  • DisplayJS - A simple JavaScript framework for building ambitious UIs
  • hyperapp - Micro-framework for building web applications
  • inferno - Isomorphic library for building high-performance user interfaces
  • jsblocks - MV-ish framework for single page apps
  • mercury - Modular frontend framework
  • mithril - Client-side MVC framework
  • Moon - Minimal UI library
  • preact - React ES6 API + Components & Virtual DOM
  • React - Library for building user interfaces
  • RE:DOM - Library for creating user interfaces
  • react-lite - Implementation of React that optimizes for small script size
  • riot - User interface micro-library
  • skatejs - Web component library
  • Solid - declarative and flexible library for building user interfaces
  • svelte - The magical disappearing UI framework
  • vue - Library for building web interfaces

back to top

Allrounder (jQuery like)

  • bliss - A collection of helpers and light syntactic sugar over Vanilla JS
  • cash - Library that provides jQuery style syntax to wrap modern Vanilla JS features
  • jQuery - Feature-rich JavaScript library
  • nanoJS - Minimal standalone JS library for DOM manipulation
  • NodeList.js - Use the Native DOM APIs as easily as jQuery
  • Selector - Lightweight library used as a replacement for jQuery
  • umbrella - DOM, Event and AJAX library
  • zeptojs - Library with a largely jQuery-compatible API

back to top

Charts

  • chartist - Simple responsive charts
  • charts - SVG Charts with zero dependencies
  • chartjs - Simple, clean and engaging charts for designers and developers
  • chart.xkcd - Chart library for "sketchy" or "cartoony" styled charts
  • Cytoscape.js - Graph theory / network library for analysis and visualisation
  • c3 - D3-based reusable chart library
  • dc - For heavy amounts of data
  • dimple - An object-oriented API for business analytics powered by d3
  • D3xter - Straight forward plotting built on D3
  • ECharts - Charting library and interactive data visualization tool
  • epoch - A general purpose, real-time visualization library
  • f2 - Interactive and flexible charting library for mobile
  • flowchart.js - Draws flow charts from textual representation of the diagram
  • Frappe - SVG charts for the web with zero dependencies
  • ggraph - Graph visualization of big messy data
  • jsplumb - Visual connectivity for webapps (flowcharts, sequence diagrams, etc)
  • metricsgraphics - Optimized for visualizing time-series data
  • morrisjs - SVG charts based on jquery and Raphael
  • muze - Composable data visualisation lib with a data-first approach
  • nvd3 - Re-usable charts and chart components for d3.js
  • peity - Progressive mini <svg> pie, donut, bar and line charts
  • taucharts - Charts with a focus on design and flexibility
  • timesheet.js - HTML5 & CSS3 time sheets
  • tui.chart - Data visualization library with IE8 support
  • uPlot - Canvas based chart for time series, lines, areas, ohlc & bars
  • uvCharts - Simple, robust, extensible charting library built using d3
  • vis.js - A dynamic, browser based visualization library
  • VivaGraph - Extensible graph drawing library
  • Z3d - 3d plots with three.js

back to top

Maps

  • Cesium - Library for creating 3D globes and 2D maps in a web browser without a plugin
  • harp.gl - Web map rendering engine
  • leaflet - Library for Mobile-Friendly Interactive Maps
  • leaflet plugins - Notable Leaflet Plugins
  • Mapbox GL JS - Interactive WebGL maps from vector tiles
  • mapmap.js - A data-driven API for interactive thematic maps
  • mapsicon - Collection of maps for nearly every country in the world in PNG and SVG
  • osmbuildings - Library for visualizing buildings as pseudo 3D objects on interactive maps
  • openlayers3 - Mapping library that supports different projections
  • planetary - Interactive globes for the web
  • smallworld - A small utility for generating a small world
  • Tangram - WebGL based map renderer
  • topojson - An extension to GeoJSON that encodes topology
  • turf - A modular geospatial engine

back to top

Tables & Spreadsheets

  • Clusterize.js - Vanilla plugin to display large data sets
  • DataTables - jQuery plugin which adds sorting, paging and filtering abilities to plain HTML tables with minimal effort
  • dynatables - Semantic and interactive table plugin using jQuery, HTML5, and JSON
  • handson table - Minimalist Excel-like data grid editor
  • ListJS - Adds search, sort, filters and flexibility to plain HTML lists, tables, or anything
  • sortable - Makes tables sortable
  • tablesaw - A group of plugins for responsive tables
  • tui-grid - Widget to visualize and edit data via its table representation
  • x-spreadsheet - A web-based spreadsheet

back to top

Selects

  • awesomplete - Lightweight autocomplete
  • chosen - Library for making long, unwieldy select boxes more friendly
  • select2 - JQuery based replacement for select boxes

back to top

Loaders

  • Loaders.css - Delightful, performance-focused pure css loading animations
  • MProgress.js - Google Material Design Progress Linear bar
  • NProgress - Slim progress bars for Ajax'y applications. Inspired by Google, YouTube, and Medium
  • nanobar - Lightweight progress bars without jQuery
  • PACE - Automatic page load progress bar. Needs zero config. Easy themeable.
  • PleaseWait.js - A simple library to show your users a beautiful splash page while your application loads

back to top

UI Elements

  • button concepts - List of CSS button variations
  • countUp.js - Count up or down animation effects for numbers
  • Flipside - A button that seamlessly transitions from action to confirmation with flipping animation
  • Messenger.js - Client-side growl-like notifications with actions and auto-retry.
  • nouislider - Range slider
  • nudge - Provides simple on-screen nudges / notifications
  • Slideout.js - A touch slideout navigation menu for mobile web apps
  • Sortable.js - Reorderable drag-and-drop lists
  • SweetAlert - An awesome replacement for JavaScript's alert
  • Toastr - Simple toast notifications
  • vex - A modern dialog library which is highly configurable and easy to style

back to top

Content Slider/Carousels

  • Glide - A dependency-free slider and carousel
  • Glider.js - A minimal carousel with momentum scrolling
  • lory - Minimalistic slider written in vanilla JavaScript
  • ItemSlide.js - Touch carousel (needs jquery)
  • Siema - Carousel with no dependencies
  • slick - Fully responsive carousel (needs zepto or jquery)
  • swipe - Touch slider with React and Angular support
  • swiper - Slider with touch support

back to top

Typography/Text

  • Blotter - Unconventional text effects for the web
  • fitty - Scales text so it fits to its parent container
  • flowtype - Responsive typography
  • RoughNotation - Library to create and animate annotations
  • shave - Plugin for truncating text within an html element
  • Typeset.js - HTML pre-processor for web typography

back to top

Video

  • medialementjs - Video and audio handling
  • Plyr - A simple HTML5 media player with custom controls
  • talkie - Combines audio and animations
  • Videojs - Open source HTML5 video player

back to top

Audio

  • abcjs - javascript for rendering abc music notation
  • audio5js - The HTML5 Audio Compatibility Layer
  • bap - Toolkit for making beats and composing sequences
  • howler - Audio library
  • soundjs - Audio library + simple interface
  • timbre.js - Library for Objective Sound Programming
  • tone.js - Framework for interactive music
  • tonal - A functional music theory library
  • vexflow - Library for rendering music notation
  • wavesurfer.js - Navigable waveform

back to top

Canvas and SVG

  • canvas-sketch - Framework for making generative artwork
  • D3 - A JavaScript visualization library for HTML and SVG
  • Easeljs - Library for building canvas based interactive 2D content
  • Fabric.js - Canvas Library, SVG-to-Canvas (& Canvas-to-SVG) Parser
  • GraphicsJS - Graphics library with an intuitive API, based on SVG/VML technology
  • Konva - Framework that extends the 2d context by enabling canvas interactivity
  • panzoom - Pan and zoom SVG elements
  • Paper.js - Canvas based vector graphics scripting framework
  • Paths.js - Generate SVG paths for geometric shapes
  • pixi.js - 2D WebGL rendering engine with Canvas fallback
  • p5js - Processing for Javascript
  • Raphael - Library that simplify your work with vector graphics on the web
  • Rough.js - Create graphics with a hand-drawn, sketchy, appearance
  • rune.js - A Library for programming graphic design systems with SVG
  • svg.js - A Library for manipulating and animating SVG
  • svg-3d-builder - Tool to create 3d model with svg
  • two.js - A two-dimensional drawing api
  • vizflow - Interactive visualization engine
  • Zdog - Pseudo-3D engine for canvas & SVG

back to top

3D/WebGL Frameworks

  • babylonJS - Framework for building 3D games with HTML5, WebGL and Web Audio
  • sceneJS - WebGL-based 3D visualization engine
  • three.js- 3D Library which makes WebGL simpler
  • voxel.js - Voxel game building toolkit
  • WhitestormJS - Framework for developing 3D web apps with physics

back to top

Image Processing

  • camanjs - Combination of a simple-to-use interface with advanced and image/canvas editing techniques
  • grafijs - Library with basic image processing functions
  • smartcrop - Content aware image cropping

back to top

Scrolling

  • basicScroll - Standalone parallax scrolling for mobile and desktop with CSS variables
  • emergence.js - Detect element visibility in the browser
  • headroom - Hide your header until you need it
  • in-view - Get notified when a element enters/exits the viewport
  • moveTo - Scroll animation library
  • scroll-scope.js - Keep parent element still when scrolling an element to its boundary
  • ScrollMagic - Library for scroll interactions
  • scrollMonitor - API to monitor elements as you scroll
  • scrollreveal - Scroll animations for web and mobile browsers
  • verge - Get viewport dimensions, detect elements in the viewport

back to top

Touch Gestures

  • AlloyFinger - Multi-touch gestures library
  • Hammer.js - Add support for touch gestures and remove 300ms delay from clicks

back to top

Animations

  • animate.css - A cross-browser library of CSS animations
  • Animate Plus - Tiny (2 KB minified and gzipped) animation library
  • Anime - Anime is a flexible yet lightweight animation library
  • bounce.js - CSS3 powered animations
  • choreographer - Library to take care of complicated css animations
  • Dynamics.js - Library to create physics-based CSS animations
  • GSAP - Fast animation library
  • Hover.css - CSS3 Hover Effects
  • impulse - Dynamic physics interactions for the mobile web
  • KUTE.js - animation engine, memory efficient & modular code
  • mojs - Motion for the web
  • popmotion - Motion Engine. Use for animation, physics and input tracking.
  • rebound - Library that models Spring dynamics for driving physical animations
  • repaintless - Animation library that consists of animations that don't cause reflows and repaints
  • Scene.js - Timeline-based animation library
  • semantic ui - transition - Simple CSS3 Animations and transitions
  • Sequence.js - Responsive CSS animation framework
  • shifty - Tweening engine
  • snabbt - Animations with JavaScript and CSS transforms
  • snapsvg - Library for animating and manipulating SVG's
  • tween.js - Tweening engine
  • velocity - Accelerated JavaScript animations
  • vivus - Vivus is a lightweight JavaScript class (with no dependencies) that allows you to animate SVGs, giving them the appearence of being drawn

back to top

Templating

  • dotjs - Fast templating engine
  • Handlebars - Minimal Templating on Steroids
  • Hogan - JavaScript templating
  • marko - Fast and lightweight HTML-based templating engine that compiles templates to CommonJS modules and supports streaming, async rendering, custom tags and a concise syntax
  • mustache - Minimal templating with {{mustaches}} in JavaScript
  • nunjucks - A rich and powerful templating language
  • paperclip.js - Reactive DOM template engine built for speed and extensibility
  • vdo - Minimal JSX compatible html focused templating engine

back to top

HTTP Requests

  • aja - Asynchronous JavaScript and JSON(P)
  • axios - Promise based HTTP client
  • d3-request - A convenient alternative to XMLHttpRequest
  • fetch - A window.fetch javascript polyfill
  • intercooler-js - Making AJAX as easy as anchor tags
  • qwest - Ajax library with XHR2, promises and request limit
  • reqwest - Browser asynchronous HTTP requests
  • superagent - Client-side HTTP request library

back to top

Events

back to top

Icons

back to top

Colors

  • bootflat color picker - Color picker for flat design
  • Brand Colors - Official color codes for the world's biggest brands
  • chromajs - Library for all kinds of color manipulations
  • chromajs color scale helper - Tool to help us mastering multi-hued, multi-stops color scales
  • coolors - Super fast color scheme generator
  • color - Intuitive color picker
  • colorbrewer2 - Color advice for cartography
  • ColorHexa - Color encyclopedia : Information and conversion
  • colourco - Color scheme tool
  • colormind - Deep learning AI that knows color theory and creates color schemes
  • Colors - Smarter Default colors on the web
  • hcl-picker - Colorpicker for data
  • kewler - Functional and immutable color manipulation library
  • khroma - AI color tool for designers
  • polychrome - Color manipulation helper
  • uiGradients - A handpicked collection of beautiful colour gradients for design and code
  • vibrant.js - Extract prominent colors from an image

back to top

Databases/Storage

  • basil.js - Persistence layer
  • Dexie.js - Wrapper for IndexedDB
  • ForerunnerDB - Database with mongo-like query language and data-binding support
  • idb - IndexedDB with Promises
  • localForage - Library like a localStorage API with fallback store for browsers with no IndexedDB or WebSQL support
  • LokiJS - Embeddable / in-memory database
  • lovefield - SQL-like, relational query engine for the browser
  • pouchdb - Created to help developers build applications that work as well offline as they do online
  • rxdb - Reactive, serverless, client-side, offline-first database
  • store.js - Cross-browser storage using localStorage, globalStorage or userData

back to top

Validation

  • is.js - Micro check library
  • Parsley - Easy Form validation
  • validate.js - Form validation library inspired by CodeIgniter
  • validator.js - String validation and sanitization
  • yup - Yup is a schema builder for runtime value parsing and validation.

back to top

Dates

  • dateformat - Library for formatting dates
  • date-fns - Toolset for manipulating dates
  • flatpickr - Lightweight date time picker without dependencies
  • instadate - A minimal date library
  • luxon - A library for working with dates and times
  • moment.js - Parse, validate, manipulate, and display dates
  • Pikaday - A lightweight Datepicker
  • sugar - Parse, create, manipulate, compare, format and display dates
  • tinytime - Light date and time formatter

back to top

Internationalization

  • l10ns - Internationalization workflow and formatting
  • globalize - A library for internationalization and localization that leverages the official Unicode CLDR JSON data

back to top

Numbers & Currencies

  • Numbro.js - Formatting and manipulating numbers in more than 30 languages
  • accounting.js - Number, money and currency formatting
  • money.js - Currency conversion library
  • cleave.js - Format input text content when you are typing

back to top

Statistics & Data Analysis

  • datakit - Framework for data analysis
  • datalib - Data utility library
  • gauss - Statistics, analytics, and data library
  • jstat - Javascript Statistical Library
  • science.js - Scientific and statistical computing in JavaScript
  • simple-statistics - simple statistics for node & browser javascript
  • statkit - Statistics toolkit
  • stdlib - Library with an emphasis on numerical and scientific computing applications
  • TheoremJS - A Math library for computation

back to top

Module Loaders

  • Browserify - Lets you require('modules') in the browser
  • RequireJS - A file and AMD module loader
  • Rollup - ES6 module bundler with tree shaking abilities
  • stealjs - Dependency loader and builder
  • Systemjs - ES6, AMD and CommonJS loader
  • webpack - CommonJs and AMD module loader

back to top

Lazy Loading

  • Aload - Asynchronously loads images, scripts, styles and more
  • echo - Standalone lazy loading image micro-library
  • Lazy Progressive Enhancement - A lazy image loader designed to enforce progressive enhancement and valid HTML
  • layzr.js - Dependency-free library for lazy loading images
  • lazysizes - fast and self-initializing lazyloader for images, iframes and more
  • loadXT - Lazy loading for any elements
  • Unveil - Lightweight plugin to lazy load images for jQuery or Zepto.js

back to top

Neural Networks

  • brain - Neural networks in JavaScript
  • ConvNetJS - Library for training Deep Learning models
  • deeplearn.js - Hardware-accelerated machine intelligence library
  • dn2a-javascript - Digital Neural Networks Architecture
  • Mind - Flexible neural networks
  • neurojs - Deep learning and reinforcement learning library
  • synaptic.js - Architecture-free neural network
  • Tensor Fire - Neural networks in the browser using WebGL

back to top

Social

  • js socials - Social network sharing jQuery plugin
  • rrssb - Ridiculously Responsive Social Sharing Buttons
  • share-button - Fast, beautiful, and painless social shares
  • sharingbuttons - Social media sharing buttons without JavaScript
  • socialcount - Custom sharing buttons with share count
  • Social Likes - Single-style sharing buttons with counters for jQuery
  • whatsapp button - Creates a whatsapp sharing button

back to top

Utility Libraries

  • lazy.js - A functional utility library
  • lodash - Utility library delivering modularity, performance & extras.
  • moutjs - Collection of modular JavaScript utilities
  • pareto.js - Functional utility library
  • ramdajs - A practical functional library
  • Sugar - Utility library for working with native objects
  • underscore - Library that provides functional programming helpers

back to top

General

  • dat.GUI - Minimal interface for live control of variables in JS
  • embed.js - Automatically embeds emojis, media, maps, tweets, code and services
  • formstone - Collection of handy useful scripts
  • golden-layout - A multi-screen layout manager for webapps
  • interact.js - Drag and drop, resizing and multi-touch gestures with inertia and snapping
  • jwerty - Handling of keyboard events
  • keymaster - Simple key listener
  • modernizr - Feature Detection Library
  • tether - Marrying UI Elements (dropdown, tooltips, guide, selects)
  • UpUp - Offline First library. Let users visit your site, even without a connection.
  • bro-fs - Promise-based wrapper over HTML5 Filesystem API allowing to work with sandboxed filesystem in Chrome

back to top

frontend-stuff's People

Contributors

andylnd avatar aspyatkin avatar chrtze avatar darkkain avatar di3goleite avatar elahmo avatar fonorobert avatar gaursagar avatar hikwamehluli avatar jhohannesk avatar kessiler avatar kgeis avatar kmindi avatar kurisubrooks avatar lindekaer avatar lucasbento avatar lucascaprio avatar m19c avatar maxmnts avatar mischah avatar moklick avatar mortonfox avatar noahbuscher avatar owenmelbz avatar patrick-steele-idem avatar peterbrinck avatar renesansz avatar wass3r avatar wongalvis avatar yurovant avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

frontend-stuff's Issues

Adding new framework/library

Does the new framework/library that I'm going to add in the list have to be my own work?
Can I just add one I find amazing that is from others?

Displaying times

moment.js is nice if you want your time outputs to be more readable. I think it should be part of the list.

Add mini.css

Hi, I am the developer of mini.css, a minimal, responsive, style-agnostic CSS framework.

You can check it out here: https://github.com/Chalarangelo/mini.css

I'd love to get more people involved and see more people use it so, if you think it's worthwhile, please add it to the list!

Events

Please add some event libraries like Keyder.js

Add Bourbon SCSS framework

Also Neat / Bitters by thoughtbot too.

Fantastic for base styles, and handy mixins, of course only if you include them!

New section "Fonts"

I would suggest adding a new section "Fonts" which contains a list of fonts that is useful for frontend design. What do you think?

Tipue

What about adding Tipue

embed-js

Repository : link
This can be useful for javascript developers. The examples are here and even the angular version of this is available here .

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.