Tools, sites, and resources I use.
devdocs – All the documentation.
- htmlreference.io – List of all the HTML elements with nice examples.
- Pug – A nice abstraction over HTML for Node.js
- cssreference.io – List of all the CSS properties with nice examples. Beautiful site. 🌈
- 30 Seconds of CSS – Curated list of #sick css snippets.
- SCSS – SCSS, and NOT SASS. Nice abstraction on CSS that’s basically what the CSS spec is evolving into anyway, so why not get a head start?
- shade – Gradient explorer. The only one you’ll ever need.
- learncssgrid.com – List of ALL the CSS grid properties on one page. Very visual and accessible.
- ES6 Overview – Simple overview of new ES6 features. Example-heavy.
- ES6 Overview more in-depth – Overview of new ES6 features, like the above, except with less examples and more explanation.
- Catolog of Design Patterns – Really well-designed and visual guide of common design patterns.
Version Control (Git)
- Learn Git Branching – Learn Intermediate-to-Advanced git skills in a very visual and useful way.
- Simple Git Guide – Simple git guide. ALL on one page, big fonts, well-designed. Check it out.
- Less Simple Git Guide – You know all that stuff I said about the above link? Uhhh, yeah. This one’s a big more in-depth. Still on one page though, so it’s digestable.
Learn X in Y minutes – Get the syntax on any language.
RegexOne – Learn Regular Expressions with simple, interactive exercises. Very well designed, and pretty fun.
RegExr – Great environment to testing Regex expressions. Gives you explanations for what’s going on as well.
Regex Crossword – Do Regex crosswords. Great for practicing, and fun!
Unsplash – The only stock photo site you need to know about.
Gradient Joy – Beautiful gradients as placeholder images. Schnazzy.
Unsplash Random Image – Get a random unsplash placeholder image
Lists – Collection of lists and public data for you to mess around with.
Codewars – Practice coding online.
Markdown Cheat Sheet – Best cheat sheet I’ve found on Markdown.
CommandlineFu – List of community-submitted shell commands, ranked by popularity.
Tiny helpers - A collection of free single-purpose online tools for web developers.
Excalidraw - Online drawing tool. Great for quick/simple flow diagrams and charts.
Type-Scale - Font scale tool that’s great for visualizing font pairings and scalings.
caniuse.com – Find out if you can use that new feature in the browser.
Fast.com – “How fast is my internet connection?” This site will tell you.
haveibeenpwnd.com – Enter your email address and see if you’ve been compromised by any data breaches.
What every Browser knows about you – Get a breakdown of ALL the data your browser is broadcasting to every site you visit.
repl – Fantastic little REPL to try out any programming language.
draw.io – Online diagram tool.
- Tweetdeck – Much cleaner UI than twitter’s native web client. Also, you don’t get the annoying posts in your feed of what people you follow are “liking.”
- Glitch – Cool dev community with tutorials and an environment to code online.
- dev.to – Great community with tutorials and dev advice galore.
- Free Code Camp – Best free online way to learn coding.