# Installation & Project Setup — ESLint and Prettier: Code Quality and Formatting

Source: https://www.skillbyai.com/en/eslint-prettier/eslint-prettier-02

> Install ESLint and Prettier with npm and generate a starter configuration with the ESLint init wizard.

## Getting started

Start by installing both tools via npm. ESLint provides the foundation for linting, while Prettier handles formatting separately.

## Try installation

Install both tools and initialize ESLint configuration.

```bash
npm install --save-dev eslint prettier
npm init @eslint/config@latest
```

Output:

```
✔ How would you like to use ESLint?
✔ What type of modules does your project use?
✔ Which framework does your project use?
✔ Does your project use TypeScript?
✔ Where does your code run?
✔ What format do you prefer for your config file?
Successfully created .eslintrc.json
```

## Common setup issue

Don't skip the configuration step. Run `npm init @eslint/config@latest` to answer setup questions and generate `eslint.config.js` automatically.

Quick check

**Quiz:** What does `npm init @eslint/config` do?

- [x] Asks setup questions and creates a config file
- [ ] Only installs Prettier
- [ ] Deletes node_modules
- [ ] Runs your tests

*Answer:* Asks setup questions and creates a config file. It scaffolds an ESLint configuration.