Web Foundations
Build a complete mental model of structure, styling, and browser behavior.
- HTML and accessibility
- CSS layout and responsive design
- JavaScript fundamentals
Learning direction
Frontend Development
Start with semantic pages and interaction fundamentals, then ship fast, usable product interfaces.
Skill map
From foundations to real delivery
Engineering
Use types, components, and data flow to maintain complex interfaces.
- TypeScript
- React and state management
- Requests, caching, and error states
Product Quality
Go beyond making it work: make it good on real devices.
- Performance and Core Web Vitals
- Testing and debugging
- Design systems
Delivery and Portfolio
Explain the requirement, implementation, and iteration clearly.
- Deployment and domains
- Project storytelling
- Open-source issues and PRs
Put the skills to work
Recommended learning and practice items
View all in this direction →CompetitionAI · Frontend · BackendIntermediateDue Oct 15, 2026
2026 AIC AI + Open Source Challenge
A global student challenge for runnable AI applications, developer tools, or verifiable contributions built with open-source software, models, and data.
Global Campus AI Algorithm Elite Competition Organizing CommitteeCN¥500.00Global
Open sourceFrontendIntermediate
Next.js
Official repository for the React full-stack framework, with documentation, tests, and contribution issues.
VercelAbout 2 hrreacttypescript
Open sourceFrontendIntermediate
React
Official React repository for learning modern UI internals through docs, tests, and issue discussions.
MetaAbout 2 hrjavascriptreact
Open sourceFrontendIntermediate
Svelte
Official repository for Svelte, including its compiler, runtime, and extensive test suite.
SvelteAbout 2 hrsveltejavascript
Open sourceFrontendBeginner
Tailwind CSS
Official utility-first CSS framework repository, approachable through docs, reproductions, and small fixes.
Tailwind LabsAbout 2 hrcsstooling
Open sourceFrontendAdvanced
TypeScript
Official TypeScript language and compiler repository for studying type systems and compiler engineering.
MicrosoftAbout 2 hrtypescriptcompiler
Open sourceFrontendIntermediate
Vite
Official modern frontend tooling repository for learning module resolution, dev servers, and plugins.
ViteAbout 2 hrjavascripttooling
Open sourceFrontendIntermediate
Vue Core
Vue core implementation for studying reactivity, compilers, and TypeScript engineering.
Vue.jsAbout 2 hrvuetypescript