Coder Social home page Coder Social logo

frontend-toolbox's Introduction

frontend-toolbox

Actively maintained list of useful web developments tools, libraries, assets and any other open-source goodies.

"★" recommended and currently used by the maintainer

General

Feeds

Compatibility

Performance

  • HTTPArchive Performance stats and trends for the worlds most popular sites

Runtimes

Debugging

Maps

  • Gmaps makes it easier to use Google Maps
  • jVectorMap svg based maps for ie6+, maps included
  • Leaflet an open-source JavaScript library for mobile-friendly interactive maps

Charts/graphs/visualization/reporting

  • ★ datavisualization tools a collection of tools that we, the people behind Datavisualization.ch, work with on a daily basis and recommend warmly

  • ★ flot Attractive JavaScript plotting for jQuery

  • D3 a JavaScript library for manipulating documents based on data. D3 helps you bring data to life using HTML, SVG and CSS.

    • Rickshaw a JavaScript toolkit for creating interactive time series graphs.
    • Cubism Time Series Visualization

  • gRaphael SVG charts

  • flotr2 Graphs and Charts for Canvas in JavaScript.

  • RGraph interactive Javascript charts and graphs for your website using the HTML5 canvas tag

  • Sencha Touch Charts - paid

  • HighCharts - paid

  • dygraphs

  • ZingChart

  • Fusion Charts

  • MilkCharts for MooTools weirdos

  • Google Chart Tools API based

  • Envision is a library for creating fast, dynamic and interactive HTML5 visualizations.

  • ArborJS a graph visualization library using web workers and jQuery

  • TimelineJS beautifully crafted timelines that are easy, and intuitive to use.

  • jQuery Sparklines

UI Toolkits

Documentation

  • ★ Docco: Quick and dirty, literate-programming documenation generator
  • Groc: is an attempt to further enhance the idea [of Docco]

Total process build tools, Assemblers, et al

Should this be merged with 'JavaScript Build Tools' section below?

  • ★ Yeoman: a robust and opinionated client-side stack, comprised of tools and frameworks that can help developers quickly build beautiful web applications.
  • ★ Brunch: A lightweight approach to building HTML5 applications with an emphasis on elegance and simplicity.
  • ★ Middleman: a static site generator using all the shortcuts and tools in modern web development.
  • Lumbar: Lumbar is a js-build tool that takes a general codebase and list of platforms to generate modular platform specific applications. (from Walmart Labs)
  • LiveReload: CSS edits and image changes apply live. CoffeeScript, SASS, LESS and others just work. (OSX app only)
  • CodeKit: CodeKit helps you build websites faster and better. (OSX app only)

JavaScript

Standalone libraries (no dependencies)

  • Widow Tamer fix typgraphic widows
  • SwipeJS lightweight mobile slider script
  • accounting.js number, money and currency formatting, with optional excel-style column rendering
  • money.js currency conversion library, done right - with no dependencies
  • moment.js A 4.8k javascript date library for parsing, validating, manipulating, and formatting dates.
  • cookies.js

Headless DOM/Browsers

  • PhantomJS: Headless WebKit with JavaScript API
  • ZombieJS: Insanely fast, headless full-stack testing using Node.js

Build tools

Modules and Script loaders

Package Managers

  • Bower package manager for the web
  • Volo Create front end projects from templates, add dependencies, and automate the resulting projects
  • Ender the no-library library

Books

Free/online

jQuery

Useful jQuery Plugins

Mobile

Testing

Test Drivers

Assertions

  • Chai: assertions lib
    • should: foo.should.be.a('string')
    • expect: expect(foo).to.be.a('string')
    • assert: assert.typeof(foo, 'string')
  • should.js 'should' style assertions
  • expect.js 'expect' style assertions

Mocks, stubs, spies

Transcompilation Languages

  • ★ CoffeeScript: a little language that compiles into JavaScript
  • IcedCoffeeScript: drop-in replacement interpreter for CoffeeScript with async control flow semantics.
  • LiveScript: aims for increased expressiveness and code beauty, while adding features to assist in functional style programming, imperative and object oriented programming, and has an optional class system with inheritance, calls to super, and more.
  • Roy: an experimental programming language that targets JavaScript and tries to meld JavaScript semantics with some features common in static functional languages.

Linters

Tools to detect errors (syntactic, semantic, otherwise) and potential problems in JavaScript code.

Frameworks (MV* et al)

Templates

Quizzes

CSS

Linters

Preprocessors

Editors

Sublime Text 2

Install and use Sublime Text 2 Package Control for these and other plugins.

TextMate

Vi/Vim

  • MacVim: More mac-like than the command line
  • gVim: More PC-like?

Themes (TextMate or SublimeText)

Design

Icons

  • ★ FontAwesome: The iconic font designed for use with Twitter Bootstrap
  • IconSweets: a huge FREE icon set containing over a 1,000+ icon
  • Glyphicons: designed primarily for toolbars and navigation bars in OS X Lion, the application for iPhone, iPhone 4, iPad and other Apple devices. (CC license)
  • Glyphish: Free set published under a Creative Commons Attribution license
  • FamFamFam: oldie, but goodie
  • LED Icon Set: .png icons make a professionally looking small icon set and are totally free in commercial and open source apps / websites.
  • Fugue Icons: 3,480 icons are included in PNG format (16x16 pixels) + bonus. (CC license)

Typography

  • Beautiful Web Type: A showcase of the best typefaces from the Google web fonts directory.
  • FontBomb: To blow up other websites, drag and drop this link fontBomb to your favorites bar

Free Fonts

Web Font Services

Textures

Favicons

  • Piecon: Pie charts in your favicon!

Education

Shamelessly aggregated from the following resources:

frontend-toolbox's People

Contributors

christopherscott avatar

Watchers

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