Frontend stuff

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

• UI Frameworks
• Charts
• Maps
• Text
• Video
• Audio
• Tables
• Lazy Loading
• Scrolling
• Animations
• UI Elements
• Templating
• HTTP requests
• Dates
• Events
• General
• Icons
• Colors
• Databases
• Social

UI Frameworks

• semantic-ui - UI Kit with lots of themes and elements
• cardinal - Cardinal is a small mobile first CSS framework
• uikit - A lightweight and modular front-end framework
• pure - A set of small, responsive CSS modules
• bootflat - Bootstrap with a flat design theme
• base - Responsive CSS framework with IE7+ support
• papier - Material design like minimal CSS framework
• materialize - A modern responsive front-end framework based on Material Design
• caramel - A simple, beautiful, responsive, modern CSS framework

Charts

• nvd3 - Re-usable charts and chart components for d3.js
• c3 - D3-based reusable chart library
• dc - For heavy amounts of data
• D3xter - Straight forward plotting built on D3
• epoch - A general purpose, real-time visualization library
• metricsgraphics - Optimized for visualizing time-series data
• chartjs - Simple, clean and engaging charts for designers and developers
• chartist - Simple responsive charts
• dimple - An object-oriented API for business analytics powered by d3
• sparkline - Sparkline charts library
• sparky - Sparkline charts library based on rapahel
• jsplumb - Visual connectivity for webapps (flowcharts, sequence diagrams, etc)
• taucharts - Charts with a focus on design and flexibility
• vis.js - A dynamic, browser based visualization library.
• timesheet.js - HTML5 & CSS3 time sheets

Maps

• leaflet - Library for Mobile-Friendly Interactive Maps
• topojson - An extension to GeoJSON that encodes topology
• leaflet topojson support - TopoJSON-aware Leaflet layer
• leaflet plugins - Notable Leaflet Plugins
• leaflet generator - Yeoman generator that scaffolds out a leaflet map application
• planetary - Interactive globes for the web
• smallworld - A small utility for generating a small world
• turf - A modular geospatial engine
• osmbuildings - Library for visualizing buildings as pseudo 3D objects on interactive maps
• openlayers3 - Mapping library that supports different projections
• Kartograph - Simple and lightweight framework for building interactive map applications without Google Maps
• mapsicon - Collection of maps for nearly every country in the world in PNG and SVG

Text

• flowtype - Responsive typography
• dropcap.js - CSS dropcaps
• side-comments - Medium style comments
• grande.js - JavaScript library that implements features from Medium's editing experience
• pen - Editor with markdown support
• lettering - JQuery web typography plugin
• bacon - Wraps text around a Bézier curve or a line
• smart underline - Descender-aware underlines for every browser
• Plumin.js - Create and manipulate fonts using javascript
• Typeplate - A 'typographic starter kit'

Video

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

Audio

• blip - Web Audio API wrapper
• howler - Audio library
• soundjs - Audio library + simple interface
• SoundCite - Inline audio player

Tables

• sortable - Makes tables sortable
• handson table - Minimalist Excel-like data grid editor
• dynatables - Semantic and interactive table plugin using jQuery, HTML5, and JSON
• DataTables - jQuery plugin which adds sorting, paging and filtering abilities to plain HTML tables with minimal effort

Lazy-Loading

• Aload - Asynchronously loads images, scripts, styles and more
• loadXT - Lazy loading for any elements
• echo - Standalone JavaScript lazy-loading image micro-library
• Unveil - Lightweight plugin to lazy load images for jQuery or Zepto.js

Scrolling

• scrollme - A jQuery plugin for adding simple scrolling effects to web pages
• WOW - Reveal CSS animation as you scroll down a page
• superscrollorama - The jQuery plugin for supercool scroll animation
• fracs - Plugin to determine the visible fractions of HTML elements
• scrollmagic - Trigger effects and animations in both scrolling directions

Animations

• impulse - Dynamic physics interactions for the mobile web
• velocity - Accelerated JavaScript animation
• GSAP - Fast animation library
• bounce.js - CSS3 powered animations
• snabbt - Animations with JavaScript and CSS transforms
• animate.css - A cross-browser library of CSS animations
• semantic ui - transition - Simple CSS3 Animations and transitions
• tween.js - Tweening engine

UI Elements

• awesomplete - Lightweight autocomplete
• tether - Marrying UI Elements (dropdown, tooltips, guide, selects)
• button concepts - List of CSS button variations
• select2 - JQuery based replacement for select boxes
• chosen - Library for making long, unwieldy select boxes more friendly
• NProgress - Slim progress bars for Ajax'y applications. Inspired by Google, YouTube, and Medium
• PleaseWait.js - A simple library to show your users a beautiful splash page while your application loads
• SweetAlert - An awesome replacement for JavaScript's alert
• MProgress.js - Google Material Design Progress Linear bar
• countUp.js - Count up or down animation effects for numbers
• Messenger.js - Client-side growl-like notifications with actions and auto-retry.

Templating

• nunjucks - A rich and powerful templating language
• mustache - Minimal templating with {{mustaches}} in JavaScript
• dotjs - Fast templating engine
• Hogan - JavaScript templating
• paperclip.js - Reactive DOM template engine built for speed, and extensibility

HTTP requests

• reqwest - Browser asynchronous HTTP requests
• superagent - Client-side HTTP request library
• aja - Asynchronous JavaScript And JSON(P)

Dates

• moment.js - Parse, validate, manipulate, and display dates

Events

• bean - Events api
• gator.js - Simple event delegation

General

• jwerty - Handling of keyboard events
• accounting.js - Number, money and currency formatting

Icons

• weloveiconfonts - A free & open source icon fonts hosting service
• the nounproject - Icon search
• fontello - Icon fonts generator
• octicons - Github icons
• elegant - Elegant Icon font
• fontawesome - Gives you scalable vector icons that can instantly be customized
• evil icons - Lightweight SVG icons
• ionicons - The icon font for Ionic Framework
• foundation icon font 3 - Foundation Zurb Icon Font 3

Colors

• chromajs - Library for all kinds of color manipulations
• coolors - Super fast color scheme generator
• bootflat color picker - Color picker for flat design
• color - Intuitive color picker
• colourco - Color scheme tool
• uiGradients - A handpicked collection of beautiful colour gradients for design and code
• Colors - Smarter Default colors on the web.
• colorbrewer2 - Color advice for cartography

Databases

• pouchdb - Created to help developers build applications that work as well offline as they do online
• taffydb - Brings database features into your JavaScript applications
• LokiJS - Embeddable / in-memory database
• ForerunnerDB - Database with mongo-like query language and data-binding support
• store.js - LocalStorage wrapper for all browsers without using cookies or flash. Uses localStorage, globalStorage and userData behavior

Social

• socialcount - Custom sharing buttons with share count
• whatsapp button - Creates a whatsapp sharing button
• rrssb - Ridiculously Responsive Social Sharing Buttons
• share-button - Fast, beautiful, and painless social shares