Web Dev Links
Tools I’ve come across that are a great reference for web developers. Some of these I use in my current workflow, others are just here for when I need them.
Tools
- Cubic Bezier
-
Easings
Easing functions cheat sheet
- Quicklinks
- MP4 Video Compressor
- Javascript Minifier
- CSS Minifier
- Autoprefixer
-
Squoosh
What I use to optimize images
-
Carbon
Create beautiful images of source code
-
SVG Artista
Animate fill and stroke on SVGs
-
SVG OMG
Optimize and clean up SVGs
-
Sheetson
Build APIs from Google Sheets
-
Color Thief
Grab the color palette from an image using just Javascript
-
Dev Fonts
Monospace fonts for developers
-
Ray.so
Another options to create beautiful images of code
-
Tiny Helpers
A collection of one-off dev helper sites
Learn to Code
-
CSS Diner
A game to learn CSS selectors
-
CSS Grid Garden
A game for learning CSS Grid
-
Flexbox Froggy
A game for learning CSS Flexbox
-
Frontend Mentor
Improve your front-end coding skills by building real projects
-
The Web Project Guide
A collection of Articles to learn about web projects
-
picoCTF
Computer security game created by security experts at Carnegie Mellon University.
-
Untrusted
A javascript adventure game
-
Code Avengers
Fun & effective online learning
-
Deep Javascript
Deep, complex javascript topics
-
hackr.io
Find the Best Programming Courses & Tutorials
-
Codecademy
Learn to code
-
Udemy
online courses to learn anything
-
Freecodecamp
Learn to code at home
-
Laracasts
Netflix for developers
-
Scrimba
Learn to code with interactive tutorials
-
Ultimate Courses
Expert web development courses
-
Pluralsight
Learn tech skills
-
Treehouse
Learn to code, gain a new skill, get a new job
-
LeetCode
Exercises to learn how to code
- Today's best developer Blogs on any tech stack
Vue.js
Svelte
Everything Else
-
Enboard
Additional resources for everything
- Web Developer Checklist
-
Browsersync
Synchronized browser testing
-
Tachyons
Functional CSS
-
Siteground
My preferred hosting option
- SASS Techniques
-
Fullstory
Analytics, session replay, heatmaps
-
Freecodecamp
Learn to Code
-
Itty Bitty
Websites encoded completely in the URL
-
Zdog
3D SVGs
-
Printable PDF Newspaper
Converts Worpdress posts into a PDF newspaper
-
Swup
For page transitions
- Flat and a half UI elements
-
Tiny Helpers
A collection of free single-purpose online tools for web developers
-
30 Seconds of Knowledge
Displays random code snippets whenever you open a new tab
-
Uploadcare
Resizes images automatically based on browser size
-
anime.js
Javascript animation engine
-
new.css
Modern websites with only HTML
- MIT Licensed Code Snippets
-
Better Wiki
A curated directory of best practices from top companies
-
AR Cut & Paste
An AR+ML prototype that allows cutting elements from your surroundings and pasting them in an image editing software.
-
Indiehackers
A community for web developer side projects
-
Teachable Machine
Train a computer to recognize your own images, sounds, & poses.
-
Arwes
A sci-fi UI Framework