MQTT-based water meter configuration for Home Assistant

configuration.yaml

# MQTT Broker - mosquitto
mqtt:
  broker: localhost
  port: 1883
  
utility_meter:
  water_usage_mains_hourly:
    source: sensor.water_meter
    cycle: hourly
  water_usage_mains_daily:
    source: sensor.water_meter
    cycle: daily
  # Weekly cycle begins on a Monday by default, so make it start on a Sunday
  water_usage_mains_weekly:
    source: sensor.water_meter
    cycle: weekly
    offset:
      days: 6
  water_usage_mains_monthly:
    source: sensor.water_meter
    cycle: monthly
  water_usage_mains_yearly:
    source: sensor.water_meter
    cycle: yearly

sensor:
  # ...
  # Example data
  # {"time": "2019-06-12T00:54:42.700000Z", "tag_id": "123456", "data": [{"parameter": "backflow", "error": false, "value": false}, {"parameter": "tamper", "error": false, "value": false}, {"parameter": "pulses", "error": false, "value": 760}], "metadata": {"application": "meter"}}
  - platform: mqtt
    name: Water Meter
    state_topic: "home/water-meter"
    value_template: '{{ (value_json.data|selectattr("parameter", "eq", "pulses")|first)["value"] * 5 }}'
    json_attributes_topic: "home/water-meter"
    icon: mdi:gauge
    force_update: true
    unit_of_measurement: L
    
  - platform: template
    sensors:
      # ...
      water_usage_last_update:
        friendly_name: Last Update
        value_template: "{{ state_attr('sensor.water_meter', 'time')|as_timestamp|timestamp_local or 'Wai
ting for data' }}"
        icon_template: "mdi:update"
      water_usage_mains_hourly_previous:
        friendly_name_template: "Last Hour"
        value_template: "{{ state_attr('sensor.water_usage_mains_hourly', 'last_period') }}"
        icon_template: "{{ state_attr('sensor.water_usage_mains_hourly', 'icon') }}"
        unit_of_measurement: L
      water_usage_mains_daily_previous:
        friendly_name_template: "Yesterday"
        value_template: "{{ state_attr('sensor.water_usage_mains_daily', 'last_period') }}"
        icon_template: "{{ state_attr('sensor.water_usage_mains_daily', 'icon') }}"
        unit_of_measurement: L
      water_usage_mains_weekly_kl:
        friendly_name_template: "{{ state_attr('sensor.water_usage_mains_weekly', 'friendly_name')}}"
        value_template: "{{ (states('sensor.water_usage_mains_weekly')|int / 1000)|round(1) }}"
        icon_template: "{{ state_attr('sensor.water_usage_mains_weekly', 'icon') }}"
        unit_of_measurement: kL
      water_usage_mains_weekly_previous_kl:
        friendly_name_template: "Last Week"
        value_template: "{{ (state_attr('sensor.water_usage_mains_weekly', 'last_period')|int / 1000)|round(1) }}"
        icon_template: "{{ state_attr('sensor.water_usage_mains_weekly', 'icon') }}"
        unit_of_measurement: kL
      water_usage_mains_monthly_kl:
        friendly_name_template: "{{ state_attr('sensor.water_usage_mains_monthly', 'friendly_name')}}"
        value_template: "{{ (states('sensor.water_usage_mains_monthly')|int / 1000)|round }}"
        icon_template: "{{ state_attr('sensor.water_usage_mains_monthly', 'icon') }}"
        unit_of_measurement: kL
      water_usage_mains_monthly_previous_kl:
        friendly_name_template: "Last Month"
        value_template: "{{ (state_attr('sensor.water_usage_mains_monthly', 'last_period')|int / 1000)|round }}"
        icon_template: "{{ state_attr('sensor.water_usage_mains_monthly', 'icon') }}"
        unit_of_measurement: kL
      water_usage_mains_yearly_kl:
        friendly_name_template: "{{ state_attr('sensor.water_usage_mains_yearly', 'friendly_name')}}"
        value_template: "{{ (states('sensor.water_usage_mains_yearly')|int / 1000)|round }}"
        icon_template: "{{ state_attr('sensor.water_usage_mains_yearly', 'icon') }}"
        unit_of_measurement: kL
      water_usage_mains_yearly_previous_kl:
        friendly_name_template: "Last Year"
        value_template: "{{ (state_attr('sensor.water_usage_mains_yearly', 'last_period')|int / 1000)|round }}"
        icon_template: "{{ state_attr('sensor.water_usage_mains_yearly', 'icon') }}"
        unit_of_measurement: kL

binary_sensor:
  - platform: template
    sensors:
      water_meter_backflow:
        friendly_name: "Water Meter Backflow"
        device_class: problem
        value_template: >-
          {% set data = state_attr("sensor.water_meter", "data") %}
          {% if data %}
            {{ (data|selectattr("parameter", "eq", "backflow")|first)["value"] }}
          {% else %}
            {{ False }}
          {% endif %}
      water_meter_tampering:
        friendly_name: "Water Meter Tampering"
        device_class: problem
        value_template: >-
          {% set data = state_attr("sensor.water_meter", "data") %}
          {% if data %}
            {{ (data|selectattr("parameter", "eq", "tamper")|first)["value"] }}
          {% else %}
            {{ False }}
          {% endif %}

customize.yaml

# ...

sensor.water_usage_mains_hourly:
  friendly_name: "Hourly H₂O"
sensor.water_usage_mains_daily:
  friendly_name: "Daily H₂O"
sensor.water_usage_mains_weekly:
  friendly_name: "Weekly H₂O"
sensor.water_usage_mains_monthly:
  friendly_name: "Monthly H₂O"
sensor.water_usage_mains_yearly:
  friendly_name: "Yearly H₂O"

mosquitto.conf

# ...
connection taggle
address mqtt.taggle.com.au:8883
topic "" in 0 home/water-meter data/v2/city-council-name/123456
remote_clientid reader
remote_username YYYYYY
remote_password XXXXXX
bridge_cafile /etc/ssl/cert.pem
bridge_insecure false

ui-lovelace.yaml

# Cards wherever you want to put them...
- type: glance
  title: "\U0001f6b0 Water Usage"
  entities:
    - sensor.water_usage_mains_hourly
    - sensor.water_usage_mains_daily
    - sensor.water_usage_mains_weekly_kl
    - sensor.water_usage_mains_monthly_kl
    - sensor.water_usage_mains_yearly_kl
    - sensor.water_usage_mains_hourly_previous
    - sensor.water_usage_mains_daily_previous
    - sensor.water_usage_mains_weekly_previous_kl
    - sensor.water_usage_mains_monthly_previous_kl
    - sensor.water_usage_mains_yearly_previous_kl
  # uses card-mod.js for styling
  style: >-
    .card-header { padding: .75rem .5rem; }
    .entities { padding: 0 !important; }
    state-badge { display: none; }
    .entity { padding: 0 !important; }
    .entity div:last-child { font-weight: 200; font-size: 2.5rem; letter-spacing: -.22rem; text
    -overflow: initial; }
- type: entities
  entities:
    - sensor.water_usage_last_update
    - binary_sensor.water_meter_backflow
    - binary_sensor.water_meter_tampering

Hello,
In which folder do the files ui-lovelace.yaml, mosquitto.conf, customize.yaml have to go? How are the darlings integrated in the configuration.yaml? Which programs must be installed? What else to consider.
I've been trying to integrate my "Water Meter" for days and weeks, unfortunately without success so far.