Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save codyc1515/cfd5b03c753678815b5219514e584e29 to your computer and use it in GitHub Desktop.
Save codyc1515/cfd5b03c753678815b5219514e584e29 to your computer and use it in GitHub Desktop.

Install pre-requisites

  1. Open the Microsoft Store:

    1. Search for and install Visual Studio Code (VSCode).

    2. Search for and install Windows Subsystem for Linux (WSL).

  2. Open Command Prompt (cmd.exe) and type wsl --install, then press Enter to install Ubuntu via. WSL.

Install Home Assistant Core

  1. Open VSCode

  2. In the bottom left corner, click the <> arrows (tooltip Open a remote window).

    1. Connect to WSL - from the dropdown, select Connect to WSL. This takes a moment as it is connecting to Ubuntu in WSL. Once it's finished, VSCode will be running from Ubuntu in the /home directory.
  3. Tap Clone Repository, then select your forked core repository

  4. If prompted in the bottom-right, choose:

    1. Do you trust the authors of the files in this folder? - yes

    2. Do you want to install the recommended extensions from Microsoft and Prettier for this repository? - install

    3. Install python debugger extension - yes

    4. Reopen in container - yes

    5. Dev containers require docker to run - install - this takes an extremely long time as all dependencies need to be downloaded then installed

      1. Do you want to continue - yes
    6. Virtual environment - disable

  5. Generate translations - press Ctrl-T, clear the box and type Task then a space, then select Generate English translations. DIDNT DO ANYTHING?

Leave this VSCode window open to keep HA Core running. We will come back to it later.

Install Home Assistant Frontend

  1. Open VSCode

  2. In the bottom left corner, click the <> arrows (tooltip Open a remote window).

    1. Connect to WSL - from the dropdown, select Connect to WSL. This takes a moment as it is connecting to Ubuntu in WSL. Once it's finished, VSCode will be running from Ubuntu in the /home directory.
  3. Tap Clone Repository, then select your forked frontend repository

  4. If prompted in the bottom-right, choose:

    1. Do you trust the authors of the files in this folder? - yes

    2. Do you want to install the recommended extensions from Microsoft and Prettier for this repository? - install

    3. Install python debugger extension - yes

    4. Reopen in container - yes

    5. Dev containers require docker to run - install - this takes an extremely long time as all dependencies need to be downloaded then installed

      1. Do you want to continue - yes
    6. Virtual environment - disable

  5. Open a terminal - if you do not see a Terminal (username@hostname:~/workspaces), open a new terminal from the menubar by selecting Terminal -> New Terminal.

  1. Run bootstrap script - type script/bootstrap, then press Enter - this can take a while as npm dependencies are downloaded and installed or built - done with warnings is okay

  2. Run the frontend - type script/develop, then press Enter - this can take a while as frontend is built from TypeScript.

  3. Generate translations - press Ctrl-T, clear the box and type Task then a space, then select Setup and fetch nightly translations.

  4. If you get an error when building:

    1. Couldn't find a script named "lint-staged" - yarn add lint-staged husky --dev

    2. Git: Extension 'vscode.git' CANNOT use API proposal: telemetry - tried disabling Git and File -> Preferences -> Settings, search for Telemetry and change to Off but nothing worked (refer microsoft/vscode#204382); eventually got this working but don't remember what changed it

Leave this VSCode window open to keep HA Frontend running. We will come back to it later.

Link HA Frontend to HA Core

  1. Switch back to the VSCode window for core.

  2. From the sidebar, select the two sheets icon at the top (tooltip `Explorer).

  3. Click config folder, then click configuration.yaml file, then after frontend section on a new line, add development_repo: /workspaces/frontend/ (DO WE NEED TO SAVE).

  4. Click .devcontainer folder, then click devcontainer.json file, then at the end of the file but before the last }, add (DO WE NEED TO SAVE):

      },
      "mounts": [
        "source=/home/<username>/frontend,target=/workspaces/frontend,type=bind,consistency=cached"
      ]
    
    1. If prompted in the bottom-right Configuration file(s) changed: devcontainer.json. The container might need to be rebuilt to apply the changes., choose: Rebuild - this can take a while
  5. From the menubar, select File -> Add Folder to Workspace, then choose frontend and press OK.

  6. From the menubar, select File -> Save Workspace As, you decide, then press OK.

  7. From the sidebar, select the Play / Bug icon fourth from the top (tooltip Run and Debug), then in the top-left next to RUN AND DEBUG, press the green play > button - this can take a while as HA Core builds.

    1. If prompted in the bottom-right A virtual environment is not currently selected for your Python interpreter. Would you like to create a virtual environment?, choose Disable.

Performing development

TBC

Miscellanenous

git config --global user.name "codyc1515" git config --global user.email [email protected]

Open frontend at http://localhost:8123

Create branch Make changes in the core / frontend folders Push branch Create PR etc.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment