- Pragmatic Programmer Reference
- Software licenses in plain English
- Enki - the 5-minute daily workout for your dev skills
- Why I switched to Android after 7 years of iOS
- The Fallacy of Keeping Up
- What is a programming language?
- Site scan - run a quick code scan on any URL to check for out-of-date libraries, layout issues, and accessibility
- 101 Ways to Make Your Website More Awesome
- Asciiflow - Draw ascii
- Using progressive enhancement (gov.uk)
- Rendering Done Right
- Stop Breaking the Web
- Where to start? - Server-side rendering as the default and client-side rendering as an enhancement.
- Designing with Progressive Enhancement
- Hijax: Progressive Enhancement with Ajax
- funfunfunction
- Nodeschool - learning essential skills for working with Node.js
- Project Euler - series of challenging mathematical/computer programming problems to solve ( JavaScript is not required)
- Dom4 - a fully tested and covered polyfill for new DOM Level 4 entries
- querySelectorAll from an element probably doesn't do what you think it does
- What’s the Difference Between Class & Prototypal Inheritance? - Class inheritance has the fragile bass class problem. Favor composition over inheritance.
- JavaScript Guiding Principles
- ECMAScript 5 Strict Mode
- From jQuery to vanilla JS - examples are written with the upcoming dom4 standard in mind. A polyfill is available.
- How do JavaScript closures work under the hood - an extensive explanation of closures with visuals
- DOM Enlightenment - exploring the relationship between javaScript and the modern html dom
- null, undefined, and undeclared
- What the heck is the event loop anyway (video)
- Superhero.js - good selection of articles, videos and presentations
- js.org - most popular javascript libraries on github
- Essential Javascript links
- JSbooks
- Airbnb JavaScript Style Guide
- HTML5 Please - search for polyfills
- JSON Visualization
- Practical ES6 - a free ebook that focuses on modularity and ES6 features
- Nodeschool.io - learn ES6 - An intro to some ES6 features via a set of self-guided workshops
- Painless ES6 workflow with Atom
- ESNext - write ES2015 code and import modules from npm
- Babel ES6 repl - compiles ES6 to ES5
- Understanding ECMAScript 6
- ES6 Katas - learn ES6 by fixing failing tests. Read the article about ES6 katas.
- The Vanilla Javascript Repository
- npms - A better and open source search for node packages
- umbrellajs - Tiny library ()3kb zipped) for DOM manipulation, events and AJAX
- axios - Promise based HTTP client for the browser and node.js
- localForage - Offline storage, improved. Wraps IndexedDB, WebSQL, or localStorage using a simple but powerful API
- store.js - Cross-browser storage for all use cases
- Flow - Adds static typing to JavaScript to improve developer productivity and code quality.
- axios - Promise based HTTP client for the browser and node.js
- flexibility - Use flexbox while supporting older Internet Explorers
- fetch - polyfill for making xhr requests using promises
- moment - parse, validate, manipulate, and display dates in javascript
- Papa Parse - powerful in-browser CSV parser
- hashids - generate short unique ids from integers
- is.js - micro check library
- Gremlins.js - monkey testing library for web apps and node.js. Use the Gremlins.js bookmarklet for 1-click testing
- Nodeschool - learn javascript, node, es6, debugging, testing and more
- freeCodeCamp - learn to code by building projects for nonprofits
- Front End Web Development Quiz
- CS50 lectures
- Awesome Courses - list of awesome university courses for learning computer science
- Front-end Developer Interview Questions
- Auticons - a clever way to use icons with attribute selectors
- Difference between outline and border
- Robust Client-Side JavaScript
- 8 simple rules for a robust, scalable CSS architecture
- 'The Fab Four Technique' - Responsive styles without media queries using calc, min-width, width and max-width
- https://medium.com/javascript-scene/javascript-factory-functions-with-es6-4d224591a8b1
- Aligning Text Smartly in CSS
- @font-face tip: define font-weight and font-style to keep your CSS simple
- Setting Weights And Styles With The @font-face Declaration
- Battling BEM (Extended Edition): 10 Common Problems And How To Avoid Them
- CSS for Software Engineers for CSS Developers - applying traditional software engineering principles directly (or indirectly) to CSS.
- Write CSS in specificity order - harry roberts talk on managing css projects with itcss
- Measuring and sizing UIs, 2011-style (and beyond)
- CSS background image hacks
- animista - a wide set of css animations examples with preview/code
- A Complete Guide to Flexbox - css-tricks.com
- Putting Flexbox into Practice (Fronteers)
- A Visual Guide to CSS3 Flexbox Properties
- Almost complete guide to flexbox (without flexbox)
- PostCSS.parts - searchable catalog of PostCSS plugins
- Progress Tracker - SASS component to illustrate the steps in a multi step process e.g. a multi step form, a timeline or a quiz.
- inuitcss - Extensible, scalable, Sass-based, OOCSS framework for large and long-lasting UI projects.
- Emmet LiveStyle — the first bi-directional real-time edit tool for CSS, LESS and SCSS
- Susy toolkit - extremely versatile grid toolkit
- Reasonable Standard for CSS Stylesheet Structure
- Specificity Calculator
- csscss | gulp-csscss
- Parker - a stylesheet analysis tool that runs metrics on your stylesheets and will report on their complexity
- CSS Reference
- cssreference.io - learn by visual examples
- currentColor - issues in browsers
- Style Guide Resources
- Pure CSS loading animations
- Brian Lonsdorf - Oh Composable World! (youtube)
- Functional Programming Jargon - Jargon from the functional programming world in simple terms!
- Professor Frisby's Mostly Adequate Guide to Functional Programming
- Functional Programming - with interactive exercises
- RamdaJS - A practical functional library for JavaScript programmers
- Type Signatures
- Awesome FP JS
- srcset
andsizes - PX, EM or REM Media Queries?
- Google Resizer
- Responsive Images 101 - 10 articles about responsive images
- Responsive Patterns
- Intrinsic ratios
- Viewport Sizes
- HTML5 Element Flowchart - which HTML5 element you should use
- HTML element reference (MDN)
- Dive into HTML5
- Don't use only h1 elements
- A list of everything that could go in the head of your document
- Input Type Sandbox - test onscreen keyboards, input types, patterns and attributes
- HTML Inspector
- Unicode Character Table
- The Simplest (and Most Performant) Way to Offer Sharing Links for Social Media
- Pocket Guide to Writing SVG
- GUI for SVGO
- SVGO - optimizing SVG vector graphics files
- Google Material Icons
- IcoMoon - create svg sprites, font icons
- Fontello - icon font generator
- FiraCode - Monospaced font with programming ligatures
- Typography for Developers
- Practical Typography
- Typography Cheatsheet - comprehensive guide to using proper typographic characters, including correct grammatical usage
- Hack - an open source typeface designed for source code
- Google Web Font inspiration in HTML & CSS
- Unitless line-heights
Typography Tools
- Google Webfonts Helper - get eot, ttf, svg, woff and woff2 files + css snippets
- Input - fonts for code
- Web Font Load - install all google fonts with 1 terminal command
- Type Sample - identifying and sampling web fonts
- httpie - CLI HTTP client, user-friendly curl replacement with intuitive UI, JSON support, syntax highlighting, wget-like downloads, extensions, etc.
- JSONPlaceholder - Fake Online REST API for Testing and Prototyping
- httpstat.us - service for generating different HTTP codes
- mockAPI - generate custom data, and preform operations on it using RESTful interface and is meant to be used as a prototyping/testing/learning tool
- HTTP Request & Response Service - HTTP Request & Response Service
- Google Books API
- iTunes Search API
- REST Countries
- Base64 file encoder
- JSON Generator
- Domain lookup - with a domain autocomplete
- Sequence Diagrams - generate diagrams with Markdown like markup
- Web Sequence Diagrams - generate diagrams with a gui
- URL encoder/decoder
- Droppub - P2P publishing for everyone
- surge.sh - static web publishing for front-end developers
- srvdir - make any directory a secure public https file server in one command
- ngrok - expose a local server behind a nat or firewall to the internet
- RawGit - serves raw files directly from github with proper content-type headers
- Show browser and os info - instantly share info with a shorturl
- runnable - run code from different stacks
- cdnjs.com - cdn for js, css, images, icon fonts, etc.
- Polyfill Service - An easier way of using polyfills
- Cloudflare
- data: URI Generator
Get help and help others through several channels.
- frontenddevelopers.org/ - A Slack power community
- Stackoverflow
- freenode IRC
- Color Claim - large list of color combinations
- 0 to 255 - simple tool that helps web designers find variations of any color
- It's only color
- How to Create a Perfect Color Scheme [Infographic]
- 7 Rules for Creating Gorgeous UI (Part 1)
- 7 Rules for Creating Gorgeous UI (Part 2)
- 10 commandments of color theory
- Logo's (inspiration)
- ESNext - write ES2015 code and import modules from npm
- RequireBin - npm and browserify
- Babel ES6 repl - compiles ES6 to ES5
- TDD bin
- CodePen
- JS Bin
- repl.it - terminal emulator and code editor for multiple languages
- PrivateBin - minimalist, open source online pastebin where the server has zero knowledge of pasted data. Data is encrypted/decrypted in the browser using 256 bits AES
- Gist
- Oh shit, git!
- How To Find Bugs Using Git Bisect With This Easy Guide
- A beginner's guide to GIT BISECT - The process of elimination
- first aid git - searchable collection of the most frequently asked Git questions
- Pro Git - an online open source book
- Cleanly Handling a Fork on GitHub
- Watch & Compile your Sass with npm
- How to install global npm packages without sudo - Option 2: Change npm's default directory to another directory
- dependency-check
- browserSync
- Gulp
- Updating Dependencies in a package.json
- gulp-ruby-sass
- Flightplan - very flexible/powerful deployment/systems administration tasks tool
- explain shell
- fzf - An extremely fast command-line fuzzy finder
- the silver searcher - fast code-searching tool
- jid - json incremental digger
- Black Screen - A terminal emulator for the 21st century built with TypeScript, ReactJS and Electron
- tldr - Simplified and human readable community-driven man pages
- ncdu - install with
brew install ncdu - youtube-dl - download videos from a large list of popular sites
- The Art of Command Line
- trash - safer alternative to
rmby moving files and directories to the trash. Use osx-trash on Mac. - iTerm2 - replacement for Terminal
- ranger - text-based file manager which works like the column view in OS X’s Finder
- z - cd into most used directories
- Launch an OS X Terminal Window from the Finder
- Pandoc - universal document converter
- Evernote Backup
- Why use Markdown
- Typora - best Markdown editor with excellent WYSIWYG, no preview window and drag/drop images
- Markdown Table Generator
- Observatory - scans a site for security to configure it safely and securely
- Cipherli.st - Strong Ciphers for servers and other software
- Everything you need to know about HTTP security headers
- Majority of Android VPNs can’t be trusted to make users more secure
- Browser autofill used to steal personal details in new phishing attack
- Phishing via JavaScript Google this time not PayPal - Also see this tweet
- The target="_blank" vulnerability by example
- Things to Know (and Potential Dangers) with Third-Party Scripts
- A practical guide to securing OS X
- Massive malvertising attack poisons 288 sites
- 360 million reasons to destroy all passwords - going passwordless
- How To Kill The Password: Don't Ask For One
- Passwordless
- ProntonMail - encrypted email
- Chrome Extensions Going Rogue
- Free OS X Security Tools from Objective-See
- ProtonMail - encrypted email service using double passwords based in switzerland
- Threema - encrypted end-to-end mobile messenger
- Ricochet - encrypted end-to-end chat on desktop using the tor network
- LastPass - remote password manager
- Tresorit - encrypted cloud storage
- Alert when anything is persistently installed on OSX
- PrivateBin - minimalist, open source online pastebin where the server has zero knowledge of pasted data. Data is encrypted/decrypted in the browser using 256 bits AES
- What should you think about when using Facebook?
- [Browser fingerprints, and why they are so hard to erase](http://www.networkworld.com/article/2884026/security0/browser-fingerprints-and-why-they-are-so-hard-to-erase.html
- Command Line API Reference - Chrome Devtools
- DevTools - Google Developers
- Browser stats
- Chromium Dashboard
- Microsoft IE Status
- The Android Browser
- JSON Formatter
- Postman - REST Client (packaged app)
- Emmet Re:View
- Page Ruler
- AdBlock
- Pesticide for Chrome
- JunkFill
- OneTab
- Hangouts
- LastPass
- Evernote Web Clipper
- Middleware Guide
- Extending and consolidating hosts files from a variety of sources
- VirtualBox
- Htaccess - html5 boilerplate
- A Good User Interface
- Good Email Copy
- User Interface Design patterns
- UX Design Resources - methods & deliverables, tools, links, books, inspiration
- UI/UX Articles
- The Top and Bottom - adding value to both the big picture and the details of a design problem
- User Onboarding - see how popular web apps handle their signup experiences (slack, evernote, instagram, trello, meetup, etc.)
- Hyper Island Toolbox - a resource kit you can use to apply creative collaboration and unleash potential in your team or organization
- UX Project Checklist
- UX Myths
- 50 User Experience Best Practices - pdf
- Google Ventures Library
- The User Is Drunk
- LoremFlickr - Placeholder images
- Lists - A gallery of real data ready to be placed in your design
- fony - A simple command line tool for generating fake data from a template string
- faker.js - https://github.com/marak/faker.js
- Awesome images - list of amazingly awesome free (stock) photo resources
- Pexels - free stock photos
- picjumbo - free stock photos
- LittleIpsum - quickly copy/paste lorem ipsum sentences/paragraphs
- forceFeed - test your design for variable, dynamic content
- loripsum - a lorem ipsum generator that generates more than just plain text
- LibreStock - search through thousands of high quality do-what-ever-you-want stock photo
- Unsplash - free high-resolution photos
- A drip of JavaScripot
- GIANT ROBOTS
- HTML5 Weekly
- CSS Weekly
- Responsive Design Weekly
- JavaScript Weekly
- Smashing Magazine Newsletter
- Paparazzi! - take screenshots of responsive web pages using webkit
- pageres-cli - capture responsive website screenshots
- Full Page Screen Capture
- Go paperless with the Doxie One and Evernote
- Nativefier - make any web page a desktop application
- The Ultimate Guide to Personal Productivity Methods
- LICEcap - screen capture to gif
- Trello - flexible, and visual way to organize anything with anyone
- Spectacle - osx window manager
- Slack - easy messaging app for teams
- Awareness - subtle awareness of time spent on the computer
- How a password changed my life
- Toggl - time tracker for desktop and mobile
- F.lux
- MacOS QuickLook for Markdown files
- Grab - create screenshots (default installed)
- Digital Color Meter - color picker (default installed)
- Etcher - Burn images to SD cards & USB drives, safe & easy
- Wumo - comic
- Commitstrip (comic) - comic
- Fowl Language - comic
- Glasbergen - comic