All activity

Interactive TypeScript tutorial.
Made for developers with intermediate JavaScript experience.
Learn TypeScript
Learn TypeScript step by step in an interactive environment

Jad Joubran
left a comment
Hey Product Hunt!
As an educator, I kept hearing the following questions:
- "What project should I build to add to my portfolio?"
- "What should I build to practice my JavaScript knowledge?"
That's exactly why I built "Learn JavaScript Projects". A collection of free project ideas, designs, and instructions that you can use to enrich your portfolio.
For each project, you can read the...

Learn JavaScript Projects
Free JavaScript Projects & Figma Designs for Your Portfolio.

Build projects from scratch to practice your JavaScript skills. You can use the projects you build in your portfolio to get a job as a JavaScript developer. We provide you with the instructions and Figma designs for free.

Learn JavaScript Projects
Free JavaScript Projects & Figma Designs for Your Portfolio.

This interactive knowledge map shows most of the topics you need to know about when learning React (with hooks).

React Knowledge Map
Interactive React knowledge map

I've built this interactive knowledge map (available in radial and linear mode) to help you visualise the topics you need to learn when getting started with programming.

Programming Knowledge Map
Interactive knowledge map for beginners (in JavaScript)

The easiest way to learn React 18 with flashcards.

React 18 interactive tutorial
Learn React 18 interactively


Semantics and accessibility have been frequently neglected on the web. This interactive platform guides you step by step into learning modern HTML CSS that is semantic and accessible.

Learn HTML CSS
Interactive platform for semantic and accessible HTML CSS

I've built this Interactive JavaScript Knowledge Map that allows developers to get a glance at _most_ topics in modern JavaScript.

JavaScript Knowledge Map
Interactive knowledge map for JavaScript

Jad Joubran
left a comment
@mattzeunert That's amazing! I've also had similar issues when consulting for clients and I had to copy the source code and check manually what it's made up of. Thank you so much!

HTML Size Analyzer
Identify the cause of bloated HTML code

At the beginning of 2021, I started re-writing the curriculum of learnjavascript.online and I'm happy to announce that it's now live!
👉 75 chapters of modern JavaScript
👉 Learn step by step with flashcards
👉 Interact with real APIs
👉 Lots of DOM + Fetch projects

Learn JavaScript
Learn JavaScript with guided tests and flashcards

Learn in an interactive environment with interactive lessons, challenges & flashcards.
This is the right website for you if you've *never* written a line of code before.

Learn Programming
The easiest way to learn Programming for absolute beginners

Jad Joubran
left a comment
Hey PH, this is what I've been working for the past few months, excited to hear what you think!

React Tutorial
Interactive in-browser React Course with flashcards

Learn in an interactive environment. Understand how React works not just how to build with React.

React Tutorial
Interactive in-browser React Course with flashcards

Learn in an interactive environment. Study short lessons and then practice in an intuitive environment based on Tests.
Learn JavaScript
The easiest way to learn & practice modern JavaScript

Webdash Hue plugin is a webdash plugin that lets you manage your Philips hue lights from the comfort of your web dashboard!

Webdash Hue plugin
Control your philips hue straight from the dashboard

Webdash helps you visualize, monitor & manage your web project right in the browser using community-driven plugins
Webdash is open source, which means you can create your own custom plugins in Webdash.

Webdash
A customizable web dashboard for your web projects