# Testing GUI Changes Live
**URL:** https://hub.mender.io/t/testing-gui-changes-live/1880
**Category:** General Discussions
**Tags:** gui, gulp, development
**Created:** [May 5, 2020, 4:15pm UTC](https://hub.mender.io/t/testing-gui-changes-live/1880 "2020-05-05T16:15:37Z")
**Posts on this page:** 4
**Page:** 1
### Author:  [@lizziemac](https://hub.mender.io/u/lizziemac)
#### Post date: [May 5, 2020, 4:15pm UTC](https://hub.mender.io/t/testing-gui-changes-live/1880/1 "2020-05-05T16:15:37Z")
Hi there,
I’m pretty new to front-end development, and would like to contribute to the mender gui. As of now, I’ve been making docker files every time I want to test my changes, but it takes a long time to compile, and then if anything fails, it’s another few minutes fixing and rebuilding. I noticed that gulp is mentioned in the readme, but when running `gulp build` or `gulp watch` there’s no indication of a localhost port to access/see the gui on. Is there a standard way to develop quickly for this project? A step-by-step would be greatly appreciated.
Liz
---
### Author:  [@oleorhagen](https://hub.mender.io/u/oleorhagen)
#### Post date: [May 6, 2020, 6:48am UTC](https://hub.mender.io/t/testing-gui-changes-live/1880/2 "2020-05-06T06:48:26Z")
Thank you, this is sure an interesting question. I’m not on the frontend myself, although I have also been playing with the idea of contributing something here.
@mzedel how would I go about this? 🙂
---
### Author:  [@mzedel](https://hub.mender.io/u/mzedel)
#### Post date: [May 6, 2020, 7:54am UTC](https://hub.mender.io/t/testing-gui-changes-live/1880/3 "2020-05-06T07:54:46Z")
Hi @lizziemac & @oleorhagen,
thanks to both of you for your interest in working on the gui side of things!
the `gulp` command is intended to build however the content is served from within the regular container running in your local mender setup.
To set this up I usually create a `docker-compose.override.yml` in the folder you have cloned the `integration` repo into (just to isolate the changes made to the running environment in a single file) with the following content:
```auto
version: '2.1'
services:
mender-gui:
volumes:
- ..//dist:/var/www/mender-gui/dist
```
and then start the demo environment with this file like this: `./demo -f docker-compose.override.yml up` (or add this in the demo script) from the `integration` clone folder. The content should be accessible under `https://localhost/` just as without any modifications.
Now with this running, change into your gui folder (make sure to once run `npm install` to get all the dependencies installed) and then you can run the `gulp` commands or go straight to the `npm` scripts (it uses `webpack` internally and `gulp` is now just a wrapper for legacy purposes). So you can run either `npm run build` (for one time builds), `npm run watch` (for development), `npm run lint` (the linting rules can be found in the `.eslintrc` file in the repo) or `npm run test` (to run the jest tests).
When running `npm run watch` the incremental build takes around 10 seconds on my machine for any changes made, but then they should show up on page refresh (at some point I’ll wire up the hot-reloading, but for now this should be good enough 🤷♂️).
I hope this clarified things, please let me know if you have any additional questions!
---
### Author:  [@lizziemac](https://hub.mender.io/u/lizziemac)
#### Post date: [May 6, 2020, 2:26pm UTC](https://hub.mender.io/t/testing-gui-changes-live/1880/4 "2020-05-06T14:26:04Z")
Thank you! This worked like a charm for me.