Automatic Image Build

If you want to develop or test local changes, you can use Docker’s build context to build the image from your local source code each time you run docker compose. With the build context from your local application, Docker will automatically build the image.

To use this approach, first update your hello-world.docker-compose.yaml to use a build section instead of an image reference. Adjust the context to your local app path and reference the application’s Dockerfile as shown in the examples below. For the UI it would look like this:

include:
  - docker-compose.yaml
services:
  hello-world-ui:
    # image: ${HELLO_WORLD_UI}
    build:
      context: /path/to/hello-world-ui
      dockerfile: Dockerfile
    environment:
      APP_BASE_HREF: /mfe/helloWorld/
      APP_ID: hello-world-ui
      PRODUCT_NAME: hello-world
    depends_on:
      hello-world-bff:
        condition: service_healthy
    labels:
      - traefik.http.services.hello-world-ui.loadbalancer.server.port=8080
      - traefik.http.routers.hello-world-ui.rule=Host(`local-proxy`)&&PathPrefix(`/mfe/helloWorld/`)
    networks:
      - default
    profiles:
      - base
      - hello-world
      - hello-world-ui
      - all

If you want to use the build context for the BFF service, it would look like this:

...
  hello-world-bff:
    # image: ${HELLO_WORLD_BFF}
    build:
      context: /path/to/hello-world-bff
      dockerfile: Dockerfile
  ...

In order for the Svc to use the build context, it must be customized in the same way:

...
  hello-world-svc:
    # image: ${HELLO_WORLD_SVC}
    build:
      context: /path/to/hello-world-svc
      dockerfile: Dockerfile
    ...

Now you can import the initial data in the onecx-local-env by running:

./import-onecx.sh

The corresponding application can now be built, e.g. with npm run build for the UI, and the onecx-local-env can be started and built with:

docker compose -f hello-world.docker-compose.yaml --profile base up -d --build

Your application will now be built and available at http://local-proxy/onecx-shell/admin/helloWorld/hello in the OneCX Shell. If you make changes in your application, you need to rebuild it with npm run build and restart the onecx-local-env with the command above.

This method of running the application may lead to potential caching issues that could prevent changes from being reflected immediately.