A curated list of awesome web development resources, libraries, and tools.
- Introduction
- General Resources
- Roadmaps
- Cheatsheet
- Interview Questions
- HTML
- CSS
- Icons
- Online Compilers & IDE
- Preprocessors
- Frameworks
- JavaScript
- Languages & Frameworks
- Testing
- Frontend Frameworks
- Backend Frameworks
- Static Site Generators
- APIs
- Databases
- Performance Optimization
- Web Components
- CSS in Js Libraries
- Package Managers
- Version Control
- Static Analysis
- Performance
- Web Security
- Testing
- Web Assembly
- Progressive Web Apps
- Hosting
- Learning Platforms
- Contributing
- License
Welcome to the awesome web development resources list! This repository aims to provide a comprehensive collection of web development resources, tutorials, tools, and libraries to help developers build amazing web applications.
- MDN Web Docs
- W3Schools
- freeCodeCamp - Free course to learn Web Development.
- Codecademy
- Coursera
- Udemy
- Khan Academy
- Interneting Is Hard - Friendly web development tutorials for complete beginners.
- Learn to Code - The guide covers a variety of web design and development topics, ranging from beginner to advanced skill levels.
- Can I Use - Up-to-date browser support tables for support of front-end web technologies on desktop and mobile web browsers.
- DevProjects - Practice your coding skills with free HTML/CSS projects. Projects vary from beginner to advanced level.
- WebPlatform - A discontinued but valuable resource for web developers.
- Smashing Magazine - An online magazine for professional web designers and developers.
- Frontend - Frontend Development Roadmap.
- Backend - Backend Development Roadmap.
- React - React Development Roadmap.
- Andriod - Android Development Roadmap.
- DevOps - DevOps Roadmap.
- Full Stack - Full Stack Development Roadmap.
- Node.js - Node.js Development Roadmap.
- Design System - Design System Roadmap.
- HTML Cheat Sheet - A Complete HTML Cheat Sheet to help you master HTML.
- CSS Cheat Sheet - Brush up on your CSS Skills with this comprehensive Cheat Sheet.
- JavaScript Cheat Sheet- A Complete JavaScript Cheat Sheet to help you master JavaScript.
- React Cheat Sheet - Quick reference for React.
- Vue Cheat Sheet - Quick reference for Vue.js.
- Git Cheat Sheet - Git commands cheat sheet by GitHub Education.
- HTML and HTML5 Interview Questions - A Complete list of HTML Interview Questions to help you ace your interview.
- JavaScript Interview Questions - A Complete list of top JavaScript Interview Questions to help you ace your interview.
- CSS Interview Questions - Commonly asked CSS Interview Questions.
- React Interview Questions - A collection of React Interview Questions.
- Node.js Interview Questions - Key Node.js Interview Questions.
- Full Stack Interview Questions - Full Stack Development Interview Questions.
- HTML5 Specification
- HTML Living Standard
- HTML Dog - HTML tutorials and reference.
- HTML Elements - HTML elements reference by MDN.
- HTML Entity - HTML Entity Reference by CSS-Tricks.
- HTML Shark - Smart moves and dirty tricks for coding websites, effects and elements in HTML.
- ReadyTools HTML Structure Generator - Generate HTML Structures in seconds.
- CSS-Tricks
- Sass
- Bootstrap
- CSS3 Properties - CSS reference by MDN.
- CSS Reference - A free visual guide to CSS.
- CSS Layout - A collection of popular layouts and patterns made with CSS.
- Modern CSS Solutions - A series examining modern CSS solutions to problems.
- CSS Diner - A fun game to help you learn and practice CSS selectors.
- Flexbox Froggy - A game that helps you to learn CSS Flex.
- CSS TRICKS - Flexbox - A Complete Guide to Flexbox.
- Grid by Example - Everything you need to learn CSS Grid Layout.
- Grid Garden - A game for learning CSS Grid.
- CSS TRICKS - A Complete Guide to Grid - A comprehensive guide to CSS grid, focusing on all the settings both for the grid parent container and the grid child elements.
- Learn CSS Grid - A comprehensive guide to help you understand and learn CSS Grid Layout, by Jonathan Suh.
- CSS Effects - CSS animations.
- UI Snippets - Even more CSS animations.
- Keyframes - Create basic or complex CSS @keyframe animations with a visual timeline editor.
- Animista - Play with a collection of ready to use CSS animations.
- Autoprefixer - Autoprefixer is a PostCSS plugin which parses your CSS and adds vendor prefixes.
- CSS Formatter - Online CSS Formatter, CSS Beautifier.
- Codrops - Creative front-end resources and inspiration.
- Ionicons - Open-Sourced and MIT licensed icon pack.
- Font Awesome - Vector icons and social logos.
- Material Icons - Material icons are delightful, beautifully crafted symbols for common actions and items. Download on desktop to use them in your digital products for Android, iOS, and web.
- Icones - Icons collection.
- icons8 - Download free icons in PNG and SVG.
- flaticon - Free vector icons in SVG, PSD, PNG, EPS format or as ICON FONT.
- Tabler Icons - Fully customizable free SVG icons.
- icofont - 2100+ free icons to spice up your creative designs.
- Simple Icons - 1463 Free SVG icons for popular brands.
- Get Emoji - ✂️ Copy and 📋 Paste Emoji 👍.
- Ikonate - Customizable icons pack.
- useAnimations - Free animated icons.
- 3dicons - A collection of over 5000 3D icons and characters with 4k resolution, each icon delivered in 5 color palettes, front and perspective views.
- Iconshock - The biggest icon pack with over 2 million professional icons in +400 icon sets with more than 30 design styles: material, flat, 3d, realistic, iOS, and more.
- Bootstrap Icons - Official open source SVG icon library for Bootstrap.
- Fontisto Icons - Fontisto is an extensive collection of web icons for web designers and developers.
- CodeVania
- Repl.it
- CodeSandbox
- CodePen
- JS Bin
- JSFiddle
- goormIDE
- InterviewBit
- CodiLink
- Glitch
- playcode - Playground for Javascript, HTML and CSS.
- Liveweave - HTML, CSS & JavaScript playground.
- Codeanywhere - Cloud IDE.
- Sass - The most mature, stable, and powerful professional grade CSS extension language.
- LESS - Backward compatible with CSS. Need only to download and include a single JavaScript file.
- Stylus - Expressive, dynamic, robust CSS.
- PostCSS - A tool for transforming CSS with JavaScript plugins.
- Bootstrap - CSS framework directed at responsive, mobile-first front-end web development.
- Foundation - Responsive front-end framework.
- Bulma - A modern CSS framework based on Flexbox.
- Tailwind CSS - A utility-first CSS framework for rapidly building custom user interfaces.
- Semantic UI - A development framework that helps create beautiful, responsive layouts using human-friendly HTML.
- Pure CSS - A set of small, responsive CSS modules.
- Materialize - A modern responsive front-end framework based on Material Design.
- Spectre.css - A lightweight, responsive, and modern CSS framework.
- Pico.css - A minimalist CSS framework for semantic HTML.
- JavaScript Info
- Eloquent JavaScript
- You Don't Know JS
- JavaScript: The Good Parts
- Codecademy - Free course to learn JavaScript interactively.
- JavaScript.info - Modern JavaScript Tutorial.
- JavaScripture - JavaScripture.com is a testing ground and reference for all JavaScript APIs.
- Eloquent JavaScript - This is a book about JavaScript, programming, and the wonders of the digital. You can read it online here.
- JavaScript30 - 30 days vanilla JS coding challenge. Build 30 things in 30 days with 30 tutorials.
- How JavaScript works
- JavaScript Reference By MDN
- JavaScript Event Reference
- JavaScript Tutorial - Learn important concepts in JavaScript such as operators, loops, functions, OOPs, and much more.
- DOM Manipulation Reference
- JavaScript Design Patterns
- RegexOne - Learn Regular Expressions with simple, interactive exercises.
- Scaler - Best Free Resources to learn JavaScript by top geeks.
- JavaScript For Cats - An introduction for new programmers.
- Mozilla Developer Network JavaScript
- Learn JavaScript - Learn JavaScript for free.
- JavaScript Garden - A growing collection of documentation about the most quirky parts of JavaScript.
- Airbnb JavaScript Style Guide - A mostly reasonable approach to JavaScript.
- TypeScript Handbook - A comprehensive guide to TypeScript by Microsoft.
- TypeScript Deep Dive - A book that dives deep into TypeScript.
- React Official Site
- React Documentation - The official React documentation.
- Awesome React - A collection of awesome things regarding React ecosystem.
- Vue.js Official Site
- Vue.js Documentation
- Awesome Vue.js - A curated list of awesome things related to Vue.js.
- Angular Official Site
- Angular Documentation
- Awesome Angular - A curated list of awesome things related to Angular.
- Node.js Official Site
- Node.js Documentation
- Awesome Node.js - A curated list of delightful Node.js packages and resources.
- Express.js Official Site
- Express.js Documentation
- Awesome Express - A curated list of awesome things related to Express.js.
- Django Official Site
- Django Documentation
- Awesome Django - A curated list of awesome things related to Django.
- Flask Official Site
- Flask Documentation
- Awesome Flask - A curated list of awesome things related to Flask.
- Ruby on Rails Official Site
- Ruby on Rails Documentation
- Awesome Rails - A curated list of awesome things related to Ruby on Rails.
- React
- Vue.js
- Angular
- Svelte - Cybernetically enhanced web apps.
- Preact - Fast 3kB alternative to React with the same modern API.
- Alpine.js - A rugged, minimal framework for composing JavaScript behavior in your HTML.
- Lit - Simple. Fast. Web Components.
- Ember.js - A framework for ambitious web developers.
- Backbone.js - Gives structure to web applications by providing models with key-value binding and custom events.
- Express
- Django
- Flask
- Ruby on Rails
- Spring
- ASP.NET
- Laravel
- Koa
- NestJS - A progressive Node.js framework for building efficient and scalable server-side applications.
- Phoenix - A productive web framework that does not compromise speed and maintainability.
- Gatsby
- Jekyll
- Hugo
- Next.js
- Nuxt.js
- Eleventy
- Hexo
- Docusaurus - Easy to maintain open source documentation websites.
- Sapper - The Next.js of Svelte.
- Gridsome - Vue-powered static site generator.
- RESTful API - An architectural style for an application program interface (API) that uses HTTP requests to access and use data.
- GraphQL - A data query language developed by Facebook as an alternative to REST.
- Postman - A collaboration platform for API development.
- Swagger - Simplify API development for users, teams, and enterprises with the Swagger open source and professional toolset.
- RapidAPI - Find and connect to thousands of APIs.
- Lighthouse - Improve the quality of your web apps.
- Webpack - A static module bundler for modern JavaScript applications.
- Rollup - A module bundler for JavaScript.
- Parcel - A zero-configuration build tool for the web.
- Gulp
- Grunt
- Web Components - A set of web platform APIs that allow you to create new custom, reusable, encapsulated HTML tags to use in web pages and web apps.
- Stencil - A toolchain for building reusable, scalable Design Systems.
- Polymer - Reusable components for the modern web.
- Lit - Simple. Fast. Web Components.
- styled-components
- Emotion
- JSS
- Linaria - Zero-runtime CSS in JS library.
- Stitches - CSS-in-JS with near-zero runtime, SSR, multi-variant support, and a best-in-class developer experience.
- npm
- Yarn
- pnpm - Fast, disk space efficient package manager.
- Composer - Dependency Manager for PHP.
- Homebrew - The Missing Package Manager for macOS (or Linux).
- GitHub Actions - Automate your workflow from idea to production.
- CircleCI - Automate your development process quickly, safely, and at scale.
- Travis CI - Test and Deploy Your Code with Confidence.
- Jenkins - The leading open source automation server.
- GitLab CI - Continuous Integration, Continuous Delivery, and Continuous Deployment.
- Bitbucket Pipelines - Integrated CI/CD for Bitbucket Cloud that's trivial to set up, automating your code from test to production.
- ESLint - Find and fix problems in your JavaScript code.
- Stylelint - A mighty, modern linter that helps you avoid errors and enforce conventions in your styles.
- Prettier - An opinionated code formatter.
- SonarQube
- Dependabot
- OWASP - Open Web Application Security Project is a nonprofit foundation that works to improve the security of software.
- Snyk - Continuously find and fix vulnerabilities.
- Helmet - Help secure Express apps with various HTTP headers.
- Content Security Policy - Prevents a wide range of attacks, including Cross-Site Scripting (XSS) and data injection attacks.
- Jest - Delightful JavaScript Testing Framework with a focus on simplicity.
- Mocha - Simple, flexible, fun JavaScript test framework.
- Chai - BDD / TDD assertion framework for node.js and the browser that can be paired with any JavaScript testing framework.
- Cypress - Fast, easy and reliable testing for anything that runs in a browser.
- Selenium - Browser automation tool for testing web applications.
- Puppeteer - Headless Chrome Node.js API by Google.
- Testing Library - Simple and complete testing utilities that encourage good testing practices.
- WebAssembly - WebAssembly (abbreviated Wasm) is a binary instruction format for a stack-based virtual machine.
- Emscripten - Emscripten compiles C/C++ code to WebAssembly (or JavaScript).
- AssemblyScript - A TypeScript-to-WebAssembly compiler.
- PWA Overview
- Workbox - JavaScript libraries for adding offline capabilities to web apps.
- Digital Ocean - A cheap web Hosting Platform.
- AWS - Amazon Web Services offers reliable, scalable, and inexpensive cloud computing services.
- Google Cloud - Google Cloud Platform lets you build, deploy, and scale applications, websites, and services.
- Azure - Microsoft Azure is an ever-expanding set of cloud services to help your organization meet your business challenges.
- Netlify - All-in-one platform for automating modern web projects.
- Vercel - Deploy web projects with the best frontend developer experience and highest end-user performance.
- Heroku - Platform as a service (PaaS) that enables developers to build, run, and operate applications entirely in the cloud.
- Coolify - A Open-Source Cheap Alternative to Web hosting.
- freeCodeCamp
- Codecademy
- Coursera
- Udemy
- Khan Academy
- Pluralsight
- edX
- Pluralsight
- Frontend Masters
- Egghead.io
- Treehouse
Contributions are welcome! Please read the contributing guidelines first.
This project is licensed under the CC0 1.0 Universal (CC0 1.0) Public Domain Dedication - see the LICENSE file for details.