---
# System prepended metadata

title: Steps to start time-tracker with hREA backend

---

# Steps to start time-tracker with hREA backend
## Backend - 'Sapling' Release
1. Download the "Sapling" release [hrea_suite.happ](https://github.com/h-REA/hREA/releases/tag/happ-0.1.0-beta) file (version: happ-0.1.0-beta).
2. In the same folder create a default.nix file and paste in the following.
``` 
let
  holonixRev = "38f74c722048f787d9faadb479978e73bb5091a1";

  holonixPath = builtins.fetchTarball "https://github.com/holochain/holonix/archive/${holonixRev}.tar.gz";
  holonix = import (holonixPath) {
    holochainVersionId = "v0_0_162";
  };
  nixpkgs = holonix.pkgs;
in nixpkgs.mkShell {
  inputsFrom = [ holonix.main ];
  packages = with nixpkgs; [
    nodejs-16_x
    nodePackages.pnpm
  ];
}
```
3. Then once nix-shell is installed run to open the holochain dev enviorment using nix-shell by running: `nix-shell .`
4. Setup a holochain development "sandbox" by running: 
`hc sandbox create -n 1 -d hrea_tester network quic` and choose a passphrase to create a temporary key.
5. Install the hREA hApp to your holochain sandbox. Make sure you use the right path to wherever on your filesystem you have hrea_suite.happ file that you downloaded. `hc sandbox call install-app-bundle ./hrea_suite.happ`
6. Start the hREA backend in the holochain "sandbox" by running: `hc sandbox run --all --ports 4000` which will open up port 4000 to connect a graphQL font end to.
You should see something like this.
![](https://i.imgur.com/krGLxOj.png)





## Front End - (in this case "time-tracker")
1. In a new project folder, clone https://github.com/Connoropolous/time-tracker by running: `git clone https://github.com/Connoropolous/time-tracker.git`
2. Modify package.json to connect to web socket port 4000 because we opend up port 4000 where the hREA backend is connected to. Replace `REACT_APP_HC_CONN_URL='ws://localhost:17840` with `REACT_APP_HC_CONN_URL='ws://localhost:4000`
3. `npm i`
4. `npm run start`
5. Then open http://localhost:3000

## Toms' Errors:
![](https://i.imgur.com/zQavXzt.png)

![](https://i.imgur.com/DZ6FA7z.png)


Questions:
1. Why is it if failing to load `Hrea-graphql-explorer`?
2. But saying it's sucessfully connecting on port 4000?
3. But failing to make the web socket connetion on the screen?