Tools
Text Editors / IDEs¶
- Atom - (Atom Flight Manual, Packages, My Setup)
- Text Wrangler
- vi, vim, emacs
- JEdit
- Eclipse
- Visual Studio Express
- XCode
- Sublime Text
- Brackets
- Jetbrains
- Geany
- Netbeans IDE
- TextEdit (MacOS)
- Notepad (Win)
- Visual Studio Code
Systems¶
Browsers¶
Terminals¶
Localhost¶
These are common LAMP stack based environments for local web development.
Website Copiers¶
Static Site Generators / Documentation¶
- StaticGen - Top Open-Source Static Site Generators
- mkdocs, Material Theme
- Gitbook
- Pandoc
- Metalsmith
- Jekyll
- Hugo
Web Languages I¶
HyperText Markup Language (HTML)¶
- HTML (Mozilla)
- Google Web Fundamentals
- HTML Tutorial
- HTMLDog - HTML Beginner Tutorial
- HTMLDog - HTML Intermediate Tutorial
- HTML Validator
- Dive into HTML5
Cascading Style Sheets (CSS)¶
- CSS (Mozilla)
- CSS Intro
- CSS Tutorial
- CSS-Tricks
- CSS Basics
- HTMLDog - CSS Beginner Tutorial
- HTMLDog - CSS Intermediate Tutorial
JavaScript (JS)¶
- JavaScript (Mozilla)
- Mozilla Guide
- Javascript.com
- W3C Javascript Tutorial
- Eloquent Javascript (Book)
- W3C JSON Tutorial
Web Languages II¶
Web Protocols¶
Programming Languages¶
Coding Standards¶
- Tools that can help you make your own style guides
- Airbnb Javascript Style Guide
- Isobar Front-end Code Standards
- Google Style Guides - All languages
- Google Web Development
- Mozilla Developer Guide - Coding Style
Frameworks and Libraries¶
- jQuery
- jQuery Mobile
- node.js, npm, nvm. (Beginner Tutorial, Felix's Node.js Beginners Guide)
- React
- React Native, Use React Native, Nuclide (Atom Package)
- Express - For Node.js
- MongoDB
- Angular
- Mobile Angular UI
- Vue
- Omniscient
- Riot
- Backbone.js
- Aurelia
- Ember
- Meteor
- Rails - Uses Ruby language
- Masonry.js
- Moment.js - Parse, validate, manipulate, and display dates and times
Search Engines¶
General-Purpose Task Runners¶
- Gulp - Automated task runner
- Getting started with gulp - Good overview of the tool.
- An Introduction to Gulp.js - This is a nice little primer explaining how it works and how it is different from Grunt.
- Gulp Recipes
- Grunt - JavaScript Task Runner. Older than Gulp.
- npm - Part of Node.js
Dependency Management¶
Module Bundlers¶
- Browserify
- Webpack - Asset bundler
- RequireJS
Linting¶
- Github Collection of Clean Code Linters
- ESLint
- JSHint - JS error checking
- JSLint
Test Frameworks¶
Compilers and Extensions¶
- CoffeeScript - Simplified Javascript
- LiveScript
- TypeScript
- Babel - Javascript compiler. Commonly used for JSX.
- SASS - CSS Extension
- LESS - CSS Pre-Processor
Web App Framework / Workflow¶
Sandboxes¶
Examples of Sandbox-like / Code Sharing Environments
- Codepen - HTML, CSS, JS
- JSFiddle - HTML, CSS, JS
- Scratchpad (HTML/JS)
- JS2Coffee - JS, Coffeescript
- CodeSandbox - React, Angular, Vue, Preact, Svelte
- JSBin - JS
- Pastebin
- Javascript Sandbox - JS
- Kixx Demos
- CSS Desk - CSS
Mobile App Prototyping¶
Template Engines¶
- Mustache
- Handlebars
- Underscore
- Pug - Formerly Jade
- Embedded JS (EJS)
- Transparency - For jQuery
- Dust
- doT - For Node.js
- Template 7
Documentation Generation¶
Various Web Tools¶
- Spritecow - For working with sprites
- Create CSS3 - CSS generator
- Travis CI
- Electron - Desktop App Build Systems
- Modernizr - JS that tells you what HTML, CSS, and JS features a brower as.
API Development¶
- Sandbox
- Postman - API Development
- okta
- RunKit
- APIs (Application Programming Interfaces)
- Working with data from APIs such as Instagram, Slack, etc
- What is an API?
- Postman - A great tool for working with APIs
- HTTP: The Protocol Every Web Developer Must Know
- RESTful Web Services
Ports¶
Development News¶
Techstacks¶
- Stackshare - Tech Stacks - The open source tools and SaaS behind the world's best startups. ie AirBnb, FB, Uber, etc
- The Book of Secret Knowledge - A collection of awesome lists, manuals, blogs, hacks, one-liners, cli/web tools and more. Especially for System and Network Administrators, DevOps, Pentesters or Security Researchers.
- Front-End Case Studies - A great collection of case studies about front-end development tools and practices across industry.
- Front-End Developer Handbook 2019 - A deep dive into front-end dev tools and workflows.