docs(examples+recipes): Examples and recipes for Synthetic Monitoring

docs/docs/examples-tutorials/recipes.mdx

@@ -24,6 +24,13 @@ These guides show how to get the best of your instrumentation using the native T
 
 - [True End-To-End Trace-Based Tests with the Tracetest Playwright Engine](/examples-tutorials/recipes/running-tests-with-tracetest-playwright-engine)
 
+## Synthetic Monitoring
+
+These guides show how to get the best trace-based testing with Synthetic Monitoring.
+
+- [Synthetic Monitoring with Trace-based API Tests](/examples-tutorials/recipes/synthetic-monitoring-trace-based-api-tests)
+- [Synthetic Monitoring with Trace-based Playwright Tests](/examples-tutorials/recipes/synthetic-monitoring-trace-based-playwright-tests)
+
 ## Automation & Provisioning
 
 These guides show how to automate and provision Tracetest.

docs/docs/examples-tutorials/recipes/running-tests-with-tracetest-playwright-engine.mdx

@@ -1,7 +1,7 @@
 ---
 id: running-tests-with-tracetest-playwright-engine
 title: True End-To-End Trace-Based Tests with the Tracetest Playwright Engine Trigger
-description: Quickstart on how to crete True End-To-End Trace-Based Tests with the Tracetest Playwright Engine Trigger
+description: Quickstart on how to create True End-To-End Trace-Based Tests with the Tracetest Playwright Engine Trigger
 hide_table_of_contents: false
 keywords:
   - tracetest
@@ -53,7 +53,6 @@ Another big benefit of using traces as test specs is that you can:
 ## Run This Example
 
 The example below is provided as part of the Tracetest GitHub repo. You can download and run the example by following these steps:
-Clone the Tracetest project and go to the Privisioning Developer Environment with CLI example directory:
 
 ```bash
 git clone https://github.com/kubeshop/tracetest

docs/docs/examples-tutorials/recipes/synthetic-monitoring-trace-based-api-tests.mdx

@@ -0,0 +1,122 @@
+---
+id: synthetic-monitoring-trace-based-api-tests
+title: Synthetic Monitoring with Trace-based API Tests
+description: Quick start how to configure Synthetic Monitoring with Trace-based API tests with a Node.js app using OpenTelemetry manual instrumentation with traces.
+hide_table_of_contents: false
+keywords:
+  - tracetest
+  - trace-based testing
+  - observability
+  - distributed tracing
+  - testing
+  - nodejs
+  - testing nodejs
+  - nodejs observability
+  - nodejs tracing
+  - opentelemetry
+image: https://res.cloudinary.com/djwdcmwdz/image/upload/v1698686403/docs/Blog_Thumbnail_14_rsvkmo.jpg
+---
+
+:::note
+[Check out the source code on GitHub here.](https://github.com/kubeshop/tracetest/tree/main/examples/quick-start-nodejs-synthetic-monitoring)
+:::
+
+[Tracetest](https://tracetest.io/) is a synthetic monitoring and testing tool based on [OpenTelemetry](https://opentelemetry.io/) that allows you to test distributed apps. You can use data from distributed traces generated by OpenTelemetry to validate and assert the functionality of your apps.
+
+## Basic Node.js API with OpenTelemetry
+
+This is a simple quick start on how to configure a Node.js app to use OpenTelemetry instrumentation with traces, and Tracetest for trace-based testing and synthetic monitoring.
+
+:::info source code
+To view the full guide on how to configure the Node.js app, view [this recipe](/examples-tutorials/recipes/running-tracetest-without-a-trace-data-store-with-manual-instrumentation). The rest of this recipe focuses on synthetic monitoring.
+:::
+
+## Prerequisites
+
+**Tracetest Account**:
+
+- Sign up to [`app.tracetest.io`](https://app.tracetest.io) or follow the [get started](/getting-started/installation) docs.
+- Create an [environment](/concepts/environments).
+- Create an [environment token](/concepts/environment-tokens).
+- Have access to the environment's [agent API key](/configuration/agent).
+
+**Docker**: Have [Docker](https://docs.docker.com/get-docker/) and [Docker Compose](https://docs.docker.com/compose/install/) installed on your machine.
+
+## Run This Quckstart Example
+
+The example below is provided as part of the Tracetest project. You can download and run the example by following these steps:
+
+Clone the Tracetest project and go to the Node.js Quickstart with Manual Instrumentation:
+
+```bash
+git clone https://github.com/kubeshop/tracetest
+cd tracetest/examples/quick-start-nodejs-synthetic-monitoring
+```
+
+Follow these instructions to run the quick start:
+
+1. Copy the `.env.template` file to `.env`.
+2. Log into the [Tracetest app](https://app.tracetest.io/).
+3. This example is configured to use the OpenTelemetry Tracing Backend. Ensure the environment you will be utilizing to run this example is also configured to use the OpenTelemetry Tracing Backend by clicking on Settings, Tracing Backend, OpenTelemetry, Save.
+4. Fill out the [token](https://docs.tracetest.io/concepts/environment-tokens) and [API key](https://docs.tracetest.io/concepts/agent) details by editing your `.env` file. You can find these values in the Settings area for your environment.
+5. Run `docker compose up -d`.
+6. Configure your CLI with `tracetest configure -t <YOUR_API_TOKEN>`.
+7. Fill out the [token](https://docs.tracetest.io/concepts/environment-tokens) in the `tracetest-synthetic-monitor.yaml` file and apply the Tracetest Monitor with `tracetest apply monitor -f tracetest-synthetic-monitor.yaml`.
+8. Run tests from the CLI with `tracetest run test -f ./tracetest-test-api.yaml` or from the Tracetest Web UI by accessing the app with the URL `http://app:8080/books`.
+
+Follow along with the sections below for a detailed breakdown of what the example you just ran did and how it works.
+
+## Running the Node.js App
+
+To start the full setup, run the following command:
+
+```bash
+docker compose up -d
+```
+
+## Run Tracetest Tests
+
+1. Open [Tracetest](https://app.tracetest.io/)
+2. Start creating tests! Make sure to use the `http://app:8080/books` URL in your test creation. 
+3. To trigger tests in the CLI, first [install the CLI](/cli/cli-installation-reference), [configure it](/cli/configuring-your-cli), and [run a test](/cli/running-tests). From the root of the quick start directory, run:
+
+```bash
+tracetest configure -t <YOUR_API_TOKEN>
+tracetest run test -f ./tracetest-test-api.yaml
+```
+
+Here's a sample of a failed test run, which happens if you use this selector and assertion pair.
+
+Selector:
+```
+span[tracetest.span.type="general" name="Books List"]
+```
+
+Assertion:
+```
+attr: books.list.count = 4
+```
+
+![assertion](https://res.cloudinary.com/djwdcmwdz/image/upload/v1715607148/docs/app.tracetest.io_organizations_ttorg_e66318ba6544b856_environments_ttenv_56b66bc6e1a1cbbd_test_e9CCQuLSg_run_3_selectedAssertion_0_selectedSpan_d0c03aa5d02b9975_uqhhwl.png)
+
+It fails because `books.length` is equal to `3`.
+
+## Run Synthetic Monitoring
+
+1. Select `Monitors` in the [Tracetest](https://app.tracetest.io/) sidebar.
+2. Create a Monitor. Select a schedule and toggle the enable monitor switch.
+    ![create a monitor](https://res.cloudinary.com/djwdcmwdz/image/upload/v1721921382/docs/app.tracetest.io_organizations_ttorg_e66318ba6544b856_environments_ttenv_8fca16a31b8b6e24_monitors_page_1_guf2id.png)
+3. Select the test you want to add to the Monitor.
+    ![select tests for monitor](https://res.cloudinary.com/djwdcmwdz/image/upload/v1721921383/docs/app.tracetest.io_organizations_ttorg_e66318ba6544b856_environments_ttenv_8fca16a31b8b6e24_monitors_page_1_1_dsbb1k.png)
+4. Select the webhook you want to notify.
+    ![select webhook](https://res.cloudinary.com/djwdcmwdz/image/upload/v1721921382/docs/app.tracetest.io_organizations_ttorg_e66318ba6544b856_environments_ttenv_8fca16a31b8b6e24_monitors_page_1_2_rzz5vm.png)
+5. Click `Create` and you will see the Monitor run.
+    ![monitor run overview](https://res.cloudinary.com/djwdcmwdz/image/upload/v1721921382/docs/app.tracetest.io_organizations_ttorg_e66318ba6544b856_environments_ttenv_8fca16a31b8b6e24_monitors_page_1_3_pktmr0.png)
+6. To view the YAML definition for the Monitor, click `Automate`.
+    ![monitor automate overview](https://res.cloudinary.com/djwdcmwdz/image/upload/v1721921383/docs/app.tracetest.io_organizations_ttorg_e66318ba6544b856_environments_ttenv_8fca16a31b8b6e24_monitors_page_1_4_ysjbnx.png)
+
+With this setup, your Monitor will trigger the `Books list with availability` test, defined in `./tracetest-test-api.yaml`, every 5 minutes.
+
+## Learn More
+
+Feel free to check out our [examples in GitHub](https://github.com/kubeshop/tracetest/tree/main/examples) and join our [Slack Community](https://dub.sh/tracetest-community) for more info!