The best platform for practicing frontend system design and preparing for frontend interviews.

The definitive guide to Flexbox. Bookmark this - you

Curated list of free APIs. The best resource for finding APIs.

A collection of beautifully designed, accessible, and unstyled React components built with Radix UI and Tailwind CSS, meant to be copied into your codebase

An ultimate, in-depth course and community for mastering modern TypeScript. Great for all skill levels.

Interactive game to learn CSS Grid. Write CSS code to grow your carrot garden and master grid layout.

Tower defense game that teaches Flexbox. Position your towers using CSS Flexbox properties to stop enemies.

Free online resource on design, rendering, and performance patterns for building powerful web apps. Covers JavaScript, React, Vue, and performance optimization patterns.

Free SVG illustrations for commercial and personal use under CC0 license. No attribution required. Perfect for websites and projects.

A utility-first CSS framework for rapidly building custom designs. A must-have for modern CSS architecture.

The essential book series for a deep understanding of JavaScript's core mechanics (scopes, closures, 'this', async).

The official documentation for GraphQL, a query language for your APIs and a runtime for fulfilling those queries.

A small, fast, and scalable bearbones state-management solution for React. A popular alternative to Redux.

The industry-standard collaborative interface design tool. Essential for developers to inspect designs and export assets.

Official documentation for Chrome's built-in web developer tools. Essential for debugging, profiling, and auditing.

Excellent article explaining responsive images with practical examples. Essential for modern web development.

Framework for creating responsive emails that work across all email clients. Saves hours of email debugging.

Free comprehensive course by Wes Bos. The best way to master CSS Grid.

Block Element Modifier methodology. The most popular CSS naming convention for maintainable stylesheets.

Scalable and Modular Architecture for CSS. Essential reading for organizing large CSS codebases.

Methodology for creating design systems. Changed how we think about component architecture.

Transform CSS with JavaScript plugins. Powers modern CSS tooling (Autoprefixer, Tailwind, etc.).

Essential browser compatibility checker. Check feature support before using any CSS property.

Interactive game to learn Flexbox. Makes learning fun and memorable.

The best CSS resource on the web. Articles, guides, and snippets for everything CSS.

Visual reference for CSS easing functions. Perfect for smooth animations.

Interactive tool for creating custom cubic-bezier transitions. Essential for fine-tuning animations.

Popular CSS animation library. Great for quick prototypes and learning animation techniques.

Best color palette generator. Press spacebar to generate beautiful color schemes.

Collection of official brand color palettes. Useful for client work.

Amazing collection of pure CSS background patterns. Great for inspiration.

Interactive CSS playground by Lea Verou. Perfect for quick experiments.

Online SASS/SCSS compiler. Great for testing Sass code snippets.

Clear explanation of when to use em vs rem. Solves a common CSS confusion.

Well-documented CSS style guide from Airbnb. Great reference for best practices.

Collection of style guide examples. Inspiration for creating your own.

The best free book for learning JavaScript. Updated regularly, covers modern ES6+ features.

Free book on JavaScript design patterns. Essential for writing maintainable code.

Visual tool to understand the event loop. Essential for understanding async JavaScript.

Clear comparison of CommonJS, AMD, ES6 modules. Helps understand module evolution.

Most popular JavaScript style guide. Great reference for code consistency.

Official TypeScript documentation. The best place to learn TypeScript.

Interactive tool to explore JavaScript AST. Essential for understanding how code is parsed.

The most reliable JavaScript reference. Always up-to-date and comprehensive.

Best platform for coding interview preparation. Practice algorithms and data structures.

Fun way to practice JavaScript through coding challenges. Great for daily practice.

Practice coding exercises with mentor feedback. Excellent for learning with community support.

Official accessibility guidelines. The standard for web accessibility.

Leading resource for web accessibility. Articles, tools, and training materials.

Free browser extension to evaluate web accessibility. Essential tool for a11y testing.

Community-driven accessibility resource. Checklists, patterns, and best practices.

Official guide to implementing ARIA. Essential for accessible components.

Microsoft

Most comprehensive accessibility testing browser extension. Used by major companies.

Google

Free tool for detailed performance analysis. More detailed than PageSpeed Insights.

Built into Chrome DevTools. Automated performance, accessibility, and SEO audits.

Comprehensive guide to image optimization. Essential for fast-loading sites.

Check npm package sizes before installing. Prevents bundle bloat.

Real-world performance data. See how your site performs for real users.

The most critical web application security risks. Essential reading for all developers.

Debug and decode JWTs. Essential tool when working with authentication.

Free web security training by PortSwigger. Hands-on labs for learning security.

Guide to implementing CSP headers. Critical for preventing XSS attacks.

Google

JavaScript libraries for adding offline support. The easiest way to implement service workers.

Guide to creating app manifests. Makes your site installable.

Collection of service worker recipes. Practical examples for common patterns.

The new React docs are the best place to learn modern React. Interactive examples and clear explanations.

The React framework for production. Server-side rendering, static generation, and more out of the box.

The best data fetching library for React. Handles caching, synchronization, and updates automatically.

The standard routing library for React. Declarative and powerful.

The official, opinionated way to write Redux. Much simpler than traditional Redux.

Best form library for React. Minimal re-renders and great performance.

Essential Chrome extension for debugging React apps. Inspect component tree and state.

Collection of useful React hooks. Great for learning and reference.

Official Angular docs. Comprehensive guides and API reference.

Material Design components for Angular. Production-ready UI components.

Command-line tool for Angular. Generates code, runs tests, and builds apps.

High-quality Angular courses. Great for learning advanced patterns.

Excellent documentation. The progressive JavaScript framework that

Premium Vue.js courses. High-quality video tutorials.

The Vue.js framework for production. Similar to Next.js but for Vue.

Revolutionary framework that compiles to vanilla JS. No virtual DOM, smaller bundles.

The official Svelte framework. Full-stack app framework with SSR.

Framework for ambitious web applications. Great for large, long-lived applications.

Standards-based component model.

Components created by the community.

Framework for micro frontends.

Comprehensive guide to micro frontends.

Next-generation frontend tooling. Lightning-fast HMR and optimized production builds.

The most popular module bundler. Powerful but complex - use Vite for new projects.

Optimized for libraries. Produces smaller bundles than Webpack.

Zero-configuration bundler. Great for quick prototypes.

Next.js

The most popular JavaScript testing framework. Zero-config, great for React.

Fast unit test framework powered by Vite. Great alternative to Jest.

Simple and complete testing utilities. Encourages testing like users interact.

Modern end-to-end testing. Faster and more reliable than Cypress.

Popular E2E testing framework. Great developer experience with time-travel debugging.

Tool for building UI components in isolation. Essential for component-driven development.

The standard JavaScript linter. Catches bugs and enforces code quality.

Opinionated code formatter. Stop arguing about code style.

Linter for CSS/SCSS. Catches errors and enforces consistent styles.

ESLint rules for TypeScript. Essential for TS projects.

Official Node.js docs. Comprehensive API reference and guides.

Node Version Manager. Switch between Node versions easily.

Production process manager for Node.js. Keeps apps running forever.

Progressive Node.js framework. Great for building scalable server-side applications.

Error tracking and performance monitoring. The industry standard for error tracking.

Session replay and frontend monitoring. See exactly what users experience.

Application performance monitoring. Great for production monitoring.

The most powerful JavaScript animation library. Industry standard for web animations.

React animation library. Declarative and powerful.

Render After Effects animations on the web. Perfect for complex animations.

Comprehensive CSS animation tutorial. Great for learning fundamentals.

The most powerful JavaScript library for data visualization. Steep learning curve but unmatched flexibility.

Interactive data visualization platform. Built by D3.js creator.

Composable charting library for React. Built on D3, easier to use.

Simple yet flexible charting library. Great for common chart types.

React components for data visualization. Beautiful and accessible.

The most popular 3D library for the web. Great documentation and examples.

Excellent WebGL tutorials. Start here to understand WebGL basics.

React renderer for Three.js. Makes 3D accessible to React developers.

Powerful 3D engine. Great for games and complex 3D applications.

2D WebGL renderer. Perfect for 2D games and interactive graphics.

The best platform for Next.js and React. Zero-config deployments, great DX.

All-in-one platform for JAMstack. Great for static sites and serverless functions.

Free static site hosting. Fast global CDN included.

Free static site hosting. Perfect for documentation and portfolios.

Modern platform for deploying full-stack apps. Great developer experience.

Fake REST API for testing. Perfect for prototypes and demos.

Free API for country data. No authentication required.

Fun API for cat images. Great for testing and demos.

Official RxJS docs. Comprehensive guides and API reference.

Best resource for learning RxJS. Clear explanations and examples.

Reactive state management for Angular. Inspired by Redux but built for Angular.

Online regex tester and debugger. Essential tool for writing regex.

Comprehensive regex tutorial. The best resource for learning regex.

The JavaScript compiler. Transpiles modern JS to compatible versions.

Super-fast TypeScript/JavaScript compiler written in Rust. Used by Next.js.

Typed superset of JavaScript. Adds type safety and better tooling.

Google

Enterprise-class UI design language. Beautiful React components.

Simple, modular React component library. Great developer experience.

Unstyled, accessible component primitives. Build your own design system.

Full-featured React components library. Great defaults and customization.

Curated list of design systems. Great for inspiration.

Curated UI animations and interactions. Daily inspiration.

Compare npm package download trends. See what

Offline documentation aggregator. All your docs in one place.

Interactive GraphQL IDE. Test queries and explore schemas.

Expose localhost to the internet. Great for testing webhooks.

Secure tunnels to localhost. More reliable than LocalTunnel.

Fast, reliable package manager. Alternative to npm.

Fast, disk space efficient package manager. Uses symlinks to save space.

Better npm search. Finds packages by quality, not just popularity.

Online TypeScript editor. Test TS code instantly.

Online IDE for React, Vue, and more. Share code instantly.

Online IDE powered by WebContainers. Runs Node.js in the browser.

The official Git book. Free and comprehensive.

Interactive game to learn Git. Makes learning fun.

Interactive Git and GitHub tutorials. Learn by doing.

Specification for commit messages. Makes history readable.

High-quality free stock photos. The best free photo resource.

Free stock photos and videos. Great alternative to Unsplash.

Beautiful hand-crafted SVG icons. Made by Tailwind CSS team.

Beautiful icon library. Fork of Feather icons with more icons.

Popular icon font library. Free and paid tiers available.

Format and validate JSON. Essential for API development.

Convert between formats (JSON, YAML, TypeScript, etc.). Incredibly useful.

Badges for GitHub projects. Add status badges to your README.

Create beautiful code screenshots. Perfect for blog posts and documentation.

Free coding bootcamp. Comprehensive curriculum with certifications.

Premium video courses from industry experts. Best paid resource.

Modern JavaScript tutorial. Covers ES6+ and modern practices.

Annual survey of JavaScript ecosystem. See what

Annual CSS survey. Learn what CSS features developers use.

Comprehensive frontend interview guide. Great for job preparation.

Google's comprehensive resource for modern web development. Learn about performance, accessibility, PWA, security, and best practices. Includes guides, tools, and case studies to build fast, accessible, and engaging web experiences.

The most reliable web documentation. Always accurate and up-to-date.

Framework for building VR experiences. Works with WebXR and WebVR.

Official WebXR documentation. The future of web VR/AR.