A Practical Coding Resource List for People Who Are Not Engineers

Most coding resource lists are written for people who want to become developers. This one is for people who want to build things without becoming developers full-time. Designers, ops people, marketers, founders, anyone who needs to ship functional work and isn't starting from zero but isn't deeply technical either.

These are organized by what you are trying to do, not by technology.

If you want to understand how the web works

MDN Web Docs — developer.mozilla.org (opens in a new tab)

The most reliable reference on the internet for HTML, CSS, and JavaScript. Not a course. A reference. When you encounter something you don't understand, this is the first place to check before anything else.

The Odin Project — theodinproject.com (opens in a new tab)

A free, structured curriculum that takes you from zero to building real projects. It does not hold your hand through every step, which is intentional. The friction is the learning.

web.dev — web.dev (opens in a new tab)

Run by Google's Chrome team. Strong on performance, accessibility, and modern web practices. More useful once you have a foundation than as a starting point.

If you want to build with React or a modern frontend stack

React official docs — react.dev (opens in a new tab)

Rewritten in 2023. Actually good now. Start with the Quick Start and Thinking in React sections before anything else.

Josh W Comeau's blog — joshwcomeau.com (opens in a new tab)

The best writing on CSS and React for people who care about the visual side of frontend.

Vite docs — vitejs.dev (opens in a new tab)

If you are building with React and not using Vite yet, you probably should be.

If you want to ship a real project quickly

Astro — docs.astro.build (opens in a new tab)

Content-focused sites, portfolios, marketing pages. Astro is the right tool and the documentation is some of the best in the ecosystem.

Vercel — vercel.com/docs (opens in a new tab)

Deployment, previews, serverless functions. If you are not deploying here already, start.

Supabase — supabase.com/docs (opens in a new tab)

Database, auth, and storage with a generous free tier and a dashboard that does not require SQL fluency to use.

If you want AI to help you code without losing your own understanding

Cursor — cursor.com (opens in a new tab)

A code editor built around AI assistance. The chat sidebar lets you ask questions about your own code, which is useful for understanding what you have built before shipping it.

v0 by Vercel — v0.dev (opens in a new tab)

Describe a UI component, get working React and Tailwind code back. Treat the output as a starting point, not a final answer.

Phind — phind.com (opens in a new tab)

A search engine built for coding questions. Faster than Stack Overflow for specific syntax questions.

If you want to understand a specific language or concept quickly

roadmap.sh — roadmap.sh (opens in a new tab)

Visual learning paths for frontend, backend, DevOps, and more.

Fireship on YouTube — youtube.com/@Fireship (opens in a new tab)

100-second explainers on technologies, frameworks, and concepts.

CSS Tricks — css-tricks.com (opens in a new tab)

The archive is enormous and still useful. The Flexbox and Grid guides are the best visual explanations of those layout systems that exist.

One practice worth more than any resource

Read code that other people wrote. Not to copy it. To understand how someone else solved a problem you have encountered. GitHub is full of open source projects. Find ones at a complexity level slightly above your current work and read the source.

Most people who get stuck do so because they only ever read documentation and never read working code. Documentation tells you what is possible. Code shows you what was actually done.

No single resource makes you a better builder. Using them to ship real things does.