Practical guides for studying real-world frontends
Short, focused walkthroughs for the most common 'how do I figure out X' questions developers ask about sites they're reverse-engineering, auditing or just curious about. Every guide names the DevTools-only way, then shows how Sourcemap Explorer automates it.
How these guides work
Each guide takes one concrete question — which framework is this, what CMS is behind it, which WordPress plugins load, what exact version of an npm package ships — and answers it using only what your browser already downloaded when the page loaded. No crawler, no backend, no account.
The structure is always the same: the manual path in Chrome DevTools first, so you understand the signal you're reading, then the one-click version with the extension. That order is deliberate — once you know why a source path or a ?ver= string is the tell, the automated result is something you can trust and explain, not a black box.
How to detect the framework a website is built with
Three reliable ways to tell what JavaScript framework any website is using — from DevTools heuristics to browser extensions to sourcemap-level proof.
How to download JavaScript sourcemaps from a website
Every production sourcemap a site serves is a folder of its original source code. Here's how to find them, download them, and put them back into a readable project tree.
How to reconstruct original source code from a sourcemap
A sourcemap's `sources` and `sourcesContent` fields contain everything needed to rebuild the original project tree. Here's the logic, the gotchas, and a ready-made way to skip the work.
How to find every WordPress plugin a site is using
WordPress plugin slugs are loaded from predictable `/wp-content/plugins/<slug>/` paths — which makes enumeration trivial if you know where to look. Here's the full method.
How to identify the theme a WordPress site is using
The active theme lives under /wp-content/themes/<slug>/. Here's how to find the slug, map it to a theme name, and confirm via style.css.
How to check if a website is built with Next.js
Next.js leaves fingerprints everywhere: `#__next`, `__NEXT_DATA__`, `_next/static/` URLs, `x-nextjs-*` headers. Here's a 60-second sweep and how to get the exact version.
How to find the exact version of an npm package used by a site
Regex-based detectors usually give you 'React' — not 'React 18.2.0'. If sourcemaps are available, the exact semver is one step away.
How to detect Tailwind CSS on a website
Tailwind's class naming is unmistakable once you know the patterns. Here's how to spot it in seconds — and confirm the version.
How to identify the CMS behind any website
WordPress, Drupal, Shopify, Magento, Webflow, Ghost — every CMS leaves fingerprints. Here's a practical checklist.
How to see every JavaScript library a website uses
Most detectors only show libraries they have a rule for. To catch the long tail, you need to read the site's sourcemap.
How to extract package.json files from a sourcemap
Every embedded package.json inside a sourcemap is a named, versioned, fully resolved dependency. Here's how to pull them all out.
FAQ
Do these guides require the Sourcemap Explorer extension?
No. Every guide documents the manual, DevTools-only method first — the exact Network filter, header or source path to look for — so you can follow it with nothing installed. The extension just automates those steps and reads embedded versions in one click.
Is it OK to inspect a site this way?
These techniques read assets the site already served to your browser — scripts, styles, source maps and response headers a normal page load fetches. It's client-side inspection of resources that are publicly delivered, the same data DevTools shows. It doesn't bypass authentication or access anything the server didn't hand out.
What if a site doesn't ship source maps?
Most guides still work: framework, CMS and plugin detection lean on headers, asset-URL patterns and DOM markers, not just maps. Source maps simply make the answer exact — the precise file tree and version. When no map is shipped, Sourcemap Explorer can also decompile the bundled JSX to reconstruct component structure.