1# git-bug rich web UI
 2
 3## Prerequisites
 4
 5[ReactJS](https://reactjs.org/) | [Material UI](https://material-ui.com/) |
 6[GraphQL](https://graphql.org/) |
 7[Apollo GraphQL](https://www.apollographql.com/docs/react/)
 8
 9## How to develop
10
11### Run GraphQL backend
12
131. Download a git-bug stable binary or compile your own by running `make` in the
14   **root** directory:
15
162. Run the git-bug binary inside your git repository. It will manage issues and
17   start the API:
18
19   - `git-bug webui -p 3001`
20
21### Run ReactJS front-end
22
231. If you haven't already, clone the git-bug repository:
24
252. Enter the `webui` directory and install the needed libraries:
26
27   - `make install` or `npm install`
28
293. Generate the TS code from the GrapQL files and run the webui in development
30   mode:
31
32   - `make start` or `npm start`
33   - If you get some lint errors, run the lint command below and start again:
34     - `make fix-lint` or `npm run lint -- --fix`
35     - `make start` or `npm start`
36
37The development version of the WebUI is configured to query the backend on the
38port 3001. You can now live edit the js code and use the normal backend.
39
40## Bundle the web UI
41
42Once the webUI is good enough for a new release:
43
441. run `make build` from webui folder
452. run `make pack-webui` from the *root directory* to bundle the compiled js
46   into the go binary.
47   - You must have Go installed on Your machine to run this command.