ESLint and Prettier
You've felt the pull-request comment that says "missing semicolon" and the other one that says "this == should be ===." One of those is a waste of everyone's time and one of those is a real bug. This guide draws the line between the two: Prettier formats your code so nobody argues about whitespace again, and ESLint hunts the patterns that actually break things. Set them up once and your team stops bikeshedding for good.
How to read this
Read it in order the first time. Phase 1 builds the mental model of two tools with two different jobs, because almost every painful ESLint+Prettier setup comes from confusing those jobs. Phase 2 is the day-to-day: configs, autofix, the commands you'll actually run. Phase 3 is enforcement and the gotchas that bite real teams. If you already have a working setup and only want it to stop fighting itself, skim Phase 1 then go straight to Phase 3.
The phases
- Two tools, two jobs - the mental model: formatting versus linting, and why they're separate.
- Config and autofix - how you really use them: config files, fixing on save, the everyday commands.
- Enforcement and gotchas - editor, pre-commit, CI, and the conflicts that waste an afternoon.