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