awesome-deved
DevEd hub
A curated collection of notable developer education resources and initiatives
DevEd with umami. Awesome List of developer education covering blogs, tutorials, academies, visual essays, games, and more.
36 stars
3 watching
3 forks
last commit: 5 months ago
Linked from 1 awesome list
awesomeawesome-listdeveddeveloper-educationdeveloper-relationsdevreleducation
Academies & Universities | |||
| Algolia Academy | Training, certifications, live events covering Algolia and integrating with different use cases like front-end, search, and UX | ||
| Hashicorp Developer | Includes courses and certifications | ||
| JetBrains Academy | Learn languages, skills, build apps, and more with over 30+ tracks and 2,000+ tech topics through their platform | ||
| JFrog Academy | Training on using JFrog products, focused on upskilling developers using JFrog products | ||
| LaunchDarkly Academy | LaunchDarkly's academy with a solid space theme featuring self-paced learning and virtual labs/workshops | ||
| Learn Chef | Chef's learning site, cited as their top lead generator | ||
| Learn Cypress | Custom learning site built with Next.js by the Cypress team ( ) | ||
| Learn MongoDB | Self-paced courses, get certifications, and learn MongoDB. Cited 15% of their revenue is derived from leads with the University/Learn site as their first-touch | ||
| Redis University | Instructor-led courses, certifications. Cited as creating highly-qualified leads | ||
| Storybook Tutorials | Self-paced peer-reviewed learning courses built by the Chroma UI team. ( ) | ||
| Twilio's Segment Academy | Web-based lessons that you can also get dripped via email. Example of a lead magnet | ||
Blogs | |||
| Amelia Wattenberger | Amelia is a data visualization and experience engineer with a blog that features awesome interactive samples and visual essays | ||
| GitHub README Project | The ReadME Project amplifies the voices of the open source community: the maintainers, developers, and teams whose contributions move the world forward every day | ||
| LogRocket | Attracts millions of developers with over 3,000+ articles on frontend topics | ||
| Twilio | Over 2,000+ tutorials since 2008 on ways to integrate and use Twilio products | ||
| The Ankur Tyagi | Attracts 100K+ developers with over 50+ technical articles on developer tools and writing for engineers | ||
Books | |||
| Beautiful Racket | Online book on language-oriented programming using Racket by Matthew Butterick | ||
| Practical Typography | Online book on typography by Matthew Butterick | ||
| Select Star SQL | Interactive book that teaches SQL using a Texas Death Row dataset by Zi Chong Kao | ||
| The Pragmatic Programmer | A timeless guide that equips software developers with practical techniques, tools, and principles | ||
Conference Talks | |||
| Drawing the Invisible: React Explained in 5 Visual Metaphors | An amazing visual talk by Maggie Appleton that explains React just like it says | ||
| It's not what you read, it's what you ignore | Insights from Scott Hanselman on how to focus on value and stop working on things that are unimportant | ||
| Stop Drawing Dead Fish | An incredible talk by Bret Victor about the essence of digital art | ||
| Wat | Widely shared talk on the quirks of JavaScript and Ruby by Gary Bernhardt | ||
| You are Not an Impostor | A great dive into imposter syndrome and ways to deal with it | ||
Courses / Single Learning Path | |||
| DashingD3js | A nuts and bolts explanation of the D3 animation library | ||
| Epic React | Code-along interactive course and workshops that teach React fundamentals. 19 hours of course material plus 10 hours of conversations with React experts | ||
| Hack Yourself First | A website made by Troy Hunt that showcases 50+ sloppy security practices as part of | ||
| Learn Git Branching | Gamified interactive Git course that emphasizes branching | ||
| Serverless Visually Explained | See and interact with serverless concepts with animated examples, code snippets, and demos | ||
| Svelte Tutorial | Interactive step-by-step tutorial to learn Svelte | ||
| TypeScript Training | Interactive and self-paced course on learning TypeScript with annotated code snippets and formatting specifically designed for the TS compiler | ||
| Web Audio School | Interactive WebAudio tutorials | ||
Courses / Multiple Learning Paths | |||
| CryptoZombies | Learn Solidify and Ethereum blockchain development by creating learning games | ||
| Execute Program | Interactive courses on TypeScript, Modern JavaScript, SQL, regular expressions, and more. Each course is made up of hundreds of interactive code examples running live in your browser | ||
| NodeGuardians | Learn web3 in a gamified RPG-like experience with campaigns, quests, skill trees, and character management | ||
Courses / Course Platforms | |||
| Code.org | Every student in every school should have the opportunity to learn computer science | ||
| Codecademy | Learn to code interactively, for free | ||
| Educative | Self-paced developer education platform | ||
| FreeCodeCamp | Non-profit site where anyone can contribute educational content, get certifications, and find jobs | ||
| Pluralsight | The professional tech upskilling platform | ||
| Wilco | Gamified hands-on simulator for teaching developers how to use dev tools and products in a real-world-like environment using Quests | ||
Courses / Course Creation | |||
| CourseMaker | SaaS product for creating, hosting, and selling technical courses | ||
| CourseMaker/gatsby-theme-coursemaker | 29 | almost 3 years ago | Gatsby.js Theme from CourseMaker designed for individual creators that sell courses |
| Wilco | Gamified hands-on simulator for teaching developers how to use dev tools and products in a real-world-like environment using Quests | ||
Documentation | |||
| Hashicorp Docs | All-in-one dev hub w/ built-in bookmarks, progress, self-paced tutorials with videos, certifications, and more | ||
| React Docs (beta) | Includes interactive labs and challenges | ||
| Medusa | Redesigned and treated as a product (see | ||
| Nivo | D3 viz library with interactive visualizations as the docs | ||
| Stripe Docs | Interactive and example-rich developer documentation for the popular payment platform | ||
| Twilio Docs | Interactive and example-rich developer documentation for the popular communication platform. (Also see: ) | ||
Documentation / Tools | |||
| Alphadoc.io | Platform. Build interactive documentation using visual tools featuring sequence diagrams and visual stories. Primarily for OpenAPI-based projects and SDKs | ||
| Code Hike | Easily build code tutorials with MDX and React | ||
| Diátaxis | Originally developed by Daniele Procida at Divio, this is a unified system for developing technical documentation | ||
| Docusaurus | Open source. Docusaurus is a static-site generator. It builds a single-page application with fast client-side navigation, leveraging the full power of React to make your site interactive | ||
| Docfx | Open source. Documentation and static site generator for .NET API projects | ||
| Docz | 23,665 | about 1 year ago | Open source. Documentation site starter for Gatsby.js that offers built-in features to make writing documentation sites easier |
| gatsby-gitbook-starter | 989 | 19 days ago | Open source. A starter for Gatsby.js that matches the style of GitBook and supports a bunch of documentation-related features |
| GitBook | Free + Per User Pricing. Documentation platform/framework supporting CMS-style editing and hosting of docs and technical content | ||
| Mintlify | Free + Flat Monthly Pricing. Documentation platform/framework supporting MDX-based docs, GPT-based search, component library, and more | ||
| Readme | Free + Per Project Pricing. Developer hub platform to host technical documentation with versioning, playgrounds, usage analytics, forums, and interactive APIs | ||
| Redoc | Open source. Alternative to Redocly to host API documentation with interactive playgrounds | ||
| Redocly | Free + Flat Monthly Pricing. Developer hub platform to host API documentation with interactive playgrounds | ||
| Shiki | 10,495 | about 12 hours ago | Embed code samples with VSCode-powered syntax highlighting |
| Shiki Twoslash | The power of Shiki, plus TypeScript compiler annotations | ||
| Wilco | Gamified hands-on simulator for teaching developers how to use dev tools and products in a real-world-like environment using Quests | ||
Games / CSS | |||
| CSS Diner | It's a little game to help you learn CSS selectors | ||
| CSS Grid Garden | A game for learning CSS grid layout | ||
| Flexbox Defense | Unlike other tower defense games, you must position your towers using CSS! | ||
| Flexbox Froggy | A game for learning CSS flexbox | ||
| Flexbox with Webflow | Learn and master flexbox in 28 interactive levels—without writing code | ||
Games / Developer Tools | |||
| Ably Serverless Websockets Quest | Learn Serverless Websockets through an ADND multiplayer game ( ) | ||
| Ably Space Invaders | Multiplayer Space Invaders game built with Phaser and Ably APIs. ( ) | ||
| Ably Tower Defense | 6 | over 2 years ago | Demo showing Ably's real-time API in action with a multiplayer Tower Defense game |
| Wilco | Gamified hands-on simulator for teaching developers how to use dev tools and products in a real-world-like environment using Quests | ||
Games / Editors | |||
| Open Vim | Interactive Vim tutorial | ||
| Vim Adventures | Learning Vim while playing a game | ||
| Vim Genius | Increase your speed and improve your muscle memory with Vim Genius | ||
Games / Linux | |||
| Bashcrawl | Learn Linux commands by playing a simple text adventure | ||
Games / Databases | |||
| SQL Murder Mystery | Solve a crime while practicing database skills | ||
Games / JavaScript | |||
| Screeps | The world's first MMO strategy sandbox game for programmers | ||
| Untrusted | Learn while playing a JavaScript adventure game | ||
| TwilioQuest | Go on a quest to learn web development how to build a web app with JavaScript and Twilio | ||
| WarriorJS | 9,449 | over 1 year ago | Using JavaScript, program a warrior to climb a tall tower, fight monsters and rescue captives |
Games / Programming | |||
| BOX-256 | Program a fictional CPU with assembly to output graphics | ||
| Clips the Game | A demanding logic game based on the clips rule engine | ||
| Code Avengers | Learn to build websites, apps and games in a fun and effective way | ||
| CodeCombat | An engaging coding game for learning programming | ||
| CodinGame | A challenge-based training platform where you can play with the hottest programming topics | ||
| Cube Composer | A puzzle game inspired by functional programming | ||
| Deadlock Empire | Solve puzzles with concurrency | ||
| Mimo | Learn how to become a developer on mobile | ||
| Programming Games Wiki | A long-standing catalogue of programming games through the years | ||
| RegexOne | Learn Regular Expressions with simple, interactive exercises | ||
| ReturnTrue | A game were you learn about booleans, return true to win | ||
| Swift Playgrounds | Learn to code on your iPad in a seriously fun way | ||
Games / Security | |||
| XSS game | A game about tricking people into running code in their browsers | ||
Games / Web3 | |||
| CryptoZombies | Learn Solidity and Ethereum blockchain development by creating learning games | ||
| NodeGuardians | Learn web3 in a gamified RPG-like experience with campaigns, quests, skill trees, and character management | ||
Learning Experience Platforms (LXPs) | |||
| Appsembler | B2B SaaS LXP built on top of , designed for developer education (powers Chef, Redis, etc.) | ||
| Tutor | Self-managed Docker version of | ||
| Wilco | Gamified hands-on simulator for teaching developers how to use dev tools and products in a real-world-like environment using Quests | ||
Podcasts | |||
| Corecursive: Coding Stories | Like but for software developers | ||
| The Rabbit Hole | A lighthearted podcast that takes a pragmatic look at trends in software development | ||
Video Channels | |||
| Fireship | Short videos on a wide variety of programming topics, complete with plenty of tongue-in-cheek humor | ||
Reference Sites / Microsites | |||
| CSS Reference | Complete reference of CSS properties with examples | ||
| HTML Reference | Complete reference of CSS properties with examples | ||
| Flexbox Cheatsheet | Turns static W3C spec of CSS Flexbox Level 1 into interactive examples | ||
| Illustrated.dev | Illustrated explanations of web development, technology & a little bit of anthropology | ||
| Microfrontend.dev | Learn about the microfrontend architecture pattern and practices, and when / when not to consider it | ||
Reference Sites / Wikis/Community Sites | |||
| MDN | The Mozilla Developer Network. Documenting web technologies, including CSS, HTML, and JavaScript, since 2005 | ||
| Microsoft Docs | Formerly MSDN. Documenting the Microsoft (and surrounding) ecosystems since 1992 | ||
| StackOverflow | The top Q&A programming site | ||
Visual Essays / Individual Essays | |||
| Advanced animation patterns with Framer Motion | Maxime Heckel | ||
| Build your own React | Rodrigo Pombo | ||
| Care About What You Build | Brandon Hilkert. An introspective article on loving software development even when you may not be working on the most glamorous product | ||
| CSS Cascade | Amanda Wattenbrger. The cascade is a river, and has a kayaker that paddles downriver as you scroll through the article | ||
| Cubic Bézier: from math to motion | Maxime Heckel. Features interactive animations that showcase different types of curves | ||
| Dark Mode by Local Sunlight | Chris Nicholas | ||
| How do arrays work? | Nanda | ||
| How to remember things | Nicky Case | ||
| Lights and Shadows | Bartosz Ciechanowski | ||
| Making things move | Varun Vachhar | ||
| Moving along a curved path in CSS with layered animation | Tobias Ahlin | ||
| Noise in Creative Coding | Varun Vachhar | ||
| 1 | [Parents vs. Owners in React] - Jules Blom, a two-part series ( ) and ( ) | ||
| Rebuilding Babel: The Tokenizer | Nanda Syahrasyad. Features a custom widget to step through the tokenization process, which displays interim results | ||
| Tasks, microtasks, queues and schedules | Jake Archibald. Features an animated step-by-step diagram that got tons of love for in the comments. Not a "full" dataviz essay but interactive visual is umami | ||
| Up and Down the Ladder of Abstraction | Bret Victor. Takes an example of designing a control system for a simple car simulation, and references it throughout the essay with visuals and interactive widgets accompanying the narrative | ||
| Which Blend Mode | Chris Nicholas. Featuring interactive examples to show the varying results of different blend modes | ||
Visual Essays / Collections | |||
| Amelia Wattenberger | Amelia is a data visualization and experience engineer with a blog that features awesome interactive samples and visual essays | ||
| Explorable Explanations | Combining learning and play, the site is a hub of interactive and visual essays around topics, not only limited to data viz and programming | ||
| Jules Blom | Frontend developer specializing in React and D4.js who writes visual essays, including walkthrough code samples, embedded quizzes, and interactive diagrams | ||
| Maggie Appleton | Makes visual essays about UX, programming, and anthropology | ||
| Pudding.cool | Data viz magazine featuring many different visual essays | ||
| Worrydream | Bret Victor. Unique web-based site design, visual essays, and interactive demos | ||
fmerian/awesome-developer-first-channels