doc: enhance quickstart guide with docker-compose workflow

Author: yottahmd

examples/docker-compose.yaml docker-compose.yaml

@@ -7,9 +7,37 @@ Quick Start Guide
 1. Launch the Web UI
 ---------------------
 
+There are two ways to launch the Dagu Web UI:
+
+**Option A: Direct Launch**
+
 Start the server with ``dagu start-all`` and browse to http://127.0.0.1:8080 to explore the Web UI.
+After the Web UI loads, navigate to the DAGs page by either:
+
+#. Clicking the second button from the top in the left sidebar (the one that looks like a list)
+#. Directly accessing http://localhost:8080/dags
+
+.. note::
+   The server will be started on port ``8080`` by default. You can change the port by passing ``--port`` option. See `configurations options </config.html>`_ for more details.
+
+**Option B: Using Docker Compose**
+
+If you prefer using Docker, you can use `docker-compose.yaml <https://github.com/dagu-org/dagu/blob/main/docker-compose.yaml>`_ to launch the Web UI:
+
+.. code-block:: bash
+
+    # Clone the repository
+    git clone https://github.com/dagu-org/dagu.git
+    # Navigate to the project root
+    cd dagu
+    # Launch with docker compose from the project root
+    docker compose up
+
+Then browse to http://127.0.0.1:8080/dags to access the Web UI.
+After the Web UI loads, navigate to the DAGs page by either:
 
-Note: The server will be started on port ``8080`` by default. You can change the port by passing ``--port`` option. See :ref:`Host and Port Configuration` for more details.
+#. Clicking the second button from the top in the left sidebar (the one that looks like a list)
+#. Directly accessing http://localhost:8080/dags
 
 2. Create a New DAG
 -------------------
@@ -56,7 +84,7 @@ Go to the ``SPEC`` Tab and hit the ``Edit`` button. Copy & Paste the following Y
 -------------------
 
 .. note::
-   In the `examples <https://github.com/dagu-org/dagu/tree/main/examples>`_ folder, there is a ``docker-compose.yaml`` which can be used to test out DAGs, and get up to speed with examples like the above.
+   In the `project root <https://github.com/dagu-org/dagu>`_, there is a `docker-compose.yaml <https://github.com/dagu-org/dagu/blob/main/docker-compose.yaml>`_ which can be used to test out DAGs, and get up to speed with examples like the above.
 
 You can execute the example by pressing the `Start` button.