> For the complete documentation index, see [llms.txt](https://cansahin.gitbook.io/react-boilerplate-cra-template/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://cansahin.gitbook.io/react-boilerplate-cra-template/tools/editors.md).

# Editor Configuration

You can edit React Boilerplate using any editor or IDE, but there are a few extra steps that you can take to make sure your coding experience is as good as it can be.

## VS Code

We provide a `.vscode` folder out-of-the-box which includes the **recommended extensions**, **debugger configuration**, and **settings**

They are highly suggested for the best Developer Experience. Extensions are responsible for:

* [Eslint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)
* [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)
* [Styled Components](https://marketplace.visualstudio.com/items?itemName=styled-components.vscode-styled-components)
* [Jest](https://marketplace.visualstudio.com/items?itemName=Orta.vscode-jest)

These are the basic building blocks in the boilerplate.

## Chrome Extensions

For a better debugging and development experience we suggest [Redux DevTools](https://chrome.google.com/webstore/detail/redux-devtools/lmhkpmbekcpmknklioeibfkpmmfibljd?hl=en). In the boilerplate, Redux is configured with this extension in mind so that you can debug and monitor your state changes very easily.