Address Sample App's new feedback (#6045)

* fix: recommend using kn quickstart in env setup

* fix: make the file'name copy-friendly by adding the full path

* fix: Adding the description of s2i build to the func deploy

* fix: Add the command to deploy bad-word-service

* fix: Move the troubleshoot box up in deploy-database-service

* fix: highlight the failed job in db-service

docs/bookstore/page-0.5/environment-setup.md

@@ -66,6 +66,10 @@ Running `docs/code-samples/eventing/bookstore-sample-app/start/setup.sh` will au
 
 ![Image](images/image13.png)
 
+!!! tip
+
+    We recommend you using `kn quickstart` plugin to install Knative.
+
 Please follow the instructions [here](https://knative.dev/docs/install/){:target="_blank"} to spin up your cluster with Knative installed!
 
 ???+ success "Verify"

docs/bookstore/page-1/send-review-comment-to-broker.md

@@ -192,7 +192,7 @@ Learn more about SinkBinding [here](https://knative.dev/docs/eventing/custom-eve
 
 **Create a SinkBinding:**
 
-- 1: Create a new YAML file named `300-sinkbinding.yaml` in the `node-server/config` folder and add the following content:
+- 1: Create a new YAML file named `node-server/config/300-sinkbinding.yaml` and add the following content:
 
 ???+ abstract "_node-server/config/300-sinkbinding.yaml_"
     ```yaml
@@ -249,7 +249,7 @@ Event display is a debugging tool in Knative Eventing that allows you to use it
 
 **Create an Event Display Service:**
 
-- 1: Create a new YAML file named `100-event-display.yaml` in the `node-server/config` folder and add the following content:
+- 1: Create a new YAML file named `node-server/config/100-event-display.yaml` and add the following content:
 
 ???+ abstract "_node-server/config/100-event-display.yaml_"
 
@@ -341,7 +341,7 @@ Here we are creating a Trigger that will send all the events to event-display.
 
 ![Image](images/image4.png)
 
-- 1: Create a new YAML file named `200-log-trigger.yaml` and add the following content:
+- 1: Create a new YAML file named `node-server/config/200-log-trigger.yaml` and add the following content:
 
 ???+ abstract "_node-server/config/200-log-trigger.yaml_"
     ```yaml 

docs/bookstore/page-2/sentiment-analysis-service-for-bookstore-reviews.md

@@ -93,7 +93,7 @@ You can find all the supported language templates [here](https://knative.dev/doc
 
 ![Image14](images/image14.png)
 
-`func.py` is the file that contains the code for the function. You can replace the generated code with the sentiment analysis logic. You can use the following code as a starting point:
+`sentiment-analysis-app/func.py` is the file that contains the code for the function. You can replace the generated code with the sentiment analysis logic. You can use the following code as a starting point:
 
 ???+ abstract "_sentiment-analysis-app/func.py_"
 
@@ -162,7 +162,7 @@ You can find all the supported language templates [here](https://knative.dev/doc
 
 ![Image9](images/image9.png)
 
-The `requirements.txt` file contains the dependencies for the function. You can add the following dependencies to the `requirements.txt` file:
+The `sentiment-analysis-app/requirements.txt` file contains the dependencies for the function. Add the following dependencies to the file:
 ???+ abstract "_sentiment-analysis-app/requirements.txt_"
 
     ```
@@ -180,7 +180,7 @@ Knative Function will automatically install the dependencies listed here when yo
 
 In order to properly use the `textblob` library, you need to download the corpora, which is a large collection of text data that is used to train the sentiment analysis model. You can do this by creating a new file called `setup.py`, Knative Function will ensure that the `setup.py` file is executed after the dependencies have been installed.
 
-The `setup.py` file should contain the following code for your bookstore:
+The `sentiment-analysis-app/setup.py` file should contain the following code for your bookstore:
  
 ???+ abstract "_sentiment-analysis-app/setup.py_"
     ```python
@@ -297,11 +297,19 @@ The `setup.py` file should contain the following code for your bookstore:
 !!! note
     Please enter `/sentiment-analysis-app` when you are executing the following commands.
 
+In Knative Function, there are two ways to build: using the [pack build](https://github.com/knative/func/blob/8f3f718a5a036aa6b6eaa9f70c03aeea740015b9/docs/reference/func_build.md?plain=1#L46){:target="_blank"} or using the [source-to-image (s2i) build](https://github.com/knative/func/blob/4f48549c8ad4dad34bf750db243d81d503f0090f/docs/reference/func_build.md?plain=1#L43){:target="_blank"}.
+
+Currently **only** the `s2i` build is supported if you need to run `setup.py`. When building with s2i, the `setup.py` file will be executed automatically after the dependencies have been installed.
+
 After you have finished the code, you can deploy the function to the cluster using the following command:
+!!! note
+    Using `-b=s2i` to specify how the function should be built.
 
 ```bash
 func deploy -b=s2i -v
 ```
+
+
 ???+ success "Verify"
 
     When the deployment is complete, you will see the following output:

docs/bookstore/page-3/create-bad-word-filter-service.md

@@ -43,6 +43,9 @@ This workflow ensures a smooth transition from development to deployment within
 ### **Step 1: Create a Knative Function template**
 
 ![Image 6](images/image6.png)
+```shell
+func deploy -b=s2i -v
+```
 
 ???+ success "Verify"
 
@@ -65,7 +68,7 @@ This workflow ensures a smooth transition from development to deployment within
 
 ![Image 5](images/image5.png)
 
-`func.py` is the file that contains the code for the function. You can replace the generated code with the bad word filter logic. You can use the following code as a starting point:
+`bad-word-filter/func.py` is the file that contains the code for the function. You can replace the generated code with the bad word filter logic. You can use the following code as a starting point:
 
 ???+ abstract "_bad-word-filter/func.py_"
     ```python
@@ -113,6 +116,7 @@ This workflow ensures a smooth transition from development to deployment within
 ### **Step 3: Configure the dependencies**
 
 ![Image 8](images/image8.png)
+The content of `bad-word-filter/requirements.txt`:
 
 ???+ abstract "_bad-word-filter/requirements.txt_"
     ```plaintext

docs/bookstore/page-3/solution-create-bad-word-filter-service.md

@@ -77,7 +77,7 @@ You can find all the supported language templates [here](https://knative.dev/doc
 
 ![image](images/image5.png)
 
-`func.py` is the file that contains the code for the function. You can replace the generated code with the bad word filter logic. You can use the following code as a starting point:
+`bad-word-filter/func.py` is the file that contains the code for the function. You can replace the generated code with the bad word filter logic. You can use the following code as a starting point:
 
 
 
@@ -128,9 +128,9 @@ You can find all the supported language templates [here](https://knative.dev/doc
 
 ![image](images/image8.png)
 
-The `requirements.txt` file contains the dependencies for the function. You can add the following dependencies to the `requirements.txt` file:
+The `bad-word-filter/requirements.txt` file contains the dependencies for the function. You can add the following dependencies to the `requirements.txt` file:
 
-???+ abstract "bad-word-filter/requirements.txt_"
+???+ abstract "bad-word-filter/requirements.txt"
     ```plaintext
     parliament-functions==0.1.0
     alt-profanity-check==1.4.1.post1

docs/bookstore/page-4/create-sequence-to-streamline-ML-workflows.md

@@ -52,6 +52,7 @@ spec:
 ### **Step 1: Create the Sequence**
 
 ![image](images/image9.png)
+Create a new yaml file named `sequence/config/100-create-sequence.yaml` to create Sequence resource in your cluster:
 
 ???+ abstract "sequence/config/100-create-sequence.yaml"
     ```yaml 
@@ -112,7 +113,7 @@ sequence.flows.knative.dev/sequence created
 
 As the Sequence is ready to accept the request now, we need to tell the Broker to forward the events to the Sequence, so that new comments will go through our ML workflows.
 
-
+Create the Trigger yaml file named `sequence/config/200-create-trigger.yaml`
 ???+ abstract "sequence/config/200-create-trigger.yaml"
 
     ```yaml
@@ -132,7 +133,7 @@ As the Sequence is ready to accept the request now, we need to tell the Broker t
           name: sequence
     ```
 
-Create the Trigger yaml file and apply it to your cluster.
+Apply it to your cluster.
 
 ```
 kubectl apply -f sequence/config/200-create-trigger.yaml

docs/bookstore/page-5/deploy-database-service.md

@@ -41,6 +41,9 @@ In this section, we will just be simply running a PostgreSQL service. We have al
 kubectl apply -f db-service
 ```
 
+!!! warning
+    Please wait few minutes until everything become ready.  If you see some job pods are failing and having errors, that's okay. Just continue waiting.
+
 ???+ success "Verify"
 
     You should see the following output:
@@ -70,13 +73,15 @@ kubectl apply -f db-service
 
 ![image3](images/image3.png)
 
-Open the UI page at [http://localhost:3000](http://localhost:3000){:target="_blank"}, you should see some new comments popping up at the bottom of the page.
 
-![image2](images/image2.png)
+Open the UI page at [http://localhost:3000](http://localhost:3000){:target="_blank"}, you should see some new comments popping up at the bottom of the page.
 
 ???+ bug "Troubleshoot"
     If you see "No comments available", that means your database is not initialized yet. Check the health of the database service pods and figure out what happened.
 
+![image2](images/image2.png)
+
+
 ## **Next Step**
 
 ![image7](images/image7.png)

docs/bookstore/page-6/advanced-event-filtering.md

@@ -20,7 +20,7 @@
 
 ![Image](images/image3.png)
 
-Append the following Trigger configuration to the existing `200-broker.yaml` file in `node-server/config/200-broker.yaml` and then apply:
+Append the following Trigger configuration to the existing `node-server/config/200-broker.yaml` file and then apply:
 
 ???+ abstract "**Append** to _node-server/config/200-broker.yaml_"
     ```yaml 

docs/bookstore/page-7/slack-sink-learning-knative-eventing-and-apache-camel-K-integration.md

@@ -71,7 +71,7 @@ Follow the instructions [here](../create-slack-workspace/README.md){:target="_bl
 
 ![image](images/image22.png)
 
-We are storing the webhook URL as a secret. Copy and paste your webhook URL into the file `application.properties`
+We are storing the webhook URL as a secret. Copy and paste your webhook URL into the file `slack-sink/application.properties`
 
 ???+ abstract "_/slack-sink/application.properties_"
 
@@ -267,7 +267,7 @@ This setup automatically sends notifications to Slack whenever a new comment tha
 
 ![image](images/image15.png)
 
-Create a new file named `slack-sink.yaml` and add the following content:
+Create a new file named `slack-sink/config/slack-sink.yaml` and add the following content:
 
 ???+ abstract "_slack-sink/config/slack-sink.yaml_"