# Prerequisites

Before you can contribute to BetterBugs Developer Utility Tools or run it locally, make sure you have these installed:

**System Requirements**

| Tool            | Version  | Download                                                                                                                                                                                                                          |
| --------------- | -------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Node.js**     | >=20.8.0 | [https://nodejs.org](vscode-file://vscode-app/c:/Users/Syed%20Fahad/AppData/Local/Programs/Microsoft%20VS%20Code/bdd88df003/resources/app/out/vs/code/electron-browser/workbench/workbench.html)                                  |
| **npm**         | >=10.0.0 | Comes with Node.js                                                                                                                                                                                                                |
| **Git**         | Latest   | [https://git-scm.com](vscode-file://vscode-app/c:/Users/Syed%20Fahad/AppData/Local/Programs/Microsoft%20VS%20Code/bdd88df003/resources/app/out/vs/code/electron-browser/workbench/workbench.html)                                 |
| **Code Editor** | Any      | We recommend VS Code: [https://code.visualstudio.com](vscode-file://vscode-app/c:/Users/Syed%20Fahad/AppData/Local/Programs/Microsoft%20VS%20Code/bdd88df003/resources/app/out/vs/code/electron-browser/workbench/workbench.html) |

Check what you have installed:

```powershell
node --version
npm --version
git --version
```

**Knowledge Requirements**

You should be familiar with:

* **React 18** — Components, hooks, state management
* **TypeScript** — Basic types and interfaces
* **Next.js 14** — App Router, file-based routing
* **Tailwind CSS** — Utility-first styling
* **Git** — Clone, commit, push, pull requests

Don't know these? Start with:

* React: [https://react.dev](vscode-file://vscode-app/c:/Users/Syed%20Fahad/AppData/Local/Programs/Microsoft%20VS%20Code/bdd88df003/resources/app/out/vs/code/electron-browser/workbench/workbench.html)
* TypeScript: [https://www.typescriptlang.org/docs/](vscode-file://vscode-app/c:/Users/Syed%20Fahad/AppData/Local/Programs/Microsoft%20VS%20Code/bdd88df003/resources/app/out/vs/code/electron-browser/workbench/workbench.html)
* Next.js: [https://nextjs.org/docs](vscode-file://vscode-app/c:/Users/Syed%20Fahad/AppData/Local/Programs/Microsoft%20VS%20Code/bdd88df003/resources/app/out/vs/code/electron-browser/workbench/workbench.html)
* Tailwind: [https://tailwindcss.com/docs](vscode-file://vscode-app/c:/Users/Syed%20Fahad/AppData/Local/Programs/Microsoft%20VS%20Code/bdd88df003/resources/app/out/vs/code/electron-browser/workbench/workbench.html)

**Project Dependencies**

All dependencies are listed in `package.json`. When you run `npm install`, these are installed automatically:

Key packages:

* **Next.js 14** — React framework
* **React 18** — UI library
* **TypeScript** — Type safety
* **Tailwind CSS** — Styling
* **Monaco Editor** — Code editing for tools
* **SASS** — CSS preprocessing
* **Ant Design** — UI components

**Environment Setup**

You don't need any `.env` files to start developing locally. The app works out of the box.

Optional: If you want to test production features (PWA offline mode), set:

```javascript
NEXT_ENV=production npm run dev
```

**Browser Requirements**

The app works in all modern browsers:

* Chrome/Edge 90+
* Firefox 88+
* Safari 14+

For PWA/offline features, use a browser with Service Worker support (all modern browsers).

How to Contribute? Learn here.

**Stuck?** Ask in [Discord](https://discord.com/invite/HF8XjwVtPh)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.betterbugs.io/contributing-to-betterbugs/prerequisites.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.