harbor/docs/1.10/build_customize_contribute/ui_contribution_get_started.md

[Back to table of contents](../index.md)

----------

# Developing the Harbor Frontend

If you already have a harbor backend environment, you can build a frontend development environment with the following configuration.

1. Create the file proxy.config.json in the directory harbor/src/portal，and config it according to the sample below.

    **NOTE:**  You should replace “$IP_ADDRESS” with your own ip address.

    ```
    {
        "/api/*": {
            "target": "$IP_ADDRESS",
            "secure": false,
            "changeOrigin": true,
            "logLevel": "debug"
        },
        "/service/*": {
            "target": "$IP_ADDRESS",
            "secure": false, 
            "logLevel": "debug"
        },
        "/c/login": {
            "target": "$IP_ADDRESS",
            "secure": false,
            "logLevel": "debug"
        },
        "/sign_in": {
            "target": "$IP_ADDRESS",
            "secure": false,
            "logLevel": "debug"
        },
        "/c/log_out": {
            "target": "$IP_ADDRESS",
            "secure": false,
            "logLevel": "debug"
        },
        "/sendEmail": {
            "target": "$IP_ADDRESS",
            "secure": false,
            "logLevel": "debug"
        },
        "/language": {
            "target": "$IP_ADDRESS",
            "secure": false,
            "logLevel": "debug"
        },
        "/reset": {
            "target": "$IP_ADDRESS",
            "secure": false,
            "logLevel": "debug"
        },
        "/userExists": {
            "target": "$IP_ADDRESS",
            "secure": false,
            "logLevel": "debug"
        },
        "/reset_password": {
            "target": "$IP_ADDRESS",
            "secure": false,
            "logLevel": "debug"
        },
        "/i18n/lang/*.json": {
            "target": "$IP_ADDRESS",
            "secure": false,
            "logLevel": "debug",
            "pathRewrite": { "^/src$": "" }
        },
        "/chartrepo": {
            "target": "$IP_ADDRESS",
            "secure": false,
            "logLevel": "debug"
        },
        "/*.json": {
            "target": "$IP_ADDRESS",
            "secure": false,
            "logLevel": "debug"
        }
    }
    ```

2. Open the terminal and run the following command，install npm packages as 3rd-party dependencies.
    ```
    cd harbor/src/portal
    npm install
    ```

3. Execute the following command，serve Harbor locally.

    ```
    npm run start
    ```

4. Then you can visit the Harbor by address:  https://localhost:4200.



----------

[Back to table of contents](../index.md)