# Web development resources

> Web development resources. roadmap.sh and the Awesome lists, React frameworks and component libraries, forms and charts, auth, testing, diagrams, video, and self-hosted apps worth knowing.

Source: https://ali.id.au/practices/building/web-development/ (last edited 2026-10-12)

## Learning paths and references

* [roadmap.sh](https://roadmap.sh/) - developer learning paths and skill trees
* [HTML Living Standard](https://html.spec.whatwg.org/) - the WHATWG spec
* [Markdown and LaTeX introduction](https://ashki23.github.io/markdown-latex.html)

## Awesome lists

* [The Awesome Lists](https://github.com/sindresorhus/awesome)
  * [Awesome .NET](https://github.com/quozd/awesome-dotnet)
  * [Awesome React](https://github.com/enaqx/awesome-react?tab=readme-ov-file#react-component-libraries) and [Awesome React Components](https://github.com/brillout/awesome-react-components)
  * [Awesome CSV](https://github.com/secretGeek/AwesomeCSV) and [Awesome JSON](https://github.com/burningtree/awesome-json)

## Frameworks and components

* [TanStack](https://tanstack.com/) - utilities for React (tables, queries, forms and more)
* [AdonisJS](https://adonisjs.com/) - Laravel-style framework for Node
* [v0 by Vercel](https://v0.app/) - React UI from a prompt
* [shadcn/ui](https://ui.shadcn.com/)
* [MUI](https://mui.com/) - Material UI for React
* [Aceternity UI](https://ui.aceternity.com/) - React component library
* [Kendo React UI](https://www.telerik.com/kendo-react-ui)
* Forms: [RJSF (React JSON Schema Form)](https://rjsf-team.github.io/react-jsonschema-form/docs/), [formik](https://formik.org/), [Liform](https://limenius.github.io/liform-react/) and [alternatives](https://github.com/brillout/awesome-react-components?tab=readme-ov-file#form-logic)
* Charts: [Chart.js](https://www.chartjs.org/), [Recharts](https://recharts.github.io/) and [d3 discovery](https://d3-discovery.net/)
* Video: [Remotion](https://www.remotion.dev/) (video in React) and [Diffusion Studio](https://diffusion.studio/) (editing in the browser)

## Tools

* [Mermaid](https://mermaid.js.org/) - diagrams from text
* [Cypress](https://www.cypress.io/) - end-to-end testing
* [Better Auth](https://better-auth.com/) - auth library for TypeScript
* [Make](https://www.make.com/) - no-code automation across SaaS apps (ex Integromat)
* [Censys Search](https://search.censys.io/) - what's exposed on the internet

## Self-hosted apps

* [BookStack](https://www.bookstackapp.com/) - wiki and documentation
* [Grist](https://www.getgrist.com/) - spreadsheet database
* [authentik](https://goauthentik.io/) - identity provider (an open Okta)

See also: [Development + SPFx](/platforms/m365-sharepoint/development/) for Fluent UI and PnP controls, [DevOps & automation](/practices/building/devops-automation/) for CI/CD and monitoring, and [UI design](/practices/building/ui-design/) for design tools.