Git Product home page Git Product logo

frontend-stuff's Introduction

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.

Table of Contents

CSS/UI Frameworks

  • base - Responsive CSS framework with IE7+ support
  • BASSCSS - Low-level CSS toolkit
  • 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.
  • mui - A Lightweight HTML/CSS/JS Framework implementing Material Design
  • 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
  • skeleton - A dead simple, responsive boilerplate
  • tachyons - Modular UI framework
  • tacit - CSS framework without classes
  • uikit - A lightweight and modular front-end framework
  • wing - Minimal CSS framework

⬆ 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
  • NodeList.js - Use the Native DOM APIs as easily as jQuery
  • umbrella - DOM, Event and AJAX library
  • zeptojs - Library with a largely jQuery-compatible API

⬆ back to top

Frontend Frameworks/ Ui Component Libraries

  • choo - Isomorphic, single state, functional frontend framework
  • deku - Library for rendering interfaces using pure functions and virtual DOM
  • inferno - Isomorphic library for building high-performance user interfaces
  • jsblocks - MV-ish framework for single page apps
  • mithril - Client-side MVC framework
  • preact - React ES6 API + Components & Virtual DOM
  • react-lite - Implementation of React that optimizes for small script size
  • riot - User interface micro-library
  • vue - Library for building web interfaces

⬆ back to top

Charts

  • chartist - Simple responsive charts
  • chartjs - Simple, clean and engaging charts for designers and developers
  • 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
  • flowchart.js - Draws flow charts from textual representation of the diagram
  • jsplumb - Visual connectivity for webapps (flowcharts, sequence diagrams, etc)
  • metricsgraphics - Optimized for visualizing time-series data
  • morrisjs - SVG charts based on jquery and Raphael
  • nvd3 - Re-usable charts and chart components for d3.js
  • peity - Progressive mini <svg> pie, donut, bar and line charts
  • sparkline - Sparkline charts library
  • sparky - Sparkline charts library based on rapahel
  • taucharts - Charts with a focus on design and flexibility
  • timesheet.js - HTML5 & CSS3 time sheets
  • 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
  • Kartograph - Simple and lightweight framework for building interactive map applications without Google Maps
  • leaflet - Library for Mobile-Friendly Interactive Maps
  • leaflet generator - Yeoman generator that scaffolds out a leaflet map application
  • leaflet plugins - Notable Leaflet Plugins
  • leaflet topojson support - TopoJSON-aware Leaflet layer
  • 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
  • topojson - An extension to GeoJSON that encodes topology
  • turf - A modular geospatial engine

⬆ back to top

Tables

  • 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

⬆ 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.
  • Slideout.js - A touch slideout navigation menu for mobile web apps
  • slick - Fully responsive carousel
  • Sortable.js - Reorderable drag-and-drop lists
  • SweetAlert - An awesome replacement for JavaScript's alert
  • swiper - Slider with touch support
  • Toastr - Simple toast notifications
  • vex - A modern dialog library which is highly configurable and easy to style

⬆ back to top

Typography

  • bacon - Wraps text around a Bézier curve or a line
  • bigfoot.js - Responsive popover footnotes
  • dropcap.js - CSS dropcaps
  • flowtype - Responsive typography
  • grande.js - Library that implements features from Medium's editing experience
  • lining.js - A complete DOWN-TO-THE-LINE control for radical web typography
  • lettering - JQuery web typography plugin
  • pen - Editor with markdown support
  • Plumin.js - Create and manipulate fonts using javascript
  • side-comments - Medium style comments
  • slabText - jQuery plugin for producing big, bold & responsive headlines
  • smart underline - Descender-aware underlines for every browser
  • typeahead.js - Foundation for building robust typeaheads
  • Typeplate - A typographic starter kit
  • Typeset.js - HTML pre-processor for web typography
  • Icomoon - Website to custom build fonts, useful for icons

⬆ back to top

Video

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

⬆ back to top

Audio

  • audio5js - The HTML5 Audio Compatibility Layer
  • blip - Web Audio API wrapper
  • howler - Audio library
  • SoundCite - Inline audio player
  • soundjs - Audio library + simple interface
  • timbre.js -Library for Objective Sound Programming
  • vexflow - HTML5 Music Engraving
  • tone.js - Framework for interactive music

⬆ back to top

Canvas and SVG

  • 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
  • rune.js - A Library for programming graphic design systems with SVG
  • svg.js - A Library for manipulating and animating SVG
  • two.js - A two-dimensional drawing api
  • vizflow - Interactive visualization engine

⬆ 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

  • fracs - Plugin to determine the visible fractions of HTML elements
  • midnight.js - Make your header looks great with the content below it as you scroll
  • scroll-scope.js - Keep parent element still when scrolling an element to its boundary
  • scrollme - A jQuery plugin for adding simple scrolling effects to web pages
  • ScrollMagic - Library for scroll interactions
  • scrollMonitor - API to monitor elements as you scroll
  • scrollreveal - Scroll animations for web and mobile browsers
  • ScrollToFixed - Used to fix elements on the page and move with the horizontal scroll
  • skrollr - Stand-alone parallax scrolling library for mobile and desktop
  • space.js - A HTML-driven JavaScript-library for narrative 3D-scrolling
  • superscrollorama - The jQuery plugin for supercool scroll animation
  • WOW - Reveal CSS animation as you scroll down a page
  • headroom - Hide your header until you need it:

⬆ back to top

Touch Gestures

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

Animations

  • animate.css - A cross-browser library of CSS animations
  • 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
  • mojs - Motion for the web
  • popmotion - Motion Engine. Use for animation, physics and input tracking.
  • repaintless - Animation library that consists of animations that don't cause reflows and repaints
  • 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

⬆ back to top

Databases/Storage

  • basil.js - Persistence layer
  • ForerunnerDB - Database with mongo-like query language and data-binding support
  • 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
  • store.js - LocalStorage wrapper for all browsers without using cookies or flash. Uses localStorage, globalStorage and userData behavior
  • pouchdb - Created to help developers build applications that work as well offline as they do online
  • taffydb - Brings database features into your JavaScript applications

⬆ back to top

Validation

⬆ back to top

Dates

  • datedropper - datedropper is a jQuery plugin that provides a quick and easy way to manage dates for input fields.
  • date-fns - Toolset for manipulating dates in a browser & Node.js
  • instadate - A minimal high performance date library
  • moment.js - Parse, validate, manipulate, and display dates
  • Pikaday - A refreshing JavaScript Datepicker — lightweight, no dependencies, modular CSS
  • sugar - Parse, create, manipulate, compare, format and display dates

⬆ back to top

Internationalization

  • l10ns - Internationalization workflowand formatting
  • globalize - A JavaScript 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

⬆ back to top

Module Loaders

  • Browserify - Lets you require('modules') in the browser
  • RequireJS - A file and AMD module loader
  • 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
  • dn2a-javascript - Digital Neural Networks Architecture
  • Mind - Flexible neural networks
  • synaptic.js - Architecture-free neural network

⬆ 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.
  • underscore - Library that provides functional programming helpers
  • pareto.js - Functional utility library
  • ramdajs - A practical functional library

⬆ 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.

⬆ back to top

frontend-stuff's People

Contributors

moklick avatar aspyatkin avatar renesansz avatar wongalvis avatar m19c avatar chrtze avatar wass3r avatar yurovant avatar gaursagar avatar lindekaer avatar di3goleite avatar mortonfox avatar mischah avatar hikwamehluli avatar maxmnts avatar lucascaprio avatar lucasbento avatar kurisubrooks avatar kessiler avatar kgeis avatar kmindi avatar licatajustin avatar noahbuscher avatar patrick-steele-idem avatar fonorobert avatar citguy avatar scottdjwallace avatar talater avatar emanueltimlopez avatar tvler avatar

Watchers

James Cloos avatar Vlad Trukhin avatar

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.