Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

awesome-web-dev-resources

👌 My collection of go-to web development resources
https://github.com/mrmartineau/awesome-web-dev-resources

Last synced: 3 days ago
JSON representation

Really useful tools
- Transform.tools - to-typescript) to convert JSON to TypeScript interfaces
- JSON Editor Online
- Epoch Convert
- CopyChar
- Tiny Helpers - purpose online tools for web developers...
- Whitespaces
- CSS2JS - in-JS](https://marketplace.visualstudio.com/items?itemName=paulmolluzzo.convert-css-in-js)https://marketplace.visualstudio.com/items?itemName=paulmolluzzo.convert-css-in-js
- Smooth Shadow
- Crontab.guru
- Key.js
- Glob tester
- HTML De-crapulator
- px-rem-em converter
- Squoosh
- Unicode code converter
- svgomg
- URL-encoder for SVG
- JSON Editor Online
📦 Finding and vetting npm packages
- Snyk
- runpkg
- CSS Tricks "Complete Guide to Flexbox"
- CSS Tricks "Complete Guide to Grid"
- Cubic bezier curve creator
- Ceaser
- CSS Triggers
- Fluid-responsive font-size calculator
- Browserhacks
- modern-css-reset - bones CSS reset for modern web development
- CSSFX - to-copy CSS effects
- Shape Divider App
- Snyk
- CSSFX - to-copy CSS effects
- emma
- npmvet
- Bundlephobia
- npms
- pika
- Absolute centering
CSS-in-JS
- Stitches - in-JS with near-zero runtime
- vanilla-extract - runtime Stylesheets-in-TypeScript
- Styled Components - in-JS for React
- Emotion - in-JS library
- goober - in-js solution
- Polished
- xstyled - components 💅
- Theme UI - based design principles
Useful JS links
- JS module import/export syntax
- JavaScript Event KeyCodes
- JavaScript Visualizer
- Does it mutate?
- jsPerf
- HTML DOM
- JavaScript Event KeyCodes
- HTML DOM
Framework agnostic packages
- General utilities
  - Lodash
  - tradeoffs document
  - evt
  - length.js
  - action-outside
  - compute-scroll-into-view
  - words
  - clack
  - clack-react
  - cuid - resistant ids optimized for horizontal scaling and performance
  - xstate
- Node
  - Express
  - nodebestpractices
- Media and Images
  - IMGIX - time image processing and image CDN
  - IMGIX - time image processing and image CDN
- Date
  - date-fns
- Carousels
  - Flickity
  - Swiper
- Animation
  - GSAP
  - Vanilla-tilt.js
- Immutable
  - immer
⚛️ React
- Polyfills
  - reactjs.org
- React-specific libs:
  - react-router
  - Reach Router
  - react-fns
  - downshift
  - swr
  - Hooks.Guide
  - useHooks
  - beautiful-react-hooks - up your components and hooks development 🔥
  - Rooks
  - downshift
  - Hooks.Guide
  - react-fns
  - Hooks.Guide
  - formik
  - Framer Motion - ready animations. Design fluid animations for the web, across desktop and mobile
- State management
- Server-rendered React
  - Next.js - Framework for server-rendered or statically-exported React apps
Static site generators
- Server-rendered React
  - Gatsby
  - Eleventy
Microservices/Serverless
- Server-rendered React
  - micro
TypeScript
- Server-rendered React
  - typescriptlang.org
  - What's new in TypeScript
  - TypeScript Deep Dive
  - TypeScript Evolution
  - JSON to Typescript Interface
  - react-typescript-cheatsheet
  - Fish shell - friendly command line shell
  - awesome-fish
  - Starship - Shell Prompt
  - TypeScript Deep Dive
  - react-typescript-cheatsheet
CLI apps
- Server-rendered React
  - serve
  - awesome-cli-apps
Code bundlers
- Server-rendered React
  - Vite
  - esbuild
  - Webpack
  - Parcel
  - rollup.js
  - ncc - style.
Package management and publishing
- Server-rendered React
  - Dependabot - to-date
  - npm-config
Commit hooks
- Server-rendered React
  - lefthook
  - lint-staged: 🚫💩
  - Cypress - to-end testing
  - dom-testing-library
  - react-testing-library
  - faker.js
  - Stryker Mutator
  - react-testing-library
  - Jest
Code formatting and linting
- Server-rendered React
Miscellaneous
- Server-rendered React
  - Workbox
  - CodeSandbox
  - CodeShare
  - Glitch
  - Postman
  - jsonbin
  - test-cors.org
  - Reqres - API ready to respond to your AJAX requests
  - Mirage JS
  - Postwoman
  - Codepen - React front-end demos and prototypes
GraphQL
- Server-rendered React
Icons
- Server-rendered React
SVG/Image Media compression
- Server-rendered React
Performance testing and monitoring
- Server-rendered React
A11y tools and resources:
- Server-rendered React
  - Interactive WCAG
  - awesome-a11y - related resources & information
  - tenon.io
  - a11yproject.com/checklist.html
  - a11yproject.com
  - allyjs.io
  - Four principles of Accessibility
  - Aria landmarks example
  - A11y Style-guide
  - Inclusive Components
  - Practical ARIA Examples
  - Web Accessibility Tutorials
  - Color contrast checker
- A11y Chrome extensions
  - Accessibility Insights for Web
  - Color Contrast Analyzer
  - NoCoffee - related issues
  - HTTP Status Codes
Continuous integration
- A11y Chrome extensions
  - CircleCI
  - Bitrise
  - Travis CI - source
Hosting
- A11y Chrome extensions
  - Vercel
  - Netlify
Domains
- A11y Chrome extensions
  - iwantmyname
Typography
- A11y Chrome extensions
VS Code
- A11y Chrome extensions
Programming fonts
- A11y Chrome extensions
  - IBM Plex Mono
  - Input: Fonts for Code
Code colour schemes
- A11y Chrome extensions
  - Monokai Pro
  - Ayu (Mirage)
  - Dracula
  - Oceanic Next Theme
  - Nord
  - VSCodeThemes
  - themer
  - Regex101
Uncategorized
- Uncategorized
  - DevHints
  - Badgen
  - Shields.io - flare-green.svg?style=flat-square) to your documentation/readmes
  - Git Flight Rules
  - browser-2020

Programming Languages

JavaScript 5 TypeScript 3 Shell 1

Categories

Framework agnostic packages 21 ⚛️ React 21 📦 Finding and vetting npm packages 20 Really useful tools 18 A11y tools and resources: 17 GraphQL 15 Miscellaneous 11 SVG/Image Media compression 11 TypeScript 11 Performance testing and monitoring 10 Commit hooks 9 CSS-in-JS 8 Useful JS links 8 Code colour schemes 8 Icons 6 Code bundlers 6 Uncategorized 5 Continuous integration 3 Typography 3 VS Code 3 Code formatting and linting 3 Static site generators 2 Programming fonts 2 Package management and publishing 2 CLI apps 2 Hosting 2 Domains 1 Microservices/Serverless 1

Sub Categories

Server-rendered React 103 A11y Chrome extensions 26 React-specific libs: 15 General utilities 11 Uncategorized 5 State management 4 Media and Images 2 Animation 2 Node 2 Carousels 2 Immutable 1 Polyfills 1 Date 1

Keywords

awesome 3 awesome-list 3 cli 3 npm 2 list 2 cli-app 1 algolia 1 url-encoder 1 svg 1 vscode-theme 1 vscode-extension 1 vscode 1 visualstudio 1 visual-studio-code-theme 1 visual-studio-code-extension 1 visual-studio-code 1 visual-studio 1 wcag 1 wai-aria 1 assistive-technology 1 accessibility 1 a11y 1 redux 1 devarchy 1 render-props 1 react-native 1 react-hooks 1 react 1 hooks 1 higher-order-component 1 forms 1 formik 1 form 1 vet 1 versions 1 version 1 packages 1 package 1 ci-automation 1 ci 1 checking 1 checker 1 yarn 1 terminal 1