Список полезных инструментов для frontend разработчиков


Bug trackers (browsers & engines)

Mobile simulators

Browsers Dev Builds

Where to download version X of browser Y?

Browsers plugins

Code snippets

  • Dabblet — interactive playground for quickly testing snippets of CSS and HTML
  • JSBin — JavaScript, HTML and CSS playground
  • gist.github — code snippets
  • GitLab Snippets — code snippets
  • JSFiddle — JavaScript, HTML and CSS playground
  • CodePen — Another JS, HTML, CSS sandbox
  • Plunker — Open-source JavaScript, HTML and CSS playground with real-time code collaboration
  • RegExr — regular expression playground



JS frameworks

  • TodoMVC — helping you select an MV* framework.
  • Backbone.js — give your JS App some Backbone with Models, Views, Collections, and Events.
  • Knockout — is a JavaScript MVVM library that makes it easier to create rich, desktop-like user interfaces with JavaScript and HTML.
  • Knockback.js — provides Knockout.js magic for Backbone.js Models and Collections.
  • React — A JavaScript library for building user interfaces
  • AngularJS
  • Ember.js
  • CanJS
  • Spine — lightweight MVC library for building JavaScript applications.
  • Batman.js — is a framework for building rich single-page browser applications with CoffeeScript or JavaScript.
  • Dojo
  • Agility.js — is an MVC library for client-side Javascript that lets you write maintainable code without compromising on development speed. It’s write less, do more with maintainability.
  • Closure Library is a broad, well-tested, modular, and cross-browser JavaScript library.
  • Metro JS — plugin for jQuery which enables the Modern UI interface on the web.
  • toastr — simple JavaScript toast notifications.
  • jsdb.io — The definitive source of the best JavaScript frameworks, plugins, and tools

Testing frameworks

Assertion libraries

  • Chai — Chai is a BDD / TDD assertion library for node and the browser that can be delightfully paired with any javascript testing framework
  • expect.js — Minimalistic BDD-style assertions for Node.JS and the browser
  • should.js — BDD style assertions for node.js


Template engines


CSS Preprocessors

CSS Postprocessors

CSS frameworks

Platforms for building web app

  • Meteor — Meteor is an open-source platform for building top-quality web apps in a fraction of the time, whether you’re an expert developer or just getting started.
  • Google Apps Script — Build web apps and automate tasks with Google Apps Script

Style guides and methodologies

Styleguide generators







  • jQuery Docs
  • You Might Not Need jQuery
  • Try jQuery
  • MDN
  • dochub.io — CSS, HTML, JavaScript, DOM, jQuery, PHP, Python
  • devdocs.io — HTML, CSS, DOM, DOM Events, JavaScript, jQuery
  • overapi.com — Collecting All Cheat Sheets
  • Bento — Everything you need to know about web development. Neatly packaged.
  • Superherojs.com — This site is a continuously updated list of articles that help explain the syntax of JavaScript, how to organize your projects, how to test your code, and what’s on the horizon.
  • JSBooks — JSBooks the best free JavaScript books/resources
  • WebPlatform.org — Open community of developers building resources for a better web, regardless of brand, browser or platform

Validators & Quality Tools

  • W3C HTML Validator
  • W3C CSS Validator
  • CSSLint — static analysis tool for CSS code
  • RECSS — A simple and attractive code quality tool for CSS built on top of LESS
  • SCSS-Lint — Configurable tool for writing clean and consistent SCSS
  • JSLint — The JavaScript Code Quality Tool by Douglas Crockford
  • JSHint — community-driven tool to detect errors and potential problems in JavaScript code
  • JSCS — JavaScript Code Style checker
  • livestyle.io/analyzer — A working prototype of LiveStyle’s conceptual UI for improving preprocessor stylesheet editing workflow.


CLI Apps

  • Grunt — Javascript task runner
  • Gulp — Javascript task runner based on node streams
  • Yeoman — Developer workflow
  • Brunch — Brunch is an assembler for HTML5 applications
  • Bower — Javascript package manager
  • Jam — Jam is a package manager for JavaScript
  • Component — Component package manager for building a better web
  • Karma test runner — Spectacular test runner for Javascript
  • browser-repl — Launch a repl on your command line to any browser in the cloud

OS X Apps

  • CodeKit — web-dev workflow in the one app: compile everything, autorefresh all browsers, catch errors, add source maps
  • Sketch — beautiful, simple, and powerful vector graphics app.
  • Google Web Designer — tool for creating interactive HTML5-based designs and motion graphics
  • ColorSnapper — easy-to-use tool for quickly finding out the color of any pixel on the screen
  • Gitbox — version control as easy as Mail
  • LiveReload — “As soon as you save a file, it is preprocessed as needed, and the browser is refreshed…”
  • PixFit — measure tool
  • xScope — for measuring, inspecting & testing on-screen graphics and layouts
  • MAMP PRO — Mac, Apache, MySQL and PHP
  • DataURLMaker
  • ImageOptim — drag’n’drop UI and various optimisation tools
  • ImageAlpha — converts 24-bit PNG to paletted 8-bit with full alpha channel
  • BLESS CSS — fighting IE’s CSS selectors limit, and nice tool for checking CSS selectors count
  • Kaleidoscope — a nice diff tool
  • Dash — gives you instant offline access to 80+ API documentation sets.
  • Ghostlab — responsive development workflow tool that allows for synchronized testing of your web app across multiple devices — similar to Edge Inspect
  • ClipMenu — A clipboard manager for Mac OS X
  • noiz.io – ambient sound equalizer for relax or productivity.