Open source · Free · English & Bahasa Indonesia
Learn front-end until you understand how it works.
A 20-stage roadmap, a practice room right in your browser, and installable toolkits. For developers who want more than knowing how to use a framework.
What is fet?- stages
- 20
- ordered phases
- 8
- toolkit packages
- 3
- languages
- 2
Method
Three steps in every stage
- 01
Understand the concepts
A concept map from basics to deep dive, with primary sources like specs and source code. Tick off what you've mastered.
How to learn - 02
Practice right away
Write HTML, CSS, and JavaScript in the Learning Room and see the result instantly. Notes and progress are saved to your account.
Open the Learning Room - 03
Explain it in your own words
Record a short explanation video as evidence of learning, then share it with the community. If you can explain it, you understand it.
See the community
Roadmap
From how the internet works to desktop apps
Each stage builds on the previous one. Start at phase 1, or jump to the topic you need.
Toolkit
Small packages that grow out of the material
No runtime dependencies, tested, and the source is deliberately short so you can read it as study material.
@chalidade/utilsdebounce, throttle, cx, clamp@chalidade/tokensDesign tokens and CSS variables, with dark mode@chalidade/react-hooksSSR-safe hooks
$ pnpm add @chalidade/react-hooks
import { useDebouncedValue } from "@chalidade/react-hooks";
const query = useDebouncedValue(input, 300);Start with stage 01 today.
Sign in with GitHub or Google to save your progress, notes, and code.