doc/guides/tutorial: Introduce code_folder for all tutorials

Author: AnnsAnns

doc/guides/c_tutorials/create_project.mdx

@@ -1,6 +1,7 @@
 ---
 title: Creating a Project
 description: This tutorial will guide you through creating a new project with a simple hello world program.
+code_folder: examples/guides/creating_project/
 ---
 import Contact from '@components/contact.astro';
 import GitSetup from '@components/gitsetup.mdx';
@@ -19,12 +20,9 @@ Now that Visual Studio Code is open, we create a new file called `main.c` and ad
 
 ```c
 #include <stdio.h>
-#include "ztimer.h"
 
 int main(void)
 {
-    ztimer_sleep(ZTIMER_SEC, 3);
-
     puts("Hello World!");
 
     return 0;
@@ -33,7 +31,7 @@ int main(void)
 
 ![The hello world program in Visual Studio Code](img/create_project/03_main_c.png)
 
-This program will print "Hello World!" to the console after sleeping for 3 seconds. We use the `ztimer_sleep` function to sleep for 3 seconds otherwise we will most likely miss the output before connecting to our device. This function is part of the `ztimer` module, which is part of RIOT. The `puts` function is part of the standard C library and is used to print a string to the console.
+This program will print "Hello World!" to the console when it is run. The `#include <stdio.h>` line includes the standard input/output library, which allows us to use the `puts` function to print to the console.
 
 ## Step 3: Creating the Makefile
 
@@ -54,9 +52,6 @@ RIOTBASE ?= $(CURDIR)/RIOT
 # development process:
 DEVELHELP ?= 1
 
-# This board requires a start sleep to actually catch the printed output
-USEMODULE += ztimer_sec
-
 # Change this to 0 show compiler invocation lines by default:
 QUIET ?= 1
 

doc/guides/c_tutorials/gpio.mdx

@@ -1,6 +1,7 @@
 ---
 title: GPIO & Real Boards
 description: This tutorial explains how to use GPIO in RIOT to control LEDs or read button presses.
+code_folder: examples/guides/gpio/
 ---
 
 import Contact from '@components/contact.astro';
@@ -100,6 +101,7 @@ gpio_mode_t led0_mode = GPIO_OUT;
 
 Now we can control the LED by first initializing the pin and then clearing or setting it.
 
+{/*<!--skip ci-->*/}
 ```c
 int main(void) {
   // Initialize the LED0 pin
@@ -117,10 +119,10 @@ This code will turn off the LED when the board starts which is quite boring,
 so let's make it blink by adding a delay and toggling the LED.
 
 ```c
-while (1) {
+  while (1) {
     gpio_toggle(led0);
     ztimer_sleep(ZTIMER_MSEC, 500);
-}
+  }
 ```
 
 ![The Code in Visual Studio Code](img/gpio/04_code.png)
@@ -144,11 +146,12 @@ that way we can drastically reduce the power consumption of the device.
 
 First we need to define the callback function that will be called when the button is pressed.
 
-```c
-// Define the LED0 pin and mode
+```c title="Define the LED0 pin and mode"
 gpio_t led1 = GPIO_PIN(1, 10);
 gpio_mode_t led1_mode = GPIO_OUT;
+```
 
+```c title="Define the button callback function"
 void button_callback (void *arg)
 {
     (void) arg; /* the argument is not used */
@@ -163,12 +166,39 @@ void button_callback (void *arg)
 
 Now we need to define the button pin and mode and initialize it.
 
-```c
-// Define the button pin and callback
+```c {1-2, 26-27}
+// Define the button pin
 gpio_t button = GPIO_PIN(1, 2);
 
+void button_callback (void *arg)
+{
+    (void) arg; /* the argument is not used */
+    if (!gpio_read(button)) {
+        gpio_set(led1);
+    }
+    else {
+        gpio_clear(led1);
+    }
+}
+
 int main(void) {
-    gpio_init_int(button, GPIO_IN_PU, GPIO_BOTH, button_callback, NULL);
+  // Initialize the LED0 pin
+  gpio_init(led0, led0_mode);
+  // Turn off the LED0 pin
+  gpio_clear(led0);
+
+  // Initialize the LED1 pin
+  gpio_init(led1, led1_mode);
+  // Turn off the LED1 pin
+  gpio_clear(led1);
+
+  // Initialize the button pin
+  gpio_init_int(button, GPIO_IN_PU, GPIO_BOTH, button_callback, NULL);
+
+  while (1) {
+    gpio_toggle(led0);
+    ztimer_sleep(ZTIMER_MSEC, 500);
+  }
 }
 ```
 

doc/guides/c_tutorials/img/create_project/03_main_c.png

@@ -1,6 +1,7 @@
 ---
 title: Sensors/Actuators using SAUL
 description: Learn how to use sensors and actuators with RIOT
+code_folder: examples/guides/saul/
 ---
 
 In the previous chapter we learned how to interact with the GPIO directly, but RIOT provides a more abstract way to interact with sensors and actuators. RIOT calls this the SAUL (Sensors/Actuators Abstraction Layer) system.
@@ -87,7 +88,6 @@ which then stores the result in a `phydat_t` struct we provide.
     // and store the result in the temperature variable
     // saul_reg_read returns the dimension of the data read (1 in this case)
     int dimension = saul_reg_read(temperature_sensor, &temperature);
-  }
 ```
 
 Once again, since C doesn't have exceptions, we need to check if the sensor was read correctly.

doc/guides/c_tutorials/img/create_project/04_makefile.png

@@ -1,6 +1,7 @@
 ---
 title: Shell Commands
 description: This tutorial explains how to use the RIOT shell.
+code_folder: examples/guides/shell/
 ---
 
 The shell is a powerful tool in RIOT that allows you to interact with your application at runtime.
@@ -22,9 +23,11 @@ This line tells the build system to include the shell module in our application.
 
 Now we can start the shell in our main function by calling the `shell_init` function. Go into your `main.c` file and include the following code:
 
-```c
+```c title="The include so we can use the shell"
 #include "shell.h"
+```
 
+```c title="The main function"
 int main(void)
 {
     // Buffer to store command line input
@@ -57,9 +60,11 @@ RIOT provides a set of macros to make this process easier.
 
 Let's create a simple shell command that echoes back the input. Go into your `main.c` file and include the following code:
 
-```c
+```c title="The include so we can print to the console"
 #include <stdio.h>
+```
 
+```c title="The function that implements the echo command"
 int echo_command(int argc, char **argv)
 {
     for (int i = 1; i < argc; i++) {
@@ -75,10 +80,8 @@ This function takes two arguments: `argc` and `argv`. `argc` is the number of ar
 
 Now all that is left is to register the command with the shell. Go back to your `main.c` file and include the following code _outside_ of the `main` function:
 
-```c
-SHELL_COMMAND(echo,
-              "Echoes back the input",
-              echo_command);
+```c title="Register the command with the shell"
+SHELL_COMMAND(echo,"Echo a message", echo_command);
 ```
 
 This macro takes three arguments: the name of the command, a short description of the command, and the function that implements the command.

doc/guides/c_tutorials/saul.mdx renamed to doc/guides/c_tutorials/saul.md

@@ -1,6 +1,7 @@
 ---
 title: Threads
 description: This tutorial explains how to use threads in RIOT.
+code_folder: examples/guides/threads/
 ---
 
 import Contact from '@components/contact.astro';
@@ -53,7 +54,7 @@ Lastly, we need to actually start the thread. Go into your `main` function and i
 int main(void) {
     thread_create(my_thread_stack, sizeof(my_thread_stack),
             THREAD_PRIORITY_MAIN - 1, 0, my_first_thread, NULL,
-            "My first thread");
+            "My first thread"); 
 
     puts("Hello, from the main thread!");
 }

doc/guides/c_tutorials/shell.mdx renamed to doc/guides/c_tutorials/shell.md

@@ -1,6 +1,7 @@
 ---
 title: Timers and Callbacks
 description: This tutorial explains how to use timers and callbacs in RIOT.
+code_folder: examples/guides/timers/
 ---
 
 Timers and interrupts are essential concepts in embedded systems programming. In this tutorial, we will take a look at how to use timers and interrupts in RIOT.
@@ -47,7 +48,6 @@ int main(void)
         .callback = timer_callback,
         .arg = "3 seconds have passed!"
     };
-}
 ```
 
 This code creates a timer and initializes it with the callback function we created earlier and a message that will be printed when the timer expires.
@@ -71,9 +71,10 @@ instead of constantly checking if the timer has expired. For example, lets use o
 ![The output](img/timers/01_output.png)
 
 ```c
-ztimer_sleep(ZTIMER_SEC, 5);
+    // Sleep for 5 seconds
+    ztimer_sleep(ZTIMER_SEC, 5);
 
-puts("5 seconds have passed!");
+    puts("5 seconds have passed!");
 ```
 
 ## Conclusion