refactor: volto customization for JS beginners

docs/volto_customization/blocks.md

@@ -21,7 +21,7 @@ Instead of shadowing components we can:
 Let us first change the View of the teaser block which we already have in volto core by changing the block-configuration.
 In our addon `volto-teaser-tutorial` we will step by step extend each component that we have in volto core.
 
-The most simple customization is the View of the Teaser. The volto core teaser block configration (in `omelette/src/config/Blocks.jsx`) looks like:
+The most simple customization is the View of the Teaser. The volto core teaser block configration (in `/frontend/core/packages/volto/src/config/Blocks.jsx`) looks like:
 
 ```js
   teaser: {
@@ -62,10 +62,9 @@ export default applyConfig;
 ```
 
 Of course we need to add our custom `MyTeaserView` component in our addon.
-From the root of the project that is `src/addon/volto-teaser-tutorial/src/components/Blocks/Teaser/View.jsx`:
+From the root of the project that is `packages/volto-teaser-tutorial/src/components/Blocks/Teaser/View.jsx`:
 
 ```jsx
-import React from "react";
 import TeaserBody from "@plone/volto/components/manage/Blocks/Teaser/Body";
 import { withBlockExtensions } from "@plone/volto/helpers";
 

docs/volto_customization/custom_block.md

@@ -9,9 +9,9 @@ myst:
 
 # Volto Weather Block (custom block)
 
-Let's create a volto block that will display weather information for Eibar. For this we can use <a target="_blank" href="https://open-meteo.com/">Open-Meteo API</a>. Open-Meteo is an open-source weather API and offers free access for non-commercial use. No API key required.
+Let's create a volto block that will display weather information for Brasilia. For this we can use <a target="_blank" href="https://open-meteo.com/">Open-Meteo API</a>. Open-Meteo is an open-source weather API and offers free access for non-commercial use. No API key required.
 
-Creating a basic block in Volto involves several steps. Below, I'll outline the steps to create a Volto block that displays the weather forecast in Eibar.
+Creating a basic block in Volto involves several steps. Below, I'll outline the steps to create a Volto block that displays the weather forecast in Brasilia.
 
 1. **Setup Your Volto Project:** If you haven't already, set up a Volto project. You can use the instructions presented in [Installation -> Bootstrap a new Volto project](installation.md) section.
 
@@ -47,7 +47,7 @@ export const weatherBlockSchema = (props) => {
       location: {
         title: "Location",
         description:
-          "Enter the name of the location for which you want to display the weather (e.g., Eibar, Basque Country).",
+          "Enter the name of the location for which you want to display the weather (e.g., Brasilia, Brazil).",
         widget: "text",
       },
     },
@@ -65,7 +65,7 @@ import React, { useEffect, useState } from "react";
 
 const View = (props) => {
   const { data = {} } = props;
-  const location = data.location || "Eibar, Basque Country";
+  const location = data.location || "Brasilia, Brazil";
 
   const [weatherData, setWeatherData] = useState(null);
   useEffect(() => {

docs/volto_customization/extending_teasers.md

@@ -7,7 +7,7 @@ myst:
     "keywords": "Volto, Block, Variations"
 ---
 
-# Extending Teasers per type
+# Extending Teasers per type(Advanced topic)
 
 The basic scenario is to add variations to a block so that it can give control over its look and feel. Sometimes its also possible for a need to have control over individual elements. For instance, Consider we have a teaaser grid in which we can have a base variation of its layout. Then we would left with styling and adjusting individual teasers. This is where extensions come into play.