Sometimes it's easier to understand code through pictures than by looking at the code itself. I compiled a list of (free!) code tutorials that help you learn through nice pictures.
JavaScript Tutorials
🏋🏽♀️ JavaScript Service Workers, Visualized
🔘 Big O Notation Visualized with Flowcharts
🎬 Node Package Manager (NPM) Explained By Directing A Movie
🥙 Understanding the basics of Express.js by Going Out To Eat
👸🏽 How JavaScript variable scoping is just like multiple levels of government
👨🏽🎓 Javascript's Filter Function Explained By Applying To College
🥗 JavaScript’s Reduce Method Explained By Going On a Diet
🎲 JavaScript Promises Explained By Gambling At A Casino
📖 Merge Sort Explained by Reading A Book
🍚 State (in JavaScript) Explained by Cooking A Simple Meal
🛷 JavaScript Arrow Functions Explained By Going Down A Slide
🛁 Bubble Sort Algorithm Explained
🎶 JavaScript’s “this” Explained By Starting A High School Band
💡 JavaScript’s apply, call, and bind explained
🖥 JavaScript Visualized: The JavaScript Engine
📱 Javascript Visualized: Generators and Iterators
💻 Javascript Visualized: Prototypal Inheritance
➰ Javascript Visualized: Event Loop
⬆️ Javascript Visualized: Scope
⤴️ Javascript Visualized: Hoisting
🗺 What is Map/Filter/Reduce in Javascript?
🗾 Javascript Map() Explained By Going on a Hike🧗🏽♀️
CSS Tutorials
Web Performance Tutorials
🐅 Loading web pages fast on a $20 phone
DevOps
✨ CS Visualized: Useful Git Commands
🥜 Kubernetes and Virtual Kubelet in a nutshell
I remember when JavaScript tutorials using emojis to explain concepts were always on the front page of dev.to. Did I miss something? Comment so I can add to the list!
Top comments (10)
It's really amazing
Great Resources man
Good job!
Great collections! Thank you! But Big O Notation Visualized with Flowcharts and Docker Fundamentals are broken links
Too good concept, appreciate hole wholeheartedly…
Docker Fundamentals returns a 404 for me?
docs.docker.com/get-started/docker...
O big returns 404 error
Big O returns 404