+ Here is some +
Heading 3
+Heading 3
+Heading 3
+ +Heading 1
+Heading 2
+Heading 4
+``` --- -Create humorous headings. +```html +Heading 6
+ +Heading 1
+Heading 1
+ +Heading 5
+ +Heading 2
+Heading 2
+``` --- -Place `h6` headings at the beginning of your webpage. +```html +Heading 6
+Heading 5
+Heading 4
+Heading 3
+Heading 2
+Heading 1
+``` #### --answer-- -Put headings in hierarchical order. +```html +Heading 1
+Heading 2
+Heading 3
+Heading 4
+Heading 5
+Heading 6
+``` ### --question-- @@ -113,89 +146,91 @@ alt=""
#### --text--
-What is WAI-ARIA?
+What does WAI-ARIA stand for?
#### --distractors--
-WAI-ARIA is a programming language specifically designed for creating animated web graphics.
+Website Accessible Initiative - Accessible Rust Internet Applications
---
-WAI-ARIA is a set of guidelines for making websites more visually appealing and colorful.
+Web Anchor Initiative - Anchor Rich Internet Applications
---
-WAI-ARIA is a tool for optimizing website loading speeds and server performance.
+Web Accessibility Initial - Accessible Ready Internet Applications
#### --answer--
-WAI-ARIA is a set of standardized practices that helps make online content more accessible to people with disabilities.
+Web Accessibility Initiative - Accessible Rich Internet Applications
### --question--
#### --text--
-What is the function of the `hidden` attribute?
+What is the role of the `aria-hidden` attribute?
#### --distractors--
-To shrink the focused elements.
+This attribute is used to hide elements only for users with visual impairments.
---
-To add tabs.
+This attribute is used to hide and add label text for an element.
---
-To hide an HTML form.
+This attribute is used to hide an element only to keyboard users.
#### --answer--
-To prevent an element from being rendered.
+This attribute is used to hide an element from people using assistive technologies.
### --question--
#### --text--
-What is the function of the `tabindex` attribute?
+Which attribute makes elements focusable and defines the relative order in which they are navigated using the keyboard?
#### --distractors--
-To change the color of focused elements.
+`keyboardindex`
---
-To shrink the focused elements.
+`tabbingindex`
---
-To add tabs.
+`indextab`
#### --answer--
-To control keyboard navigation order and allow programmatic focus on elements that aren't accessible via keyboard.
+`tabindex`
### --question--
#### --text--
-Which of the following is a best practice for creating accessible data tables?
+Why is it a good practice to include the `caption` element inside an HTML table?
#### --distractors--
-Add a caption by using the `+ Let me tell you about my fantastic holiday in Paris. + I saw the impressive Eiffel Tower up close! +
+``` + +Most elements have semantic meaning. The `div` element is one of the very few that does not. But why is this important? + +First and foremost, using proper semantic HTML will ensure the best experience for users with assistive technology like screen readers. But also, semantic HTML can improve your search rankings. This is referred to as search engine optimization, or SEO. + +Finally, using correct semantic elements can improve your development experience. Rather than having to sift through a bunch of developments to find your navigation bar, you can edit the `nav` element directly and know what you're changing. Throughout this section, you will learn more about these topics, how to use semantic elements, and why semantic HTML is so important. + # --questions-- ## --text-- diff --git a/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672985445d7da807c6b4f406.md b/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672985445d7da807c6b4f406.md index 9d0fab401d..9e9b61316c 100644 --- a/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672985445d7da807c6b4f406.md +++ b/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672985445d7da807c6b4f406.md @@ -10,6 +10,61 @@ dashedName: why-is-it-important-to-have-good-structural-hierarchy Watch the lecture video and answer the questions below. +# --transcript-- + +Why is it important to have good structural hierarchy? + +The most important aspect of creating a structural hierarchy is the proper use of heading elements. Heading elements are numbered as `h1`, `h2`, `h3`, and so on. These numbers represent the heading level for that element. + +Much like a text document, you do not want to use heading levels in the incorrect order. Your `h1` element is your top-level heading. You will rarely have more than one of these on a page, and it should typically come before all of your content. + +Your `h2` element is your subheading. It should always come after your `h1` and might come after some introductory text. Unlike an `h1` element, you can have multiple `h2` elements on your page. You'll often do this to delineate different sections of content. + +Following the pattern, your `h3` element should always come after an `h2` element. That is, you should never skip directly from `h1` to `h3`. You can, however, have multiple heading elements at the same level. For example, this code is correct: + +```html +
+
+
+
+```
+
+But this code would not be correct, because `h3` comes before `h2`:
+
+```html
+freeCodeCamp
+Learn Front-End Development
+Learn Back-End Development
+
+
+
+
+```
+
+It may be tempting to use a specific heading element because of its styling, such as `h1` for large text:
+
+```html
+freeCodeCamp
+Learn Front-End Development
+Learn Back-End Development
+HTML is awesome.
++ This text has a normal font size. + This text is larger. +
+``` + +The first part has normal sized text, while the second part enclosed within the `big` element will be displayed in a larger font size. In the browser, you would see the text within the `big` element looks larger compared to the surrounding text. + +However, remember that font size should always be set with CSS, so you should not use this element in modern HTML. + +These were examples of presentational HTML elements. But all of them are deprecated and no longer recommended. So what should you use instead? Let's see. + +Semantic HTML is now the recommended practice. It describes the content of the elements, so it's much easier to read, understand, and maintain. + +Search engines can easily understand your website when you use semantic HTML. It's also helpful for accessibility purposes, because screen readers need semantic information to describe what's on the web page. + +Examples of semantic HTML elements include: + +- The `header` element for defining the header of the document, or section. +- The navigation section element, `nav`, for sections with navigation links. +- The `section` element for grouping related information. +- The `figure` element for illustrations and diagrams. + +This is an example of a `header` element that contains a navigation section element: + +```html +There is a certain je ne sais quoi in the air.
+``` + +The `lang` attribute inside the open `` tag is used to specify the language of the content. In this case, the language would be French. The `i` element does not indicate if the text is important or not, it only shows that it's somehow different from the surrounding text. + +If you do need to emphasize the importance of the text, you can use a similar semantic element called the emphasis element, `em`. This is usually recommended if you need to provide more context. You should use this element for parts of the text that require a special emphasis compared to surrounding text. It's usually limited to only a few words, because it can alter the meaning of the sentence. + +This is an example of the emphasis element within a paragraph: + +```html ++ Never give up on your dreams. +
+``` + +You can see the sentence `Never give up on your dreams`. Notice that the word `your` will be emphasized, because it's inside this element. In the browser you would see the word `your` is italicized to tell readers that this is an important word in the sentence. + +Even if it looks the same when the text was inside the idiomatic text element, the semantic emphasis element conveys its meaning and importance behind the scenes. + +It's important to know that these elements should not be used for presentational purposes only. If you need to display the text in italics, but the text doesn't have a special purpose, style, or meaning in the paragraph, you should use CSS instead. + # --questions-- ## --text-- diff --git a/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672995ac85fd943657c2ede5.md b/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672995ac85fd943657c2ede5.md index dace91f968..e151885c2d 100644 --- a/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672995ac85fd943657c2ede5.md +++ b/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672995ac85fd943657c2ede5.md @@ -10,6 +10,39 @@ dashedName: when-should-you-use-the-strong-element-over-the-bring-attention-to-e Watch the lecture video and answer the questions below. +# --transcript-- + +When should you use the `strong` element over the "bring attention to" element? + +The "bring attention to" element, `b`, is commonly used to highlight keywords in summaries, or product names in reviews. Usually, browsers display this text in boldface. Here's an example using the `b` element to highlight product names in this review: + +```html ++ We tested several products, including the SuperSound 3000 for audio + quality, the QuickCharge Pro for fast charging, and the + EcoClean Vacuum for cleaning. The first two performed well, but the + EcoClean Vacuum did not meet expectations. +
+``` + +The browser renders these parts of the text as bold text. This visual emphasis will draw readers attention to the product names. + +If you need to emphasize the importance of the text, you should use the `strong` element instead of the `b` element. + +`strong` is a semantic HTML element that emphasizes text that is crucial, or urgent. This is an example where the `strong` element is used to label a very important warning about the potential allergic reactions that customers may have to a product: + +```html ++ Warning: This product may cause allergic reactions. +
+``` + +The `strong` element communicates that sense of urgency. + +Visually both are very similar, because they are both rendered as bold by default. But their meanings are quite different. While the "bring attention to" element only draws attention to the text, without indicating the higher level of importance, the `strong` element does more than that. It conveys a sense of importance, or urgency. This is their main difference. + +To choose between them, consider the purpose of the text and its importance within the surrounding content. + # --questions-- ## --text-- diff --git a/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672995bda6c67e369aaf8588.md b/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672995bda6c67e369aaf8588.md index 732248d55e..81b111ada3 100644 --- a/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672995bda6c67e369aaf8588.md +++ b/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672995bda6c67e369aaf8588.md @@ -10,6 +10,52 @@ dashedName: what-are-description-lists Watch the lecture video and answer the questions below. +# --transcript-- + +What are description lists, and when should you use them? + +Description lists are perfect for presenting terms and definitions in an organized and easy-to-read format, like in a glossary, or real dictionary, where you can find words with their corresponding definitions. + +This is an example of a description list in HTML with two terms and their corresponding details: + +```html +-
+
- HTML +
- HyperText Markup Language +
- CSS +
- Cascading Style Sheets +
-
+
- Flour +
- 2 cups +
- Sugar +
- 1/2 cup +
+ "Can you imagine what it would be like to be a successful developer? To have built software systems that people rely upon?" ++``` + +This element has a `cite` attribute. The value of the `cite` attribute is the URL of the source. While this attribute doesn't change the presentation of the block quote, it's very helpful for giving screen readers and search engines more information about the quote. In the browser, you'll see that the text is slightly indented. + +If you want to start and end the block quote with quotation marks, you may need to write them explicitly within the text. You can write the text directly within the block quotation element, like I just did, or wrap it within one or more paragraph elements. This is helpful when the text has multiple paragraphs, but you want to keep them within the same block quote. Here's an example with four paragraphs: + +```html +
++``` + +All the paragraphs are contained within the same block quotation element, so they are part of the same quotation. You can see that the element has a `cite` attribute with the URL of the source. In the browser, you'll see that the four paragraphs are aligned relative to each other, but they are indented relative to their container. + +So far I've been using the `cite` attribute to attribute the source of the quotation, but the attribute doesn't really show the source to the user. It only works behind the scenes. + +If you want to attribute the source visually, you can add a citation element, `cite`, outside of the block quotation element. This is different from the `cite` attribute. The citation element is an HTML element that you can use to mark up the title of a referenced creative work like a book article, song, film, website, or research paper. Here's an example: + +```html +Build your projects. Show them to your friends. Build projects for your friends.
+Build your network. Help the people you meet along the way. What goes around comes around. You'll get what's coming to you.
+It is not too late. Life is long.
+You will look back on this moment years from now and be glad you made a move.
+
+
+```
+
+The block quotation element contains quoted text. Below the element you can see a paragraph element with the name of the author, followed by a citation element. The citation element contains the title of the book where the quotation came from.
+
+If you go to the browser, now the source will be clearly visible and see that the quote comes from a book written by Quincy Larson. The title of this book is `How to Learn to Code and Get a Developer Job`.
+
+You should use block quotes like these for long quotations from other sources. But sometimes you will only need to quote a few words within a larger paragraph.
+
+That's exactly what the inline quotation element is for. It's for short inline quotations from other sources. Most modern browsers will add quotation marks around the inline quote automatically when you use this element. This is an example:
+
+```html
++ Can you imagine what it would be like to be a successful developer? To have built software systems that people rely upon? ++
—Quincy Larson, How to Learn to Code and Get a Developer Job [Full Book].
+
+ As Quincy Larson said,
+
+ Momentum is everything.
+
+
HTML is the foundation of the web.
+``` + +The acronym HTML is within an abbreviation element. In the browser, you'll see that nothing has really changed. It still looks like normal text. The abbreviation element is providing helpful context behind the scenes, but users will still see the acronym as normal text. + +If you want to help users understand what this acronym means, you can show its full form with the `title` attribute. + +The `title` attribute is optional, but if you decide to include it, it must be a human readable description of the abbreviation, or acronym. + +Let's take the same example as before, but add the `title` attribute. It will be `HyperText Markup Language`, the expanded form of the acronym: + +```html +HTML is the foundation of the web.
+``` + +Usually, the style of the abbreviation element will change when you add this attribute. The specific style will depend on the browser. Some browsers may display a dotted underline, while others may convert the contents to small caps, or even assign certain default styles, such us a dotted underline. When the user hovers over the acronym with the mouse, the full form is displayed as a tooltip. + +While you don't necessarily need to use the abbreviation element for every abbreviation, or acronym on your web page, it's recommended for those that might be unclear and those that might need additional context. + +You should use your best judgment to find the right balance between information and presentation to avoid cluttering the text while being clear and concise. + # --questions-- ## --text-- diff --git a/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672995e43674fb3775b9ec5d.md b/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672995e43674fb3775b9ec5d.md index b74354d3b9..ae9ccfb305 100644 --- a/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672995e43674fb3775b9ec5d.md +++ b/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672995e43674fb3775b9ec5d.md @@ -10,6 +10,37 @@ dashedName: how-do-you-display-addresses-in-html Watch the lecture video and answer the questions below. +# --transcript-- + +How do you display addresses in HTML? + +The contact address element is used to represent contact information for a section on a web page. The `address` element is versatile and can be used for business pages, author pages, personal sites, and more. + +When it comes to building out your website's contact sections, you should use the semantic `address` element over a generic element like a `div`. + +Here is an example of using the `address` element for a company contact page: + +```html + +Company Name
+
+ 1234 Elm Street
+ Springfield, IL 62701
+ United States
+
Phone: +1 (555) 555-5555
+Email: contact@company.com
+ +``` + +In this example, there is the company name, physical address, phone, and email information. For the physical address, the line break element, `br`, is used to show the division between the street name, city, and country. + +For the phone number, we have an anchor element with the `href` value set for telephone numbers. The `tel:+` value inside the `href` attribute creates a clickable link to initiate a phone call on certain devices that support that. + +For the email address, another anchor element is used with the `href` value set to a `mailto` link. `mailto` links are used in HTML documents to allow users to open a new email within their preferred email client. + +One of the downsides of using a `mailto` link is that users often perceive it as spam. Unfortunately, a lot of spammers will use this option to send emails to users. So just keep that in mind when you're using it. + # --questions-- ## --text-- diff --git a/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672995f16ed97837b365a9f6.md b/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672995f16ed97837b365a9f6.md index 516dfb03e3..332dfa47a1 100644 --- a/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672995f16ed97837b365a9f6.md +++ b/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672995f16ed97837b365a9f6.md @@ -10,6 +10,40 @@ dashedName: how-do-you-display-times-and-dates-in-html Watch the lecture video and answer the questions below. +# --transcript-- + +How do you display times and dates in HTML? + +The `time` element is used to represent a specific moment in time. + +Here is an example using the `time` element to represent twenty hundred hours, or eight PM in the evening. + +```html +The reservations are for
+``` + +The `datetime` attribute is used to translate dates and times into a machine-readable format. + +This is important, because it helps with search engine results and helps the browser process date and time information more effectively. + +The value for the `datetime` attribute must be either a valid year, valid month, valid time, local date, global date, or valid duration string. + +Here is another example of using the time element to represent a particular date: + +```html ++ The graduation will be on +
+``` + +The value for the `datetime` attribute is in the ISO 8601 format. ISO 8601 is an international standard to represent dates and times. + +The first part of that value is the year, month and day. The capital T in the value is a separator between the date and time. + +The fifteen hundred hours would be three PM in the afternoon. + +Whenever you need to represent events, publication dates, or appointments, it is best to use the `time` element. + # --questions-- ## --text-- diff --git a/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672995ffdfd2f337f5f215f8.md b/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672995ffdfd2f337f5f215f8.md index 1ecd98c26e..735a031bf3 100644 --- a/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672995ffdfd2f337f5f215f8.md +++ b/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/672995ffdfd2f337f5f215f8.md @@ -10,11 +10,49 @@ dashedName: how-do-you-display-mathematical-equations-and-chemical-formulas-in-h Watch the lecture video and answer the questions below. +# --transcript-- + +How do you display mathematical equations and chemical formulas in HTML? + +The superscript element is used to display a piece of text as a superscript. A superscript is a symbol or letter printed above the normal line of text. + +Here is an example using the superscript element to illustrate exponents: + +```html +22 (2 squared) is 4.
+``` + +In this example, the number 2 is wrapped in `sup` tags to represent the superscript inside the paragraph. In the browser, you would see that the second number 2 is smaller and slightly higher than the first number 2. + +Common use cases for the superscript element would include exponents, superior lettering, and ordinal numbers. Here is an example using the superscript element for superior lettering: + +```html ++ Monseigneur is often written as Mgr. +
+``` + +Superior lettering refers to letters written in superscript, usually to indicate abbreviations. The letters `g` and `r` are wrapped inside superscript tags to illustrate the abbreviation in this example. + +It is important to note that the superscript element should only be used for typographical reasons. If you want style a piece of text with a raised baseline, then you should use CSS instead of the superscript element. + +To represent chemical equations inside HTML, you would use the subscript element. This element uses a subscript which displays a lowered baseline using smaller text. + +Here is an example of using the subscript element to show the chemical representation for carbon dioxide. + +```html +CO2
+``` + +The number two is wrapped inside `sub` tags to illustrate that the character should be a subscript. + +Common uses cases for the subscript element include chemical formulas, foot notes, and variable subscripts. + # --questions-- ## --text-- -What is the primary use of the `superscript` element in HTML? +What is the primary use of the superscript element in HTML? ## --answers-- @@ -22,7 +60,7 @@ To display text in a different color. ### --feedback-- -Review the beginning of the video where the `superscript` element is discussed. +Review the beginning of the video where the superscript element is discussed. --- @@ -30,7 +68,7 @@ To show text in a smaller font size. ### --feedback-- -Review the beginning of the video where the `superscript` element is discussed. +Review the beginning of the video where the superscript element is discussed. --- @@ -42,7 +80,7 @@ To underline text. ### --feedback-- -Review the beginning of the video where the `superscript` element is discussed. +Review the beginning of the video where the superscript element is discussed. ## --video-solution-- @@ -50,7 +88,7 @@ Review the beginning of the video where the `superscript` element is discussed. ## --text-- -Which of the following is an example of using the `superscript` element correctly? +Which of the following is an example of using the superscript element correctly? ## --answers-- @@ -86,7 +124,7 @@ The example should represent an exponent with a number displayed above the norma ## --text-- -What should be used instead of the `superscript` element if you want to style text with a raised baseline for typographical reasons? +What should be used instead of the superscript element if you want to style text with a raised baseline for typographical reasons? ## --answers-- diff --git a/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/6729960ed6e2ca3825940e97.md b/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/6729960ed6e2ca3825940e97.md index a1906a3977..5f7db9d298 100644 --- a/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/6729960ed6e2ca3825940e97.md +++ b/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/6729960ed6e2ca3825940e97.md @@ -10,6 +10,47 @@ dashedName: how-do-you-represent-computer-code-in-html Watch the lecture video and answer the questions below. +# --transcript-- + +How do you represent computer code in HTML? + +The inline code element is used to represent short snippets of code inside text. Common use cases for the code element would be for technical articles and documentation pages. + +Here is an example of using the `code` element to show a CSS code snippet: + +```html +
+ To set the text color to blue in CSS, use the following code:
+ color: blue;
+
` tags, it communicates to the browser that the text is a piece of inline code.
+
+The browser will apply default styles for content inside of the `code` element. The default styling is a monospaced font.
+
+The `code` element is meant to represent a single line of code. If you want to represent multiple lines of code, you will need to place a `code` element inside a preformatted text element.
+
+The preformatted text element is used to represent preformatted text. Here is an example of using the preformatted text element to show a CSS declaration:
+
+```html
+
+
+ body {
+ color: red;
+ }
+
+
+```
+
+When using the `pre` element, you will need to be mindful of spacing because it will display exactly as written inside the HTML document.
+
+In the browser, you will see that the code is indented several spaces to the right. If you were to change the indentation in the code example, then you will see a difference in indentation on the screen.
+
+When it comes to including code examples inside your HTML document, you should use the `code` element for short inline examples.
+
+If you need to display longer code snippets, then you will need to use the `pre` and `code` elements.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/6729963b1ab11638753cf082.md b/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/6729963b1ab11638753cf082.md
index 74e222cd9f..83f2798fc3 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/6729963b1ab11638753cf082.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-importance-of-semantic-html/6729963b1ab11638753cf082.md
@@ -10,6 +10,51 @@ dashedName: what-are-the-u-s-and-ruby-elements-used-for
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What are the `u`, `s`, and `ruby` elements used for, and how do they work?
+
+The unarticulated annotation element, or `u` element for short, is used to represent inline text that has non-textual annotation applied.
+
+Here is an example of using the `u` element to highlight various spelling errors:
+
+```html
+
+ You can use the unarticulated annotation element to highlight
+ inccccort spling issses.
+
+```
+
+In the example, the words `incorrect`, `spelling`, and `issues` are misspelled. The default styling for the `u` element is a black underline underneath the text.
+
+In HTML4, the `u` element was used for styling purposes. But in HTML5, the `u` element should only be used to indicate that text has non-textual annotation applied.
+
+If you want to style a piece of text with a underline, then you should use CSS instead of HTML.
+
+The strikethrough element, or `s` element for short, should be used to represent when text is no longer accurate or relevant. Here is an example of using the `s` element to show the cancellation of an activity:
+
+```html
+Tomorrow's hike will be meeting at noon.
+
+Due to unforeseen weather conditions, the hike has been cancelled.
+```
+
+In this example, the first sentence is crossed out because the hike was cancelled due to weather reasons.
+
+The `s` element should never be used to just to show changes to a document. More appropriate elements in that case would be the deleted text element and the inserted text element.
+
+The `ruby` element represents small text shown above or below the main text. It is typically used to show the pronunciation of East Asian characters. Here is the `ruby` element example from the MDN web docs page:
+
+```html
+ 明日
+```
+
+The `rp` element, or ruby fallback parenthesis element, is used as a fallback for browsers lacking support for displaying ruby annotations.
+
+The `rt` element, or ruby text element, is used to indicate text for the ruby annotation. This text is usually used for pronunciation, or translation details in East Asian typography.
+
+While the `ruby` element can be used for other types of annotations, the most common use case is for East Asian typography.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672aa578a2129554d4675049.md b/curriculum/challenges/german/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672aa578a2129554d4675049.md
index 96d642737c..ec7e5a02d0 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672aa578a2129554d4675049.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672aa578a2129554d4675049.md
@@ -10,6 +10,44 @@ dashedName: what-are-the-basic-parts-of-a-computer
Watch the video lecture and answer the questions below.
+# --transcript--
+
+What are the basic parts of a computer?
+
+Computers are very powerful machines that perform a variety of tasks like writing documents, playing games, and browsing the internet.
+
+As a developer, it is important to understand the basic inner workings of a computer.
+
+The first major component of a computer would be the motherboard. The motherboard holds all of the memory, connectors, and hard drives that are needed to run the computer. It serves as the main circuit board for the computer.
+
+Inside the computer case of the motherboard, you will find the CPU which stands for Central Processing Unit. The CPU is a processor that is responsible for executing instructions and performing calculations. It is often referred to as the brain of the computer.
+
+The CPU is a small square with a chip that goes into the motherboard's CPU socket. A socket is a place where the CPU is inserted. The CPU processor speed is measured in gigahertz (GHz) and mega-hertz (MHz). Gigahertz is a billion cycles per second and mega-hertz is a million cycles per second.
+
+The next critical component of a computer would be the system's short term memory. This is known as RAM or Random Access Memory. RAM is a temporary storage location for the computer's CPU. Anytime the computer needs to access data quickly, it will use RAM.
+
+The more RAM you have on your computer, the faster it will run and the more programs you can run at the same time. If you are running low on RAM, your computer will run slower and you will notice the difference in performance.
+
+It is important to note that RAM is volatile memory. This means that it is lost when the computer is turned off. This is why it is important to save your work on your computer.
+
+When you do save your files, they are stored on the hard drive. The hard disk drive, or HDD, is a permanent storage location that is used to store data even when the computer is turned off. This is where all of your files and software are stored.
+
+The hard drive is made up of a spinning platter and an arm. The platter is where the data is stored and the arm is used to read and write data to the platter. When you have a faster hard drive, your computer will boot up faster and your programs will run faster.
+
+Another type of data storage would be the Solid State Drive, or SSD for short. SSD is non volatile flash memory and can be used in place of a hard drive. SSDs are faster and smaller than hard drives but hard drives are cheaper and have more storage capacity.
+
+Another key component of a computer is the power supply unit, or PSU. The PSU is responsible for converting the electricity from the wall outlet into a form that the computer can use. It sends the power from the outlet to the motherboard, CPU, and other components of the computer.
+
+Another key component would be the expansion cards. These are cards that are inserted into the motherboard to add additional functionality to the computer. Examples of expansion cards would be the video card, sound card, and network card.
+
+The video card, also known as the Graphics Processing Unit or GPU, is responsible for rendering visuals on the computer screen.
+
+The sound card is responsible for playing sound on the computer speakers.
+
+The network card is responsible for connecting the computer to the internet.
+
+Even though there are many more parts to the computer, these are some basic parts that you should familiarize yourself with.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab82c1a9bbd0e3aabc39d.md b/curriculum/challenges/german/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab82c1a9bbd0e3aabc39d.md
index 91a1e84380..d70561820e 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab82c1a9bbd0e3aabc39d.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab82c1a9bbd0e3aabc39d.md
@@ -10,6 +10,30 @@ dashedName: how-to-effectively-work-with-your-keyboard-mouse-and-other-pointing-
Watch the lecture video and answer the questions below.
+# --transcript--
+
+How can you effectively work with your keyboard, mouse, and other pointing devices?
+
+Many of you have been used to working with your keyboard and mouse for years on end for a variety of activities like gaming, performing tasks for work, or surfing the web.
+
+But prolonged misuse of these devices can lead to serious health problems down the road.
+
+In this lecture video, we will cover ways to work with your computer’s keyboard and mouse in healthy ways.
+
+The first tip is to be mindful of the mouse grip. When working on serious tasks for work or during intense gaming moments, you may tend to grip the mouse too hard. However, this can lead to serious hand and wrist issues. To prevent this, you want to make sure to hold the mouse gently and keep your fingers nice and relaxed.
+
+The second tip is to consider using an ergonomic keyboard and mouse. These tools are designed to reduce wrist strain by keeping your hands in a more natural position.
+
+While prices for these devices can vary and may be a costly purchase for your current budget, they can be a good investment in your overall long-term health. So, you might consider starting to research an ergonomic keyboard and mouse to use.
+
+Another tip is to keep your mouse the same height as your keyboard. You don't want to have to reach up or down to use the mouse, as this can strain your wrist and arm muscles over time.
+
+You also want to be mindful of your overall posture when sitting at the computer for hours on end. Being slouched over your computer and putting your wrist in an unnatural position at the keyboard will lead to long-term health issues. So, you want to make sure to sit up straight when working at your computer and maintain a healthy and natural wrist position.
+
+The last tip would be to use keyboard shortcuts whenever possible to help minimize typing. There are dozens of shortcuts available for tasks such as navigating the web, navigating around your operating system, working within a code editor, and more. So, it’s best to research some of these keyboard shortcuts and and start incorporating them into your daily computer usage.
+
+As you continue using your mouse and keyboard for upcoming coding projects and other activities, remember to keep these health tips in mind.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab83c4297910eade53c2e.md b/curriculum/challenges/german/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab83c4297910eade53c2e.md
index 515d189cc8..5efd6cf9a7 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab83c4297910eade53c2e.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab83c4297910eade53c2e.md
@@ -10,6 +10,32 @@ dashedName: what-are-the-different-types-of-internet-service-providers
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What are the different types of internet service providers?
+
+First, what is an internet service provider, or ISP? It’s a company that sells access to the global internet network, essentially. And they come in three different tiers.
+
+The first tier are the giant conglomerate companies, which have the infrastructure to handle most (if not all) of their network traffic independently.
+
+The second tier are the country-wide providers, which sometimes rent access to tier 1 networks but can stand fairly well on their own.
+
+The third tier are the small companies that primarily focus on providing internet to local markets, and rely on larger ISPs to provide their infrastructure.
+
+These providers will offer different types of connections as well.
+
+Fibre optic connections rely on glass or plastic fibres to transmit data via light, resulting in very high connection speeds and data exchange.
+
+Cable connections use the same infrastructure as a cable television provider, which often makes them readily available in many regions.
+
+DSL connections use the infrastructure that landline phone services use. Because of the prevalence of this infrastructure, DSL is available in areas where cable might not be. But it is also frequently a slower option.
+
+Dial-up also uses the phone lines, but requires exclusive connection (disabling the use of the line for phone purposes when connected to the internet). This is a much older technology that has fallen into disuse.
+
+Satellite connections use an array of satellites orbiting the earth to connect various devices across the world. And finally, similar to that, a 5G home internet provider uses the cell tower infrastructure to keep you online.
+
+And that should give you a basic rundown of what types of internet service providers and internet connections are out there!
+
# --questions--
## --text--
@@ -22,7 +48,7 @@ Giant conglomerate companies with independent infrastructure.
### --feedback--
-Oversight organisations may regulate ISPs, but are rarely ISPs themselves.
+Oversight organizations may regulate ISPs, but are rarely ISPs themselves.
---
@@ -30,7 +56,7 @@ Country-wide providers that may rent access to larger networks.
### --feedback--
-Oversight organisations may regulate ISPs, but are rarely ISPs themselves.
+Oversight organizations may regulate ISPs, but are rarely ISPs themselves.
---
@@ -38,11 +64,11 @@ Small companies focusing on local markets.
### --feedback--
-Oversight organisations may regulate ISPs, but are rarely ISPs themselves.
+Oversight organizations may regulate ISPs, but are rarely ISPs themselves.
---
-International organisations overseeing global internet access.
+International organizations overseeing global internet access.
## --video-solution--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab849aa1ef70eefd29364.md b/curriculum/challenges/german/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab849aa1ef70eefd29364.md
index 8e1b267afd..085ff16bd6 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab849aa1ef70eefd29364.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab849aa1ef70eefd29364.md
@@ -10,6 +10,36 @@ dashedName: what-are-safe-ways-to-sign-into-your-computer
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What are safe ways to sign into your computer?
+
+Many of you have being using computers for a while. But you might not have thought about the safest or most secure ways to sign into your computer.
+
+Whether you are using a Mac or PC, there are many ways to safely sign into your computer.
+
+The first thing you should do is to make sure that your computer is password protected.
+
+For Windows users, start by opening the Start menu and selecting Settings. From there, go to Accounts and then Sign-in options. You can then set up a password for your computer.
+
+*Note: If you encounter any difficulties or are using a different version of Windows, refer to the official Microsoft documentation or support resources for detailed instructions tailored to your specific version.*
+
+When creating your password, make sure it is a long and complex password. You can use a combination of letters, numbers and special characters to make it more secure.
+
+Choosing an easy password like `12345` or `password` is not a good idea. These are easy to guess and can be easily hacked.
+
+Also, do not use passwords based on personal information like your name, birthday, or address. Those are also easy for hackers to guess.
+
+When you create your password, it is also a good idea to setup two-factor authentication (2FA). 2FA serves as an extra layer of security and requires a second form of verification to ensure that the person trying to access the account is indeed the authorized user.
+
+If you are a Mac user, you can click on the Apple menu and then go to system settings. From there you can go to Users & Groups and set up a password for your computer.
+
+Some Mac computers come with a touch ID feature, which is often considered more secure than regular passwords. This feature allows you to sign into your computer using your fingerprint.
+
+For Windows users, the Windows Hello feature offers a more secure way to sign in. It uses biometric methods such as facial recognition or fingerprints for authentication, providing an alternative to traditional passwords.
+
+After you finish watching these set of lecture videos, I urge you to look into these additional security features and set them up on your computer so that you can keep your computer safe and secure.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab8573f32480f192aaae1.md b/curriculum/challenges/german/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab8573f32480f192aaae1.md
index 0aba68160a..22988e04c5 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab8573f32480f192aaae1.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab8573f32480f192aaae1.md
@@ -10,6 +10,54 @@ dashedName: what-are-the-different-types-of-tools-professional-developers-use
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What are the different types of tools professional developers use?
+
+Professional developers rely on a variety of tools to increase productivity and code quality. Let's learn about those tools, including the ones that seem very obvious.
+
+The first among the tools is computers. A computer is the primary development environment. It could be a heavy desktop or a portable laptop with either Windows, macOS, or Linux as the operating system.
+
+Professional developers often go for computers with fast processing power and plenty of RAM to handle resource-intensive tasks.
+
+After the computer is a program for writing and editing code right on that computer. That's a code editor or integrated development environment (IDE).
+
+IDEs like Visual Studio, IntelliJ IDEA, JetBrains, and PyCharm provide powerful features like code completion, debugging, and integrated terminal support.
+
+Visual Studio Code (VS Code) is essentially a code editor, but it also provides these functionalities with its rich extension library.
+
+Other code editors are Sublime Text, Atom, Notepad++, and Brackets.
+
+When you write code with code editors and IDEs, you need to track the changes you make to them. The tool that lets you track those changes is a version control system.
+
+Git is the most widely used version control system in the development community.
+
+Platforms like GitHub, GitLab, and Bitbucket provide cloud-based hosting services for your Git repositories. These platforms enable collaboration with other developers, allow you to work on multiple branches, and facilitate the merging of code changes.
+
+Package managers are another critical tool. They help developers simplify the process of adding, updating, and removing libraries and project dependencies.
+
+Examples of popular package managers are:
+
+* NPM, Yarn, and PNPM for JavaScript
+* PIP for Python
+* Composer for PHP
+* Maven for Java
+
+After writing code with different tools, developers test that code to make sure it's working as expected.
+
+For this, developers use testing frameworks like Cypress, Playwright, Selenium, and others. There are also language-specific testing frameworks. Examples are:
+
+* Jest for JavaScript
+* pytest for Python
+* JUnit for Java
+* PHPUnit for PHP
+
+You don't only need to test the code to make sure it's working as expected. You also need to test what the code looks like visually to the end users. Developers use web browsers for this.
+
+Modern browsers like Chrome, Firefox, Edge, and Safari offer developer tools for inspecting HTML, CSS, and JavaScript code. There are also tools for debugging and performance profiling.
+
+These tools help developers test and optimize their web applications across different browsers for the end users.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-user-centered-design/672bafd715f6ba77d57f3ec0.md b/curriculum/challenges/german/25-front-end-development/lecture-user-centered-design/672bafd715f6ba77d57f3ec0.md
index 6e345c61d7..a4c7750a8f 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-user-centered-design/672bafd715f6ba77d57f3ec0.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-user-centered-design/672bafd715f6ba77d57f3ec0.md
@@ -26,7 +26,7 @@ User research involves studying the people who use your product.
---
-To measure user needs, behaviours, and pain points.
+To measure user needs, behaviors, and pain points.
---
@@ -94,7 +94,7 @@ Functional requirements are important, while non-functional requirements are opt
### --feedback--
-The lecture mentions that requirements can be categorised into two types based on what they dictate about the application.
+The lecture mentions that requirements can be categorized into two types based on what they dictate about the application.
---
@@ -106,7 +106,7 @@ Functional requirements are set by stakeholders, while non-functional requiremen
### --feedback--
-The lecture mentions that requirements can be categorised into two types based on what they dictate about the application.
+The lecture mentions that requirements can be categorized into two types based on what they dictate about the application.
---
@@ -114,7 +114,7 @@ Functional requirements are static, while non-functional requirements change ove
### --feedback--
-The lecture mentions that requirements can be categorised into two types based on what they dictate about the application.
+The lecture mentions that requirements can be categorized into two types based on what they dictate about the application.
## --video-solution--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672aa6c9e379285acca5a2aa.md b/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672aa6c9e379285acca5a2aa.md
index 906f1f1cb1..6a70a954f8 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672aa6c9e379285acca5a2aa.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672aa6c9e379285acca5a2aa.md
@@ -10,6 +10,34 @@ dashedName: what-are-common-design-terms-to-help-you-communicate-with-designers
Watch the video lecture and answer the questions below.
+# --transcript--
+
+What are common design terms to help you communicate with designers?
+
+As a developer, you may need to work closely with designers. If you understand basic design terminology, you'll have a shared vocabulary and you'll be able to participate in the design process more actively. This can make your workflow more efficient and result in a better user experience.
+
+So let's dive in. We'll start with the term layout. Layout is how the visual elements are arranged on a page or screen to communicate a message. These elements may include text, images, and white space. The layout is like the blueprint of a design. Designers must consider the placement, size, and hierarchy of each element.
+
+The term that is closely related to layout is alignment. Alignment is how the elements are placed in relation to one another. Using alignment correctly is helpful for making the design look clean and organized. Designers create visual order by aligning elements along imaginary lines, edges, or a central point.
+
+Great. Now let's talk about composition. Composition is the art of arranging elements to create a harmonious design. It determines how elements like images, text, and shapes relate to each other and contribute to the design in an artistic way. While layout mostly focuses on the placement of the elements, composition also considers the artistic impact that this placement will have in the overall design.
+
+Composition is closely related to concepts of balance. Balance is how the visual weight is distributed within a composition. Designers aim to create an equilibrium through symmetrical or asymmetrical arrangements. A balanced design feels harmonious.
+
+Hierarchy is another important concept that you should know. Hierarchy establishes the order of importance of the elements in a design. It's about making sure the most important information is noticed first. You can implement a visual hierarchy with size, color, contrast, alignment, white space, and even typography.
+
+To create clear distinctions between the elements, you can use contrast. Contrast is helpful for guiding user attention to what you want to emphasize. You can do this through variations in color, size, shape, texture, or any other visual characteristic. Strong contrast is also helpful for improving readability.
+
+Another helpful term is white space. White Space, also known as "negative space", is the empty space in a design. It's the area surrounding the elements. You might be surprised to know that white space is not necessarily white. Actually, it can be space in any color or texture. Its purpose is to improve the readability and enhance the visual hierarchy of a design.
+
+These are general design concepts that you will find very often, but you may also find design terms that are more closely related to software development.
+
+The user interface, also known as UI, is how humans interact with computers. A user interface includes the visual and interactive elements that users can see on their screens, like icons, images, text, menus, links, and buttons.
+
+The user experience, also known as UX, is about how users feel when using a product or service. An application with a well-designed user experience is intuitive, easy to use, efficient, accessible, and enjoyable. The user interface plays a key role in making the user experience as easy and enjoyable as possible, so they are very closely related.
+
+These are some of the common terms that you should know to communicate with designers. With this knowledge, now you can take a more active role in the design process.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baa97f2990e6631d522e7.md b/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baa97f2990e6631d522e7.md
index edb9ff819c..8c2a153704 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baa97f2990e6631d522e7.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baa97f2990e6631d522e7.md
@@ -10,6 +10,38 @@ dashedName: how-do-you-create-good-background-and-foreground-contrast-in-your-de
Watch the lecture video and answer the questions below.
+# --transcript--
+
+How do you create good background and foreground contrast in your designs?
+
+First, you may need to familiarize yourself with contrast. Contrast is the difference between two colors - or how easy it is to tell them apart.
+
+Colors with a higher contrast will be more visually distinct, whereas colors with a lower contrast will be more visually similar. For example, black and white have a very high contrast ratio. Whereas light blue and light purple have less of a contrast.
+
+Of course, in these examples the distinction might be made clearer because of the layout. But what about applying these colors to text? You can have the high contrast black text on a white background. And the low contrast purple text on a blue background.
+
+But how do you determine what is a "good enough" contrast? You can't base it solely on how the text looks to you, as every user will have a different experience. Thankfully, the Web Content Accessibility Guidelines, or WCAG, provide a standard for this.
+
+Text with a contrast ratio of 4.5:1 is considered the AA standard, which is the bare minimum you should follow to be accessible to most users. Text with a contrast ratio of 7:1 is considered the AAA standard, and ensures the best level of accessibility.
+
+There are a number of websites that can check the contrast ratio between two colors, but most browsers will allow you to do this directly in the developer tools on your website.
+
+Let's open the developer tools and inspect the text elements of the example site.
+
+The black text on a white background has a contrast ratio of 21:1, which more than meets the AAA standard. The purple text on a blue background, however, has a contrast ratio of 1.48:1, which does not even meet the AA standard.
+
+How can you fix this? Well, there are three aspects that impact the contrast ratio.
+
+The first is the hue, which represents the general color type, like red, blue, orange. Let's shift to a hue that is further away from blue. In this case, let's use red.
+
+Unfortunately, this change only brought the contrast ratio to 1.49:1, which means you need to change the saturation, or the "amount" of color present. Let's increase the amount of red in the text. That brings us much closer to the goal, with a 3.54:1 contrast ratio.
+
+However, you can potentially get even closer by changing the last value, which is lightness. Lightness represents how much white is present in the color.
+
+Let's decrease the lightness of the red. Now there is a much darker red against the light blue background, which brings the contrast ratio to 10.34:1.
+
+You could continue to adjust the colors to find the balance between the visual effect you want and an accessible contrast ratio. But it is important to remember that accessibility should always take precedence.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baaa62d4b46667a8ac869.md b/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baaa62d4b46667a8ac869.md
index 9f54e1fa1a..c8573e5c85 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baaa62d4b46667a8ac869.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baaa62d4b46667a8ac869.md
@@ -10,6 +10,28 @@ dashedName: what-is-the-importance-of-good-visual-hierarchy-in-design
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What is the importance of good visual hierarchy in design?
+
+Visual hierarchy refers to the way you layout and display the content of your page to guide the viewer's attention.
+
+A strong hierarchy can provide a clear path for the eye to follow, ensuring that the information you convey is consumed in the order that you intended.
+
+Let's consider a basic page layout in which the HTML for the page is semantically correct, but the styling applied does not create a strong visual hierarchy.
+
+If the font size isn't distinct, there is no visible indication of the document flow, although things are separated by headings.
+
+To create a visual hierarchy, you should apply different font sizes to the heading tiers. You could also use something like a "callout box" to highlight a specific section.
+
+Visual hierarchy can also help increase your user conversion. For example, you can take advantage of the callout box to further draw attention to a Call to Action (CTA) button.
+
+With the CTA button being visually tied to the work history section, it guides the user to the vital information and the action you want them to take based on that information.
+
+Finally, your visual hierarchy can be important for conveying other components, like a navigation bar or a footer.
+
+This makes it easier for your users to find the essential information that they may be looking for.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baab2a0c3df66ad987b94.md b/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baab2a0c3df66ad987b94.md
index 4aa66228a4..740be31be1 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baab2a0c3df66ad987b94.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baab2a0c3df66ad987b94.md
@@ -10,6 +10,28 @@ dashedName: how-does-scale-work-in-design
Watch the lecture video and answer the questions below.
+# --transcript--
+
+How does scale work in design?
+
+The "scale" of something refers to its size.
+
+When you're looking at scaling in your web design, you're looking at the size relationships between different elements, and how these elements might adapt to different screen sizes.
+
+Using the correct scale for your elements plays an important role in visual hierarchy. Larger elements will draw more attention, which can guide your users through the content in the way that you want.
+
+For example, the visual separation between a heading and a paragraph draws your reader’s attention, but the scale should be appropriate to get an eye-catching text that pulls your reader to that section.
+
+Scale doesn't apply just to text, though. It's also important for images. And while the scale of a banner image might make sense for a desktop layout, it might be too large on a mobile layout.
+
+By scaling an image down to a more appropriate ratio, you can keep the visual impact while ensuring the information on the site is visible.
+
+Scale is also important for interactivity, and the ability to actually use your website. If the text in a navigation bar is not at an appropriate scale, mobile phone users will have a hard time tapping on the links.
+
+And if you scale it appropriately, you end up with links that are not only easier to read, but easier to click on for your mobile users.
+
+There are many ways that scale is important in your designs. We've covered the basics, so you should now have a fundamental understanding of its importance.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baabf16290b66e6b79a39.md b/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baabf16290b66e6b79a39.md
index 0a966fe5ac..0bbe32cf6f 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baabf16290b66e6b79a39.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baabf16290b66e6b79a39.md
@@ -10,6 +10,44 @@ dashedName: how-does-alignment-work-in-design
Watch the lecture video and answer the questions below.
+# --transcript--
+
+How does alignment work in design?
+
+When you are designing web pages, it is important to create cohesive and visually appealing designs. One way to achieve this is through the use of alignment.
+
+Alignment is the process of arranging text and images in a way that creates a visual connection between elements.
+
+It helps to create a sense of order and organization on the page, making it easier for users to navigate and understand the content.
+
+There are several types of alignment you can use, but the basic ones are:
+
+- left alignment
+- center alignment
+- right alignment
+- justified alignment
+- vertical alignment
+
+Left, right, and center alignments are all subtypes of horizontal alignment, while vertical alignment is used to align elements along a vertical axis.
+
+Let's take a closer look at each type of alignment and how you can use them in your designs.
+
+Left alignment is commonly used with text where each element is aligned to the left margin. Aligning all of the headings and paragraphs on a web page to the left margin makes it easier for the user to read and follow the content.
+
+The opposite of left alignment is right alignment, where each element is aligned to the right margin. This is often used on websites to display additional content like promotional banners or advertisements.
+
+For example, an ad that is aligned to the right margin makes it stand out from the rest of the content on the page but doesn't distract the user from the main content.
+
+Center alignment is where elements are centered on the page. This is often used for headings, logos, and other important elements that you want to draw attention to.
+
+Justified alignment is when text is aligned to both the left and right margins. This is typically used for descriptive passages or articles, and creates a clean and professional look.
+
+The last type of alignment is vertical alignment, which is used to align elements along a vertical axis.
+
+Vertical alignment can be used, for example, for a contact form on a website. Aligning all of the form inputs like the name, email, and message fields along a vertical axis makes it easier for the user to fill out the form.
+
+By using different types of alignment, you can create a sense of order and organization on the page that makes it easier for users to navigate and understand the content.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baacb7f2f446728e77efe.md b/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baacb7f2f446728e77efe.md
index 86b23b4ca3..0eefe09390 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baacb7f2f446728e77efe.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baacb7f2f446728e77efe.md
@@ -10,6 +10,34 @@ dashedName: what-is-the-importance-of-whitespace-in-design
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What is the important of whitespace in design?
+
+White space refers to any type of space around elements like images, text, and buttons. White space is important in design because it helps to create a balance between the elements on the page.
+
+Let's take a look at some examples of how white space can be used effectively in design.
+
+For example, let's consider a call-to-action (CTA) button. CTAs are used to encourage users to take a specific action like signing up for a newsletter or making a purchase.
+
+By using white space effectively, we can help to make a CTA button more prominent and encourage users to click on it.
+
+Now let's take a closer look at the different types of white space.
+
+This first example uses both macro and active white space. Macro white space is the space between larger elements like images, text blocks, and buttons.
+
+Active white space is the space that is intentionally created to help guide the user's eye and draw attention to certain elements on the page.
+
+In contrast to active white space, there is also passive white space. Passive white space is the space that is left over after all the elements on a page have been placed.
+
+Another type of whitespace would be micro white space. This is the space between individual characters in a line of text.
+
+Micro white space is important because it helps to improve readability and legibility, making it easier for users to scan and understand the content.
+
+When designing your web pages, you always want to be mindful of the law of proximity. This law states that elements that are close together are perceived as being related, while elements that are far apart are perceived as being unrelated.
+
+You can use white space to help group related elements together and help navigate users through the content on your page.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baad7bbc4f86762ca173e.md b/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baad7bbc4f86762ca173e.md
index 6e3678f0a1..9c4ea2e5b5 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baad7bbc4f86762ca173e.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baad7bbc4f86762ca173e.md
@@ -10,6 +10,34 @@ dashedName: what-are-best-practices-for-working-with-images-in-your-designs
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What are best practices for working with images in your designs?
+
+Adding images to your websites is a great way to engage your users and increase the visual appeal of your site. But there are a few things to consider when working with images in your designs.
+
+The first thing to consider is creating responsive images. Responsive images are images that scale to fit the size of the screen they are being viewed on. This is important because it ensures that your images look good on all devices, from desktops to mobile phones.
+
+Another thing to consider is the resolution for images. Higher quality images with better resolution have more pixels per inch. Pixels are small squares that make up an image.
+
+Pixels per inch, or PPI, is the number of pixels in one inch of an image. The higher the PPI, the better the image quality.
+
+You want to make sure that your images are high quality and look good on all devices. This means that you should use high resolution images that are optimized for the web.
+
+Another thing to consider is the size of your images and how they fit within the spaces in the layout. You want to make sure that your images are the right size and are not too large or too small.
+
+Using large images that are meant to fit in smaller spaces in the design can slow down your website and make it harder for users to load your site. You want to make sure that your images are the right size and are optimized for the web.
+
+When it comes to image placement, you want to think about balance, hierarchy, and alignment to help ensure your images are optimized for the web.
+
+Balance is the distribution of visual weight in a design. You want to make sure there is a good balance between text and images on the site so it creates a harmonious design.
+
+Hierarchy is the order in which elements are viewed on a page. You want to make sure that images that align with important content are placed higher than images that are less important.
+
+Alignment is the placement of elements in relation to each other. You want to make sure that your images are aligned with the text and other elements on your site so that it creates a cohesive design.
+
+The last thing to consider is accessibility for images. You want to make sure that your images are accessible to all users, including those with visual impairments. This means that you should use alt text for your images so that screen readers can read the text to users who are visually impaired.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baae11d06c867a16f64e1.md b/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baae11d06c867a16f64e1.md
index 868b9face5..0237f75b0a 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baae11d06c867a16f64e1.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-user-interface-design-fundamentals/672baae11d06c867a16f64e1.md
@@ -10,6 +10,33 @@ dashedName: what-is-progressive-enhancement
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What is progressive enhancement?
+
+Progressive enhancement is a design approach that ensures all users, regardless of browser or device, can access the essential content and functionality of an application.
+
+It focuses on delivering a core experience that works for everyone, while offering extra features and improvements to users with more advanced browsers or better internet connections.
+
+The progressive enhancement approach lives by these core principles:
+
+- All core content and basic functionality should be accessible on all browsers
+- All advanced layouts should be provided through external CSS stylesheets
+- All advanced functionality should be provided through external JavaScript files
+- A user's browser preferences should be respected
+
+Using a progressive enhancement approach makes your applications more accessible because all core content and functionality should not be blocked in unsupported environments.
+
+In terms of speed, a progressive enhancement approach can also help improve the performance of your applications.
+
+Those users that are working with slower internet connection speeds will still be able to access the content because the browser will download the necessary resources first.
+
+When it comes to SEO, progressive enhancement can also help improve the visibility of your applications.
+
+Search engines will be able to crawl the content of your applications because the core content is available in the initial HTML response.
+
+While some have criticized this approach deeming that it is not always realistic for applications that rely heavily on JavaScript for their functionality, it is still a good practice to follow when building applications.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672aa58c389eb9565978495d.md b/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672aa58c389eb9565978495d.md
index 5e118ee608..ccbb2240dc 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672aa58c389eb9565978495d.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672aa58c389eb9565978495d.md
@@ -10,6 +10,32 @@ dashedName: how-can-you-use-file-management-applications-on-your-computer
Watch the video lecture and answer the questions below.
+# --transcript--
+
+How to use file management applications?
+
+A file management application is a way to easily store, organize, and edit your files on your computer. Whether you use a Mac or Windows computer, there are built-in applications you can use to organize your files.
+
+If you have a Windows computer, the default file manager is the File Explorer. This is used to browse, search, and manage files and folders, as well as perform file operations like copying, moving, and deleting.
+
+To find the File Explorer, you can go to the Start menu or press the Windows logo key on your keyboard.
+
+To pin a folder, you can right click with your mouse and select "Pin". To move a file or folder, you first need to select it, then select "Cut" and then navigate to the new location to paste it.
+
+If you have a Mac computer, the default file manager is the Finder. This provides access to local and remote files, supports file previews, and offers a variety of organizational features like tags and Smart Folders.
+
+To access the Finder on your Mac, go to the Dock at the bottom and click on the Finder icon.
+
+You will notice a sidebar on the left-hand side where your favorite folders are located.
+
+One way to organize your files, is to use tags. To tag a file or folder, you can select the item in the Finder and then right click with your mouse. You will see the "Tags..." option in the dropdown and you can apply a custom colored tag.
+
+To search for tagged items, you can scroll to the bottom of the sidebar and click on the corresponding colored tag, or you can search for the tag by color name in the search field.
+
+Another way to organize your files is to use smart folders. Smart folders are collections of files that are automatically organized based on criteria you set, such as file type, date, or keywords.
+
+Whether you're using File Explorer on Windows or Finder on Mac, these applications provide flexibility to manage your files with features like tags, search, and Smart Folders.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672ac37104dc2530a769e6a4.md b/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672ac37104dc2530a769e6a4.md
index 683f59ec45..eff43a863d 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672ac37104dc2530a769e6a4.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672ac37104dc2530a769e6a4.md
@@ -10,6 +10,58 @@ dashedName: what-are-best-practices-for-naming-files-for-web-applications
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What are best practices for naming files for web applications?
+
+As you start to build out your own web applications, you will need to be mindful of what you name your files.
+
+You will want to name your files in a way that is easy to understand and maintain.
+
+Let's take a look at some examples of good and bad file names for HTML files. Note that the `.html` extension in these examples tells us that this is an HTML file.
+
+Here is an example of a bad file name:
+
+```md
+index1234.html
+```
+
+By the name alone, it is not clear what the file is about. This file could be for a products page, blog page, or any other type of page but we don't know that from the file name.
+
+Here is an example of a better file name for an HTML file:
+
+```md
+about-us.html
+```
+
+By using a more descriptive name like `about-us.html`, it is clear what the file is about.
+
+You will also notice in this file name that there are no spaces. Instead, you use a hyphen, `-`, to separate the words.
+
+Sometimes you might see a file name called `index.html`. This is a special file name that is used to represent the main page of a website. When you visit a website, the `index.html` file is the first file that is loaded.
+
+Another important consideration when naming files is the use of special characters.
+
+Using a mixture of special characters, numbers, and letters can make it difficult to understand what the file is about.
+
+Here is an example of a bad file name:
+
+```md
+file-1!@.html
+```
+
+This name looks unnecessarily complicated and does not give us any information about what the file is about.
+
+So it is best to stick with only using letters and dashes in your file names.
+
+As you start to learn more languages, you will see that there are common conventions for naming files in those languages as well.
+
+In these situations, it is always best to consult with official documentation or other resources to understand the best practices for naming files in that language.
+
+Also you will be in situations where you are working on a team and you will need to follow the conventions that the team has established for naming files.
+
+Always consult with the team's style guide to make sure your file names are consistent with the rest of the team.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672ac39a22b0cc30eb8fd65e.md b/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672ac39a22b0cc30eb8fd65e.md
index 9f46d28c0f..d918513227 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672ac39a22b0cc30eb8fd65e.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672ac39a22b0cc30eb8fd65e.md
@@ -10,6 +10,54 @@ dashedName: what-are-best-practices-for-file-folder-organization-in-web-applicat
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What are best practices for file and folder organization in web applications?
+
+When building out web applications, it is important to think about the organization of your files and folders. This will help keep your code organized and easier to maintain.
+
+Let's take a look at an example folder structure for an HTML and CSS project:
+
+```bash
+.
+├── /assets
+│ ├── /images
+│ │ ├── logo.png
+│ │ ├── banner.jpg
+│ │ └── icons.svg
+│ ├── /fonts
+│ │ ├── custom-font.woff
+│ │ └── custom-font.woff2
+├── /css
+│ ├── main.css
+│ ├── about.css
+│ └── contact.css
+├── index.html
+├── about.html
+├── contact.html
+└── README.md
+```
+
+At the top of the example, there is a single dot, which represents the root directory.
+
+The root directory is the top-level directory in a file system, serving as the starting point for all file paths and containing all other directories and files. A directory is another name for a folder.
+
+Inside the root directory, the first directory shown is the `assets` directory. The term `assets` refers to any files that are used in the project, such as images, fonts, or other resources.
+
+In this example, there are two directories inside the `assets` directory called `images` and `fonts`.
+
+The next directory would be the `css` directory. Sometimes this is also referred to as a stylesheets directory. This is where you would store all of your CSS files.
+
+Below the `css` directory are the HTML files. The `index.html` file represents the homepage, while `about.html` and `contact.html` represent the About and Contact pages, respectively.
+
+Lastly, there is a `README.md` file. `README` files are commonly used to provide useful information about the project, such as what it does, how to use it, and any other relevant details.
+
+The `.md` extension stands for Markdown, which is a lightweight markup language that is often used to write documentation.
+
+By organizing your project into assets, CSS, and HTML files, it makes it easy to find what you are looking for. This also makes it easy for other developers to contribute to your project.
+
+It is important to note that this is just one example of how you can organize your files and folders. There are many different ways to structure a project.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672ac3c5d0e9fd31835ff772.md b/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672ac3c5d0e9fd31835ff772.md
index a06c421fc9..881b1f0662 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672ac3c5d0e9fd31835ff772.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672ac3c5d0e9fd31835ff772.md
@@ -10,6 +10,74 @@ dashedName: how-to-create-move-and-delete-files-and-folders-using-explorer-finde
Watch the lecture video and answer the questions below.
+# --transcript--
+
+How to create, move, and delete files and folders using the Explorer or Finder?
+
+To create a file on Windows using the Explorer, you can click on the "New" option at the top right. This will show you a list of the different types of files that you can create.
+
+You can also create files in their corresponding applications. Let's create a text file to show you the process.
+
+When you click on "New" and select the file type, you will see a new text file in your current folder with a default name. You can rename it if you'd like.
+
+The process of creating folders is exactly the same. Click the "New" button at the top right and then select the "Folder" option or right-click on an empty spot and go to "New." Then, select the "Folder" option. You'll see a new empty folder in your current location.
+
+You can rename files and folders by selecting them and clicking on the "Rename" option at the top. When current name of the file is highlighted, you can start writing the new name of the file. Press Enter to confirm the changes.
+
+Alternatively, you can right-click on the file or folder and select the "Rename" option or use the F2 keyboard shortcut. Write the new name and press Enter to confirm the changes.
+
+You can move a file or folder to another folder by dragging and dropping it into the destination folder, if you have it opened it as a tab.
+
+You can also select the file or folder and select the "Cut" option at the top.
+
+Then, go to the destination folder and paste it by clicking the "Paste" button at the top. If you copied or cut the file previously, this button will be enabled.
+
+You can also do this by right-clicking on an empty spot and then clicking on the paste icon. This will remove the file or folder from its original location.
+
+To delete a file or folder, click on it and then click on the Trash icon at the top. You will also find a "Delete" option if you right-click on it.
+
+Great. Now let's see how you can do this on macOS using Finder.
+
+Finder is the default file manager on macOS.
+
+To create a file on macOS, you need to open an application that lets you create the type of document that you need to create. Currently, there isn't a built-in way to create a file directly on Finder.
+
+For example, to create a simple plain text file, you can open TextEdit and save your file. The process works exactly the same for any type of file.
+
+There are many ways to open TextEdit. One of them is to go to Launchpad. Then, search for an app where you can create the type of file that you're interested in. In this case, that would be "TextEdit." Click on the icon to open the app.
+
+Once you are inside the app, you should see an option to save your file in the App menu. This menu is located at the top-right, next to the Apple menu icon.
+
+In one of the App menu options, you should see a command to save the file. This is usually under the File menu.
+
+Next to it, you will see the keyboard shortcut for saving your file. This is usually `Command + S` on macOS.
+
+When you are saving the file for the first time, you should see a dialog window, where you can write the name of the file and choose a location.
+
+Usually, the file extension is added by the application automatically but you can change it before saving the file.
+
+After saving the file, you can open Finder by clicking on the Finder icon in the Dock. You should see your new file in the folder where you saved it.
+
+To create a new folder, you should go to the location where you want to create that new folder and rick-click on an empty spot. You will see a list of options. The first option is "New Folder."
+
+If you click on it, you can assign a name to your new folder. Write the name and press Enter to confirm.
+
+There are multiple ways to move files and folders in Finder. If you need to move them to a folder listed in your Finder "Favorites" section, you can just drag and drop it.
+
+If you need to move it to a different folder, you have two options.
+
+You can either open the destination folder as a tab and drag and drop the file or folder into the tab.
+
+Or you can use keyboard shortcuts. First, copy the file with `Command + C`, go to the new folder, and then use `Command + Option + V` to paste the file or folder in that location. This will also remove it from the original folder.
+
+To delete a file or folder, you can right-click on it and select "Move to trash."
+
+You can also drag and drop them into the trash icon on the Dock. This is equivalent.
+
+When the file or folder is in the trash can, you can right-click on it to delete it immediately or you can empty the trash to remove all the deleted files and folders permanently.
+
+Knowing how to create, move, and delete files and folders on Windows and macOS is very important. By mastering these skills, you can organize your files, locate them quickly, and free up storage on your computer by deleting unnecessary files.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672ac3f129efbf327742eb33.md b/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672ac3f129efbf327742eb33.md
index edb1dbb4b7..effaff66d2 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672ac3f129efbf327742eb33.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672ac3f129efbf327742eb33.md
@@ -10,6 +10,42 @@ dashedName: how-to-search-for-files-and-folders-on-your-computer
Watch the lecture video and answer the questions below.
+# --transcript--
+
+How to search for files and folder on your computer?
+
+Let's learn how to search for files and folders on Windows and macOS.
+
+We'll start with Windows. You can search from the Taskbar or from the File Explorer.
+
+To search from the Taskbar, write the name of the file or folder that you are looking for. You can also search for keywords. You'll see results from across your PC and OneDrive.
+
+If you only want to see documents, you can click on the "Documents" tab. You also have tabs for apps and web results.
+
+Another alternative is to use the Search File Explorer. You will find it at the top right of the Explorer window, where you can see "Search Documents."
+
+You have three options to define the scope of the search:
+
+- You can search from Home to find files from your PC and from the cloud quickly.
+
+- You can search from a folder to find files stored inside it.
+
+- You can search from This PC for a slow but in-depth search.
+
+This is how you can search for files and folders on Windows. Now let's see how you can do this on macOS.
+
+First, you can use Spotlight, a tool that helps you find files on your Mac. To open Spotlight, go to your menu bar at the top right and find the magnifying glass icon. If you don't see this icon on the menu bar, you can add it in the Control Center settings.
+
+Go to your settings, filter by "Control Center", click on this option and then scroll down until you find the "Spotlight" option. You can also use a keyboard shortcut to open Spotlight: `Command + Spacebar`.
+
+When you open Spotlight, you'll see the Spotlight Search, where you can search for any file or folder by typing its name. When you start typing, you'll see the results grouped by category, including suggestions, folders, presentations, photos, documents, and related searches.
+
+You can also expand a specific category by clicking on "Show More."
+
+Another way to search for files that you have recently opened is to open Finder by click on the Finder icon in the Dock. Then, go to "Recents" in the Finder sidebar. And there, you'll find all the files that you've recently viewed.
+
+This is how you can search for files and folders on macOS. With these search tools, you can optimize your workflow and find the files and folders you need very quickly.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672ac403a9ba7732b31c6480.md b/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672ac403a9ba7732b31c6480.md
index 025f69cab1..f35d416a40 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672ac403a9ba7732b31c6480.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-working-with-file-systems/672ac403a9ba7732b31c6480.md
@@ -10,6 +10,62 @@ dashedName: what-are-some-common-file-types-you-will-work-with-in-web-applicatio
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What are some common file types used in web applications?
+
+Files are classified based on their content and structure. The file type determines how a file is opened and processed by computer programs.
+
+We identify file types based on their extensions. A file extension is a three or four letter suffix at the end of the file name. The three main file types that you will find in web applications are HTML, CSS, and JavaScript.
+
+HTML files contain the structure and content of the web application. They have a `.html` file extension.
+
+CSS files define the styles. They have a `.css` file extension.
+
+And JavaScript files add more advanced functionality and interactivity. They have a `.js` file extension.
+
+As you develop web applications, you will also need to include images. These are some of the most widely used image file types.
+
+JPEG, which stands for "Joint Photographic Experts Group," is known for its efficient compression. It's great for photographs and images. However, the compression is lossy, which means that some image quality is lost to reduce the file size.
+
+PNG, which stands for "Portable Network Graphics," preserves image quality, even after compression. This results in larger files. PNG supports transparency and it's great for images with sharp edges, like logos and icons.
+
+The GIF image format supports both animation and transparency but has a limited color palette. GIF stands for "Graphics Interchange Format."
+
+And finally, we have SVG, which stands for "Scalable Vector Graphics." It's a vector image format. These images can be scaled as much as needed without losing quality.
+
+Great. Now that you know about image formats, let's see some video and audio formats.
+
+MP3 is an audio format known for its efficient compression. It's a lossy format, so some audio data is lost during the compression to make these files smaller.
+
+MP4 is one of the most common video formats. It offers good compression and supports multiple audio and video codecs, subtitles, and metadata.
+
+MOV, the QuickTime multimedia file format developed by Apple, is primarily associated with QuickTime Player.
+
+Other popular audio and video file types are WAV, a lossless audio format that keeps the original quality of the audio, and WebM, a high-quality open-source video format.
+
+If you ever need to customize the fonts of your web application, you will also work with font formats. These are three of the most widely used ones.
+
+TTF, which stands for "TrueType Font", is a font format compatible with different operating systems.
+
+WOFF is a modern font format, specifically designed for web development purposes. It stands for "Web Open Font Format". These files are smaller because they have better compression. They can also store metadata, including licensing information.
+
+And WOFF2 is the successor of WOFF with even more efficient compression and performance.
+
+You can also create archive files if you need to group multiple folders and files. The most widely used archive format is ZIP. ZIP offers lossless compression, so no data is lost during the process. It's widely supported across operating systems and software applications.
+
+And finally, let's talk about documentation. In web applications, you will usually find a file called `README` that contains information about the application, like how to use it, how to install it, its license, and how to contribute.
+
+They are usually written in a file format called Markdown. With Markdown, you can create structured documents with headings, subheadings, links, images, lists, and more. Markdown files have a `.md` or `.markdown` extension.
+
+Here you can find the `README` file of freeCodeCamp's GitHub repository: https://github.com/freeCodeCamp/freeCodeCamp/blob/main/README.md
+
+You can create this detailed structure and format using Markdown.
+
+You will definitely read and write many `README` files throughout your career. Learning about these common file types is essential for web development.
+
+From the core building blocks of HTML, CSS, and JavaScript to image, video, and audio formats, every file type has an important role in creating interactive web applications.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-working-with-forms/6729974ec29be33cb00eb54d.md b/curriculum/challenges/german/25-front-end-development/lecture-working-with-forms/6729974ec29be33cb00eb54d.md
index c31ea105ce..9ab6444d61 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-working-with-forms/6729974ec29be33cb00eb54d.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-working-with-forms/6729974ec29be33cb00eb54d.md
@@ -10,6 +10,57 @@ dashedName: how-do-forms-labels-and-inputs-work-in-html
Watch the video lecture and answer the questions below.
+# --transcript--
+
+How do forms, labels, and inputs work in HTML?
+
+The `form` element in HTML is used to gather user information, such as names and email addresses. Here is an example of a `form` element:
+
+```html
+
+```
+
+The `action` attribute specifies where the form data will be sent upon submission. To collect specific information, like names and email addresses, you would use the `input` element. Here is an example of using an `input` element:
+
+```html
+
+```
+
+`input` elements are void elements and do not have closing tags. The `type` attribute defines the data type expected from the user. In this case, the data would be plaintext. To add a label for the input, you would use a `label` element. Here is an example of using a `label` element with the text of `Full Name:`:
+
+```html
+
+```
+
+By nesting an `input` inside a `label` element, you create an implicit association between the `label` and the `input` field. The term "implicit" refers to something that is understood or inferred without needing to be explicitly stated or defined with additional attributes or elements. To explicitly associate a `label` with an `input`, you can use the `for` attribute. Here is an example of using the `for` attribute for an email address label:
+
+```html
+
+```
+
+When using an explicit association, the values for the `for` attribute and `id` need to be the same. In this case, the values are both set to `email`. The `email` type in the input provides basic validation for correctly formatted email addresses. If you want to show additional hints to the users about the expected input, you can use the `placeholder` attribute. Here is an example using the `placeholder` attribute inside the email input:
+
+```html
+
+```
+
+For the placeholder text, you want to provide helpful short text to show the format and type of data you expect from your users. In this case, the placeholder text, `Ex. example@email.com`, shows the user that they must enter a correctly formatted email address.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-working-with-forms/672a4cd3d59756726657efb8.md b/curriculum/challenges/german/25-front-end-development/lecture-working-with-forms/672a4cd3d59756726657efb8.md
index adf808a360..c7bf45ba5e 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-working-with-forms/672a4cd3d59756726657efb8.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-working-with-forms/672a4cd3d59756726657efb8.md
@@ -10,6 +10,53 @@ dashedName: what-are-the-different-types-of-buttons
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What are the different types of buttons, and when should you use them?
+
+The `button` element is used to perform a particular action when it is activated. Here is an example of a `button` element with the button text of `Start Game`.
+
+```html
+
+```
+
+Other examples of using the `button` element include submitting a form, showing a modal, or toggling a side menu open and closed. The `button` element has a `type` attribute which controls the behavior of the button when it is activated. The first possible value for the `type` attribute would be the `button` type. Here is an example of using the `button` element with the `button` type and a text of `Show Alert`:
+
+```html
+
+```
+
+By default, the button will not do anything when activated. However, you can add some JavaScript code to make the button interactive, such as showing an alert in this case. Another possible value for the `type` attribute is the `submit` value. Here is an example of using a `button` element with the `submit` type:
+
+```html
+
+```
+
+Inside this `form` element, there is a `label` and `input` element for the user's email address. When the user clicks on the submit button, their data will be sent to the server and will be processed. The third possible value for the `type` attribute is the `reset` value. Here is an example of a `form` element with reset and submit buttons:
+
+```html
+
+```
+
+In this modified example, a `label` and `input` element are used to collect the user's email address. When the user clicks on the reset button, then it will clear out all of their input data. It is important to note that reset buttons are usually not the best idea because they could lead to users accidentally resetting their data. Also, multiple buttons in your form could clutter up the user interface.
+
+Another way to create buttons in HTML is to use the `input` element. The `input` element also has a `type` attribute with the possible values of `submit`, `reset`, and `button`. Here is an example of using the `input` element with the `type` set to `button`:
+
+```html
+
+```
+
+The `value` attribute is used to show the button text. So, what is the difference between using the `input` and `button` elements? `input` elements are void elements, which means they cannot have child nodes, such as text, and can only have a start tag. On the other hand, the `button` element offers more flexibility because you can nest text, images, and icons inside it.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-working-with-forms/672a4ce6dab9eb735828b48b.md b/curriculum/challenges/german/25-front-end-development/lecture-working-with-forms/672a4ce6dab9eb735828b48b.md
index 6c59cb5c9d..920b07c8a2 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-working-with-forms/672a4ce6dab9eb735828b48b.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-working-with-forms/672a4ce6dab9eb735828b48b.md
@@ -10,6 +10,50 @@ dashedName: what-is-client-side-form-validation-in-html-forms
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What is client-side form validation in HTML forms, and what are some examples?
+
+When a user fills out a form on your website, it is important that they fill out all of the necessary information in the correct format. HTML form controls, like inputs, have a lot of built-in validation that you can use to check for invalid data. This will help ensure that the user fixes these mistakes before the information is submitted and processed by the server.
+
+The term "client-side" refers to everything that happens on the user's computer or device, like the part of a website or app you interact with directly. This includes the layout, design, and any interactive features.
+
+The term "server-side" refers to everything that happens on the server, the computer, or system, that hosts the website or app. This includes processing data, running applications, and handling requests that come from the user's device.
+
+While client-side validation is important, you also need server-side validation for added security. Malicious users can bypass client-side checks, so robust server-side measures are essential. You'll learn more about this in a later module. For now, let's take a look at some examples of client-side form validation.
+
+One common example of built-in form validation is to use the `required` attribute in inputs. The `required` attribute specifies that the user needs to fill out that portion of the form before it gets submitted. Here is an example of using the `required` attribute in an email input:
+
+```html
+
+```
+
+When the user clicks on the `Submit Form` button without supplying an email address, they will be alerted that the field is required and the form will not be submitted. Each browser will have its own set of styles for showing this alert message. Another advantage of using the email input, is that email inputs have some basic validation to ensure correctly formatted email addresses. It is important to note that browsers only check for basic validation for standard email addresses. It is up to you to add additional layers of validation, which you will learn about in later modules.
+
+Other forms of validation for email inputs are to use the `size`, `minlength` and `maxlength` attributes. Here is an example using the extra validation:
+
+```html
+
+```
+
+The `size` attribute is used to set the physical size for the input container. The `minlength` and `maxlength` attributes are used to set the minimum and maximum length in characters for the email input. If you don't include the minimum length or exceed the max length of characters, the browser will show an alert message.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-working-with-forms/672a4cf959443073a6774908.md b/curriculum/challenges/german/25-front-end-development/lecture-working-with-forms/672a4cf959443073a6774908.md
index c1559514cf..8e75a4db2f 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-working-with-forms/672a4cf959443073a6774908.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-working-with-forms/672a4cf959443073a6774908.md
@@ -10,6 +10,42 @@ dashedName: what-are-the-different-form-states
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What are the different form states, and why are they important?
+
+In HTML, form controls, like inputs, can be in different stages or conditions like a `focused` state, `readonly` state, or `disabled` state.
+
+The first state would be considered the `default` state. The default state of an email address input is a blank input. That is what the email input looks like when it is first rendered on the page. At this point, the user has not input any information.
+
+When the user clicks on a form control or selects it with the keyboard's tab key, then that means it is in the `focused` state. When an input is in the `focused` state, most browsers will show a blue highlighted border around the input. But you can choose to add additional styles in CSS.
+
+Another form state is the `disabled` state. This state shows users that an input cannot be focused or activated. To disable an input, you can add the `disabled` boolean attribute to the element like this:
+
+```html
+
+```
+
+If the user tries to click on the input, then the focus will not be enabled. Similar to the `focused` state, you can choose to add additional styles for the `disabled` state using CSS.
+
+Another type of form state is the `readonly` state. This is when a form control, like an input, is not editable by the user. Here is an example of setting an email input to read only:
+
+```html
+
+```
+
+The `value` attribute is used to set the value shown inside the input field. If you tried to click on the input, you would not be able to edit the existing value.
+
+A key difference between the `disabled` state and `readonly` state is that `readonly` can be focused while the `disabled` state cannot.
+
+Understanding the different form states is important because they ensure a smooth user experience by providing clear feedback and guidance while handling errors.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-working-with-html-tools/672a4fa7d335bc7cfb63a392.md b/curriculum/challenges/german/25-front-end-development/lecture-working-with-html-tools/672a4fa7d335bc7cfb63a392.md
index 02f33dec43..a9a4a0fed8 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-working-with-html-tools/672a4fa7d335bc7cfb63a392.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-working-with-html-tools/672a4fa7d335bc7cfb63a392.md
@@ -10,6 +10,58 @@ dashedName: what-is-an-html-validator
Watch the video lecture and answer the questions below.
+# --transcript--
+
+What is an HTML validator, and how can it help you debug your code?
+
+HTML is a very forgiving language – elements still render even when you make mistakes, like forgetting to include a closing tag.
+
+Let's say you have an `h2` element without a closing tag:
+
+```html
+Article Topic
+Subheading 1
+Subheading 2
+
+
+Subheading 3
+```
+
+The `h2` without a closing tag will still render fine. This happens because browsers use a parsing algorithm that handles common errors and tries to render HTML as closely as possible to the author's intention.
+
+But this could backfire sometimes. Let's add a few paragraphs under the existing heading 2 tags in the code:
+
+```html
+Article Topic
+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Maiores, nisi.
+
+Subheading 1
+Lorem, ipsum dolor sit amet consectetur adipisicing elit. At, doloremque.
+
+Subheading 2
+Lorem ipsum dolor sit amet consectetur adipisicing elit. Unde, placeat.
+
+
+Subheading 3
+
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Tempore, illum.
+```
+
+As a result, the paragraph element under the `h2` without a closing `h2` tag renders as heading 2. This is why you need an HTML validator.
+
+An HTML validator is a tool that checks the validity of your HTML code against the standard HTML specifications. It helps you identify errors and warnings in your HTML code, ensuring your web pages are correctly structured and compliant with web standards.
+
+Using an HTML validator benefits not only you and your future code reviews, but also anybody else going through your code, such as your teammates and open-source contributors.
+
+There are several HTML validators out there you can use. The most widely accepted one is the `w3.org` markup validation service.
+
+When you visit the site [`validator.w3.org`](https://validator.w3.org/), you can click on the `Validate by Direct Input` button and paste in your HTML code.
+
+When you click on the `Check` button, then a list of results will display with the errors that need to be fixed.
+
+Another HTML validator that you can use is [`jsonformatter.org`](https://jsonformatter.org/).
+
+You can copy and paste your HTML code inside the first editor, and when you click on the `Validate` button, it will show you any errors you have in your code.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-working-with-html-tools/672a511bb408ec81c592eb68.md b/curriculum/challenges/german/25-front-end-development/lecture-working-with-html-tools/672a511bb408ec81c592eb68.md
index 26fd6a6fc4..b411783126 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-working-with-html-tools/672a511bb408ec81c592eb68.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-working-with-html-tools/672a511bb408ec81c592eb68.md
@@ -10,6 +10,52 @@ dashedName: how-to-use-the-dom-inspector-and-devtools
Watch the lecture video and answer the questions below.
+# --transcript--
+
+How do you use the DOM inspector and devtools to debug and build your projects?
+
+When you are building out your projects, you will frequently run into issues where your programs are not working as expected.
+
+Programmers often refer to issues as bugs. The process of finding and fixing these bugs is known as debugging.
+
+To debug your code, you will need to use some tools provided by your browser.
+
+Two important tools to use would be the DOM inspector and developer tools.
+
+The DOM inspector allows you to inspect the HTML structure of the page you are on.
+
+The DOM stands for Document Object Model. It is a tree-like structure that represents the elements on a page. You will learn more about the DOM in later modules.
+
+The developer tools allow you to inspect the HTML, CSS, and JavaScript of the page you are on.
+
+Let's take a look at an HTML example that contains a small bug in the anchor element:
+
+```html
+freeCodeCamp curriculum
+```
+
+When you click on the link, it will lead to a 404 page. A 404 page is an error page that appears when a user tries to access a webpage that doesn't exist on the server.
+
+The intent is for the link to lead to the freeCodeCamp curriculum.
+
+To see what the issue might be, you can use the developer tools.
+
+To open the developer tools in your browser, you can right-click on the page and select `Inspect`.
+
+You can also use `Control Shift I` on your PC keyboard or `Command Option I` on your Mac.
+
+When you open developer tools in Google Chrome, you'll see a number of tabs. The first tab is called the `Elements` tab. This tab shows you the HTML structure of the page you are on.
+
+The second tab is called the `Console` tab. This tab shows you any errors that might be occurring on the page.
+
+In the situation where you have a broken link, you can check the console to see the error messages for that broken link. The common message that continues to display for the broken link is the 404 error. The 404 error indicates that the page is not found.
+
+This lets us know that the issue is with the URL in the anchor element. When you inspect the `href` value you will see there is a typo.
+
+Right now the console message shows `/larn` against a 404, but the correct URL should be `/learn`. When the link is corrected, then it will work as expected.
+
+You will learn more about working with the developer tools throughout the certification, but this is just a short example on how it can help you debug your code.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-working-with-links/6716744f7245947a3dd60009.md b/curriculum/challenges/german/25-front-end-development/lecture-working-with-links/6716744f7245947a3dd60009.md
index 950d3b1275..914d95482a 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-working-with-links/6716744f7245947a3dd60009.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-working-with-links/6716744f7245947a3dd60009.md
@@ -10,6 +10,30 @@ dashedName: what-are-the-different-target-attribute-types
Watch the video and answer the questions below.
+# --transcript--
+
+What are the different `target` attribute types, and how do they work?
+
+You may have seen the `target` attribute on anchor elements, or links. This important attribute tells the browser where to open the URL for the anchor element:
+
+```html
+Visit freeCodeCamp
+```
+
+There are four important possible values for this attribute. Note that each value is preceded by an underscore.
+
+The first value is `_self`, which is the default value. This opens the link in the current browsing context. In most cases, this will be the current tab or window.
+
+The second value is `_blank`, which opens the link in a new browsing context. Typically, this will open in a new tab. But some users might configure their browsers to open a new window instead.
+
+The third value is `_parent`, which opens the link in the parent of the current context. For example, if your website has an `iframe`, a `_parent` value in that `iframe` would open in your website's tab/window, not in the embedded frame.
+
+The fourth value is `_top`, which opens the link in the top-most browsing context - think "the parent of the parent". This is similar to `_parent`, but the link will always open in the full browser tab/window, even for nested embedded frames.
+
+There is a fifth value, called `_unfencedTop`, which is currently used for the experimental FencedFrame API. At the time of this video, you probably won't have a reason to use this one yet.
+
+Selecting the right `target` value to control where your users end up is an important consideration when creating a website.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-working-with-links/671682dd88e461a8e2620f38.md b/curriculum/challenges/german/25-front-end-development/lecture-working-with-links/671682dd88e461a8e2620f38.md
index 7bc6e9ff7d..e663d54571 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-working-with-links/671682dd88e461a8e2620f38.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-working-with-links/671682dd88e461a8e2620f38.md
@@ -10,6 +10,69 @@ dashedName: what-is-the-difference-between-absolute-and-relative-paths
Watch the video and answer the questions below.
+# --transcript--
+
+What is the different between absolute and relative paths?
+
+A path is a string that specifies the location of a file or directory in a file system. In web development, paths let developers link to resources like images, stylesheets, scripts, and other web pages. There are absolute and relative paths - both are essential when specifying file locations within a file system. Let's look at the two so you can decide which one of them to use and when.
+
+An absolute path is a complete link to a resource. It starts from the root directory, includes every other directory, and finally the filename and extension. The "root directory" refers to the top-level directory or folder in a hierarchy.
+
+An absolute path also includes the protocol - which could be `http`, `https`, and `file` and the domain name if the resource is on the web. Here's an example of an absolute path that links to the freeCodeCamp logo:
+
+```html
+
+ View fCC Logo
+
+```
+
+In this example, the protocol is `https`, the domain name is `design-style-guide.freecodecamp.org`, and the filename is `fcc_secondary_small.svg`.
+
+Now, what if the resource you want to link to using an absolute path is on your local machine? Here's how to link to the `about.html` file with an absolute path:
+
+```html
+
+ Read more on the
+ About Page
+
+```
+
+It looks like this because we are going into a folder called `Users`, then into a folder called `user`, then into a folder called `Desktop`, then into a folder called `fCC`, then into a folder called `script-code`, then into a folder called `absolute-vs-relative-paths`, then into a folder called `pages` to finally get the `about.html` file.
+
+Here's what the absolute URL looks like in the browser address bar:
+
+```sh
+file:///Users/user/Desktop/fCC/script-code/absolute-vs-relative-paths/pages/about.html
+```
+
+The URL includes the protocol, `file://`. It also include the path, which looks like this: `/Users/user/Desktop/fCC/script-code/absolute-vs-relative-paths/pages/`, and represents the series of folders that lead to the file. And finally, it also includes the `about.html`, which is the filename and the extension.
+
+Now, lets look at the relative path. A relative path specifies the location of a file relative to the directory of the current file. It does not include the protocol or the domain name, making it shorter and more flexible for internal links within the same website. Here's an example of linking to the `about.html` page from the `contact.html` page, both of which are in the same folder:
+
+```html
+
+ Read more on the
+ About Page
+
+```
+
+So imagine you are on the `contact.html` page, and because the `about.html` page is in the same place, you simply get the filename. This is an example of using a relative file path.
+
+So, which should you use and when; an absolute path or a relative path? Here are the rules you should follow:
+
+- Use absolute paths when linking to a resource hosted on an external website.
+
+- Use absolute paths when you need the link to a page or resource to work consistently regardless of the document location within the site.
+
+- Use relative paths when linking to resources within the same website.
+
+- Use relative paths if you want to keep your code cleaner and easier to maintain during development.
+
+- Use relative paths during local testing to ensure links work without an internet connection.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-working-with-links/6716830dbaf95da9564f2e3b.md b/curriculum/challenges/german/25-front-end-development/lecture-working-with-links/6716830dbaf95da9564f2e3b.md
index 9327a2725c..ff8d9357a9 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-working-with-links/6716830dbaf95da9564f2e3b.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-working-with-links/6716830dbaf95da9564f2e3b.md
@@ -1,6 +1,6 @@
---
id: 6716830dbaf95da9564f2e3b
-videoId: GTgzy4wPXcM
+videoId: 5EfMkiLB9BA
title: What Is the Difference Between Slashes, a Single Dot, and Double Dot in Path Syntax?
challengeType: 11
dashedName: what-is-the-difference-between-slashes-a-single-dot-and-double-dot-in-path-syntax
@@ -10,6 +10,30 @@ dashedName: what-is-the-difference-between-slashes-a-single-dot-and-double-dot-i
Watch the video and answer the questions below.
+# --transcript--
+
+You may have seen links like `/public/logo.png`, `./script.js`, or `../styles.css` before. But what do these special types of links mean? These are called file paths. There are three key syntaxes to know. First is the slash, which can be a backslash (`\`) or forward slash (`/`) depending on your operating system. The second is the single dot (`.`). And finally, we have the double dot (`..`).
+
+The slash is known as the "path separator". It is used to indicate a break in the text between folder or file names. This is how your computer knows that `naomis-files/` points to a directory of that same name, while `naomis/files/` points to a `files` directory in the `naomis` directory.
+
+A single dot points to the current directory, and two dots point to the parent directory. You will typically see a single dot used to ensure that the path is recognized as a relative path. Remember that you learned in a previous lecture about relative versus absolute paths before.
+
+Double dots, however, are much more common to access files outside of the current working directory.
+
+For example, given this file tree:
+
+```sh
+my-app/
+├─ public/
+│ ├─ favicon.ico
+│ ├─ index.html
+├─ src/
+│ ├─ index.css
+│ ├─ index.js
+```
+
+If your `public/index.html` file needed to load the `favicon.ico` file, you would use a relative path with a single dot to access the current directory: `./favicon.ico`. If your `public/index.html` file needed to load the `index.css` file, you would use a relative path with double dots to navigate to the parent `my-app` directory first, then to the `src` directory, and finally to your file: `../src/index.css`.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-working-with-links/67168323932391a9ee0d3a9e.md b/curriculum/challenges/german/25-front-end-development/lecture-working-with-links/67168323932391a9ee0d3a9e.md
index c2d2741e7a..68d8c1f1d3 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-working-with-links/67168323932391a9ee0d3a9e.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-working-with-links/67168323932391a9ee0d3a9e.md
@@ -10,6 +10,26 @@ dashedName: what-are-the-different-link-states
Watch the video and answer the questions below.
+# --transcript--
+
+What are the different link states, and why are they important?
+
+You may have seen a link on a web page become purple after you click it. This is because the state of the link has changed, so different styling gets applied. There are five different states a link can be in.
+
+The first is the default state, which is `:link`. This state represents a link which the user has not visited, clicked, or interacted with yet. You can think of this state as providing the base styles for all links on your page. The other states build on top of it.
+
+The second state is `:visited`, which applies when a user has already visited the page being linked to. By default, this turns the link purple - but you can leverage CSS to provide a different visual indication to the user. This is helpful to let someone know they have already read a portion of your documentation. Or, that the site is one they can trust because they have used it before.
+
+The third state is `:hover`. This state applies when a user is hovering their cursor over a link. This state is helpful for providing extra attention to a link, to ensure a user actually intends to click it.
+
+Then we have `:focus`. This state applies when we focus on a link.
+
+And finally, we have `:active`. This state applies to links that are being activated by the user. This typically means clicking on the link with the primary mouse button by left clicking, in most cases. This state can be helpful for showing a user that the element they clicked on is interactive.
+
+When you use these states to style your links, there is a specific order you need to write your CSS in: `link`, `visited`, `hover`, `focus`, then `active`.
+
+You should now know how to give links in your page your own personal flair, while still providing the important information a user needs about the state of each link.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/672d26809d388621ad1ecd43.md b/curriculum/challenges/german/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/672d26809d388621ad1ecd43.md
index 28deeb7f56..60cf94568b 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/672d26809d388621ad1ecd43.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/672d26809d388621ad1ecd43.md
@@ -10,6 +10,77 @@ dashedName: how-does-isnan-work
Watch the video lecture and answer the questions below.
+# --transcript--
+
+What is `NaN`, and how does `isNaN` work?
+
+In JavaScript, `NaN` stands for "Not a Number". It's a special value that represents an unrepresentable or undefined numerical result. `NaN` is a property of the global object, and it's also considered a type of number in JavaScript, which might seem counterintuitive at first.
+
+`NaN` is typically the result of operations that should return a number but can't produce a meaningful numerical value. For example:
+
+```js
+let result = 0 / 0;
+console.log(result); // Output: NaN
+```
+
+In this case, dividing zero by zero is mathematically undefined, so JavaScript returns `NaN`. One peculiar property of `NaN` is that it's not equal to anything, including itself:
+
+```js
+console.log(NaN === NaN); // Output: false
+```
+
+This unique behavior makes it challenging to check if a value is `NaN` using standard comparison operators. To address this, JavaScript provides the `isNaN()` function. The `isNaN()` function property is used to determine whether a value is `NaN` or not. However, it's important to understand how `isNaN()` works, as it can sometimes produce unexpected results. Here's how `isNaN()` behaves:
+
+```js
+console.log(isNaN(NaN)); // true
+console.log(isNaN(undefined)); // true
+console.log(isNaN({})); // true
+
+console.log(isNaN(true)); // false
+console.log(isNaN(null)); // false
+console.log(isNaN(37)); // false
+
+console.log(isNaN("37")); // false: "37" is converted to 37
+console.log(isNaN("37.37")); // false: "37.37" is converted to 37.37
+console.log(isNaN("")); // false: empty string is converted to 0
+console.log(isNaN(" ")); // false: string with a space is converted to 0
+
+console.log(isNaN("blabla")); // true: "blabla" is not a number
+```
+
+As you can see, `isNaN()` first attempts to convert the parameter to a number. If it can't be converted, it returns `true`. This behavior can lead to some surprising results, especially when dealing with strings that can be coerced into numbers.
+
+Due to these potential inconsistencies, ES6 introduced `Number.isNaN()`. This method does not attempt to convert the parameter to a number before testing. It only returns `true` if the value is exactly `NaN`:
+
+```js
+console.log(Number.isNaN(NaN)); // true
+console.log(Number.isNaN(Number.NaN)); // true
+console.log(Number.isNaN(0 / 0)); // true
+
+console.log(Number.isNaN("NaN")); // false
+console.log(Number.isNaN(undefined)); // false
+console.log(Number.isNaN({})); // false
+console.log(Number.isNaN("blabla")); // false
+```
+
+`Number.isNaN()` provides a more reliable way to check for `NaN` values, especially in cases where type coercion might lead to unexpected results with the global `isNaN()` function. In practice, when dealing with numerical operations or user inputs that should be numbers, it's often necessary to check for `NaN` to handle errors or unexpected inputs gracefully. For example:
+
+```js
+function divide(a, b) {
+ let result = a / b;
+ if (Number.isNaN(result)) {
+ return "Error: Division resulted in NaN";
+ }
+ return result;
+}
+
+console.log(divide(10, 2)); // 5
+console.log(divide(10, 0)); // Infinity
+console.log(divide(0, 0)); // "Error: Division resulted in NaN"
+```
+
+In this example, we're using `Number.isNaN()` to catch cases where the division operation results in `NaN`, allowing us to handle this scenario appropriately. Understanding `NaN` and how to properly check for it is crucial for writing robust JavaScript code, especially when dealing with mathematical operations or parsing user inputs.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/6732808f3221720adc833e81.md b/curriculum/challenges/german/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/6732808f3221720adc833e81.md
index ccae567b85..13585293a8 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/6732808f3221720adc833e81.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/6732808f3221720adc833e81.md
@@ -10,6 +10,52 @@ dashedName: how-do-the-parsefloat-and-parseint-methods-work
Watch the lecture video and answer the questions below.
+# --transcript--
+
+How do the `parseFloat()` and `parseInt()` methods work?
+
+`parseFloat()` and `parseInt()` are two essential methods in JavaScript for converting strings to numbers. These methods are particularly useful when dealing with user input or processing data that comes in string format but needs to be treated as numerical values.
+
+Let's start with `parseFloat()`. This method parses a string argument and returns a floating-point number. It's designed to extract a number from the beginning of a string, even if the string contains non-numeric characters later on. Remember that floats are numbers with decimal points. Here's how `parseFloat()` works:
+
+```js
+console.log(parseFloat("3.14")); // Output: 3.14
+console.log(parseFloat("3.14 abc")); // Output: 3.14
+console.log(parseFloat("3.14.5")); // Output: 3.14
+console.log(parseFloat("abc 3.14")); // Output: NaN
+```
+
+As you can see, `parseFloat()` starts parsing from the beginning of the string and continues until it encounters a character that can't be part of a floating-point number. If it can't find a valid number at the start of the string, it returns `NaN` (Not a Number).
+
+`parseInt()`, on the other hand, parses a string argument and returns an integer. Like `parseFloat()`, it starts from the beginning of the string, but it stops at the first non-digit character. Here's how `parseInt()` works:
+
+```js
+console.log(parseInt("42")); // Output: 42
+console.log(parseInt("42px")); // Output: 42
+console.log(parseInt("3.14")); // Output: 3
+console.log(parseInt("abc123")); // Output: NaN
+```
+
+`parseInt()` stops parsing at the first non-digit it encounters. For floating-point numbers, it returns only the integer part. If it can't find a valid integer at the start of the string, it returns `NaN`.
+
+Both methods have some noteworthy behaviors. They ignore leading whitespace:
+
+```js
+console.log(parseFloat(" 3.14")); // Output: 3.14
+console.log(parseInt(" 42")); // Output: 42
+```
+
+They handle plus and minus signs at the beginning of the string:
+
+```js
+console.log(parseFloat("+3.14")); // Output: 3.14
+console.log(parseInt("-42")); // Output: -42
+```
+
+It's worth noting that while these methods are powerful, they have some limitations. For instance, they don't handle all number formats, such as scientific notation, directly. For more complex parsing needs, you might need to use additional techniques or libraries.
+
+In conclusion, `parseFloat()` and `parseInt()` are valuable tools for converting strings to numbers in JavaScript. Understanding how they work and their specific behaviors allows you to handle numeric data more effectively in your applications, especially when dealing with user inputs or external data sources.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/673280a1c29d0a0b17316e56.md b/curriculum/challenges/german/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/673280a1c29d0a0b17316e56.md
index b371fd65d2..1aa667227f 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/673280a1c29d0a0b17316e56.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/673280a1c29d0a0b17316e56.md
@@ -10,6 +10,50 @@ dashedName: what-is-the-tofixed-method-and-how-does-it-work
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What is the `.toFixed()` method, and how does it work?
+
+The `.toFixed()` method is a built-in JavaScript function that formats a number using fixed-point notation. It's particularly useful when you need to control the number of decimal places in a number, especially for displaying currency values or when working with precise measurements.
+
+The `.toFixed()` method is called on a number and takes one optional argument, which is the number of digits to appear after the decimal point. It returns a string representation of the number with the specified number of decimal places. Here's a basic example of how `.toFixed()` works:
+
+```js
+let num = 3.14159;
+console.log(num.toFixed(2)); // Output: "3.14"
+```
+
+In this case, we're limiting the number of decimal places to two. So, `3.14159` becomes `3.14`. It's important to note that `.toFixed()` returns a string, not a number. This is because the method is primarily intended for formatting numbers for display, not for further calculations.
+
+The `.toFixed()` method rounds the number to the nearest value that can be represented with the specified number of decimal places. This rounding behavior is important to understand:
+
+```js
+console.log((3.14159).toFixed(3)); // Output: "3.142"
+console.log((3.14449).toFixed(3)); // Output: "3.144"
+console.log((3.14550).toFixed(3)); // Output: "3.146"
+```
+
+As you can see, `.toFixed()` rounds up when the next digit is `5` or greater, and rounds down otherwise. If you call `.toFixed()` without arguments, it defaults to `0` decimal places:
+
+```js
+let num = 3.14159;
+console.log(num.toFixed()); // Output: "3"
+```
+
+The `.toFixed()` method can be particularly useful when working with financial calculations or displaying prices:
+
+```js
+let price = 19.99;
+let taxRate = 0.08;
+let total = price + (price * taxRate);
+
+console.log("Total: $" + total.toFixed(2)); // Output: "Total: $21.59"
+```
+
+In this example, `.toFixed(2)` ensures that the total is always displayed with two decimal places, which is standard for currency in many countries.
+
+In conclusion, the `.toFixed()` method is a powerful tool for formatting numbers in JavaScript, particularly when you need to control the display of decimal places. While it's primarily used for formatting output, remember its behavior, especially when precise calculations are needed.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/german/25-front-end-development/lecture-working-with-strings-in-javascript/673263e80dd43da7df3ae565.md b/curriculum/challenges/german/25-front-end-development/lecture-working-with-strings-in-javascript/673263e80dd43da7df3ae565.md
index 9999634949..4aa306a97c 100644
--- a/curriculum/challenges/german/25-front-end-development/lecture-working-with-strings-in-javascript/673263e80dd43da7df3ae565.md
+++ b/curriculum/challenges/german/25-front-end-development/lecture-working-with-strings-in-javascript/673263e80dd43da7df3ae565.md
@@ -2,7 +2,7 @@
id: 673263e80dd43da7df3ae565
title: How Can You Find the Position of a Substring in a String?
challengeType: 11
-videoId: k2QaBPHl_00
+videoId: tTm8t9inci8
dashedName: how-can-you-find-the-position-of-a-substring-in-a-string
---
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-advanced-react/66f1ad049d7a6ac0886cc2ba.md b/curriculum/challenges/german/25-front-end-development/quiz-advanced-react/66f1ad049d7a6ac0886cc2ba.md
index cb439f3337..c21d32edac 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-advanced-react/66f1ad049d7a6ac0886cc2ba.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-advanced-react/66f1ad049d7a6ac0886cc2ba.md
@@ -7,7 +7,7 @@ dashedName: quiz-advanced-react
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-asynchronous-javascript/66edd630f7666cfa54b404d0.md b/curriculum/challenges/german/25-front-end-development/quiz-asynchronous-javascript/66edd630f7666cfa54b404d0.md
index 59a3d2a8e3..269ab6ac91 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-asynchronous-javascript/66edd630f7666cfa54b404d0.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-asynchronous-javascript/66edd630f7666cfa54b404d0.md
@@ -7,7 +7,7 @@ dashedName: quiz-asynchronous-javascript
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-bash-and-sql/66f1affc0ef4fcca423d4688.md b/curriculum/challenges/german/25-front-end-development/quiz-bash-and-sql/66f1affc0ef4fcca423d4688.md
index a5b185a89e..761190010c 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-bash-and-sql/66f1affc0ef4fcca423d4688.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-bash-and-sql/66f1affc0ef4fcca423d4688.md
@@ -7,7 +7,7 @@ dashedName: quiz-bash-and-sql
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-bash-commands/66f1af4fedf643c78d024c5e.md b/curriculum/challenges/german/25-front-end-development/quiz-bash-commands/66f1af4fedf643c78d024c5e.md
index c1d376c0ca..32bd4a6f46 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-bash-commands/66f1af4fedf643c78d024c5e.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-bash-commands/66f1af4fedf643c78d024c5e.md
@@ -7,7 +7,7 @@ dashedName: quiz-bash-commands
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-bash-scripting/66f1afbd9998e9c985d8e73b.md b/curriculum/challenges/german/25-front-end-development/quiz-bash-scripting/66f1afbd9998e9c985d8e73b.md
index 9a81db9e10..56990ab396 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-bash-scripting/66f1afbd9998e9c985d8e73b.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-bash-scripting/66f1afbd9998e9c985d8e73b.md
@@ -7,7 +7,7 @@ dashedName: quiz-bash-scripting
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-basic-css/66ed8fa2f45ce3ece4053eab.md b/curriculum/challenges/german/25-front-end-development/quiz-basic-css/66ed8fa2f45ce3ece4053eab.md
index 288e6b89dd..f444fea6f1 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-basic-css/66ed8fa2f45ce3ece4053eab.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-basic-css/66ed8fa2f45ce3ece4053eab.md
@@ -7,7 +7,7 @@ dashedName: quiz-basic-css
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -39,7 +39,7 @@ Cascading Style Sheets
#### --text--
-Which answer uses the correct structure of using a CSS rule?
+Which of the following is a correct CSS rule?
#### --distractors--
@@ -65,19 +65,19 @@ What does `` do?
#### --distractors--
-Establishes flexbox within the device.
+It links external stylesheets to a webpage for responsive design.
---
-Creates the font for the device.
+It specifies the metadata used by search engines to index a webpage.
---
-Makes the website automatically responsive.
+It specifies the character encoding used on the webpage.
#### --answer--
-Controls the shape and size of the web page from a user's device.
+It controls the shape and size of a web page on different screen sizes.
### --question--
@@ -241,19 +241,19 @@ What statement is TRUE about block-level elements?
#### --distractors--
-Block-level elements don't start on new lines.
+Block-level elements stack horizontally by default.
---
-Block-level elements only takes up as much as it needs.
+`width` and `height` properties usually do not apply to block-level elements unless you set their `display` property to `inline-block`.
---
-Block-level elements come with no margin.
+Block-level elements cannot contain inline elements inside them.
#### --answer--
-Block-level elements start on a new line with margin before and after the element.
+Block-level elements start on a new line and take up the full width of their container.
### --question--
@@ -263,19 +263,19 @@ What statement is TRUE when using the `inline-block` value?
#### --distractors--
-Doesn't allow you to set the height and width.
+Elements stack vertically, always taking up the full width of their container.
---
-Top and bottom margins not respected.
+Elements align horizontally but cannot apply vertical padding or margin.
---
-Adds a line break after an element.
+Elements respect width and height settings but cannot contain other elements inside them.
#### --answer--
-Allows you to place elements next to each other while letting you set the height and width.
+Elements retain inline flow but allow setting width and height.
### --question--
@@ -351,19 +351,19 @@ What does `!important` do in CSS?
#### --distractors--
-It doesn't effect the code.
+It makes the CSS rule work exclusively for inline styles and ignores styles defined in external or internal stylesheets.
---
-Applies to all properties in the code.
+It disables all other CSS properties applied to the same element, effectively making it the only rule that affects the element's styling.
---
-Applies on to a certain selector or group of elements.
+It applies on to a certain selector or group of elements.
#### --answer--
-Overrides any other values applied to the property for that selector.
+It overrides any other values applied to the property for that selector.
### --question--
@@ -373,19 +373,19 @@ How does the CSS Cascade algorithm work?
#### --distractors--
-Determines styles of the element based on alphabetical order.
+It determines styles of the element based on order of declaration, regardless of other factors.
---
-Gives animations to the page.
+It applies styles based solely on the order they are written, ignoring specificity.
---
-Improves Search Engine Optimization (SEO).
+It applies styles prioritizing specificity, ignoring origin and relevance.
#### --answer--
-Determines styles of the element based on specificity and order of declaration.
+It determines styles of the element based on specificity and order of declaration.
### --question--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-basic-html/66df3b712c41c499e9d31e5b.md b/curriculum/challenges/german/25-front-end-development/quiz-basic-html/66df3b712c41c499e9d31e5b.md
index c136b3183d..0b138aa460 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-basic-html/66df3b712c41c499e9d31e5b.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-basic-html/66df3b712c41c499e9d31e5b.md
@@ -7,7 +7,7 @@ dashedName: quiz-basic-html
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-computer-basics/66ed8fb9f45ce3ece4053eac.md b/curriculum/challenges/german/25-front-end-development/quiz-computer-basics/66ed8fb9f45ce3ece4053eac.md
index e59a69ece4..5dd20697f4 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-computer-basics/66ed8fb9f45ce3ece4053eac.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-computer-basics/66ed8fb9f45ce3ece4053eac.md
@@ -7,7 +7,7 @@ dashedName: quiz-computer-basics
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -39,23 +39,23 @@ Motherboard
#### --text--
-Which is not a conventional way to connect a keyboard to the computer?
+What are browser developer tools?
#### --distractors--
-USB Receiver
+Tools for editing browser settings and managing user profiles.
---
-Bluetooth
+Utilities for blocking ads and improving web page performance.
---
-USB Cable
+Software for managing browser extensions and plug-ins.
#### --answer--
-Ethernet Cable
+Built-in features in browsers that help developers debug and inspect websites.
### --question--
@@ -87,25 +87,25 @@ Which of the following is NOT a safe practice when signing in?
#### --distractors--
-Using a fingerprint or face scanner
+Using a fingerprint or face scanner.
---
-Making a long and complex password like `@ppl3_+B@nana34823`
+Making a long and complex password like `@ppl3_+B@nana34823`.
---
-Utilizing a physical USB security key
+Setting up two-factor authentication (2FA).
#### --answer--
-Saving passwords in the browser on a public computer
+Using passwords based on personal information like your birthday.
### --question--
#### --text--
-Which of the following is not a Web Browser?
+Which of the following is NOT a Web Browser?
#### --distractors--
@@ -113,11 +113,11 @@ Safari
---
-Opera GX
+Opera
---
-DuckDuckGo
+Microsoft Edge
#### --answer--
@@ -149,7 +149,7 @@ Visual Studio Code
#### --text--
-Which of the following stores and accesses files on the hard drive?
+Which of the following is used primarily for managing files stored on a local hard drive?
#### --distractors--
@@ -171,45 +171,45 @@ Windows File Explorer
#### --text--
-What is not a good practice when naming files for later use?
+What is NOT a good practice when naming files?
#### --distractors--
-Putting an underscore or hyphen between words
+Putting an underscore or hyphen between words.
---
-Use a casing style such as camelCase and sticking with it
+Use a casing style such as camelCase and sticking with it.
---
-Putting a version number at the end of a document like `summaryReport_v2.docx`
+Putting a version number at the end of a document like `summaryReport_v2.docx`.
#### --answer--
-Being lazy and pounding your keyboard like `asdfloweiueld` to get it over with
+Using non-descriptive names like `file1.txt`.
### --question--
#### --text--
-Which of the following is a way to move files?
+What does the term "domain name" refer to?
#### --distractors--
-Using `Ctrl + X` and `Ctrl + V` (or `Command + X` and `Command + V` on Mac)
+A type of software that manages website files and databases.
---
-Dragging the file and dropping it at the destination
+The physical location of a web server in a data center.
---
-Using a terminal command such as `move` (`mv` on Mac)
+None of the other choices.
#### --answer--
-All of the other choices
+The address used to identify websites on the internet.
### --question--
@@ -219,47 +219,47 @@ Which of the following is a way to send a file to the Recycle Bin/Trash?
#### --distractors--
-All of the other choices
+All of the other choices.
---
-Pressing the `Backspace` key on the keyboard
+Pressing the `Backspace` key on the keyboard.
---
-Moving it to an Archived folder
+Moving it to an Archived folder.
#### --answer--
-Pressing the `Delete` key on the keyboard (`Command + Delete` on Mac)
+Right-click on it and select the Delete/Move to trash option.
### --question--
#### --text--
-Which of the following is not a feature when searching for files locally?
+What is a RAM?
#### --distractors--
-Using boolean operators like `AND`, `OR`, and `NOT`
+A network protocol used for transferring files between devices.
---
-Using filters like `*.jpg`
+A permanent storage device used for saving files and applications.
---
-Using Cortana on Windows or Spotlight Search on Mac
+A component in a computer responsible for generating graphics and rendering images.
#### --answer--
-Typing the name of the file into your Web Browser and hitting `Enter`
+A temporary memory for fast data access by the processor.
### --question--
#### --text--
-What file type will be best suited for writing documentation?
+What file type will be best suited for writing a `README` file?
#### --distractors--
@@ -281,29 +281,29 @@ What file type will be best suited for writing documentation?
#### --text--
-Which of the following is not a configuration file?
+What is an Integrated Development Environment (IDE)?
#### --distractors--
-`.env`
+A platform designed for deploying and hosting web applications.
---
-`.build`
+A type of hardware device used for testing and debugging electronic circuits.
---
-`.yaml` or `.yml`
+A version control system that helps developers track changes in source code during software development.
#### --answer--
-`.log`
+A program that integrates tools for writing, debugging, and running code.
### --question--
#### --text--
-A piece of software that allows you to look at online content is called a:
+What is a piece of software that allows you to look at online content called?
#### --distractors--
@@ -325,7 +325,7 @@ Web Browser
#### --text--
-A piece of software that lists web pages related to a user's query is a called a:
+What is a piece of software that lists web pages related to a user's query called?
#### --distractors--
@@ -347,7 +347,7 @@ Search Engine
#### --text--
-A set of one or more web pages under one domain name is called a:
+What is a set of one or more web pages under one domain name called?
#### --distractors--
@@ -369,15 +369,15 @@ Website
#### --text--
-To search for an exact phrase, you should use what character?
+To search for an exact phrase, what should you enclose your search query with?
#### --distractors--
-Backtick
+Backticks
---
-Parenthesis
+Parentheses
---
@@ -391,65 +391,65 @@ Quotation marks
#### --text--
-Which is not a way to install a Web Browser?
+Which is NOT a way to install a Web Browser?
#### --distractors--
-Using a Package Manager
+Using a Package Manager.
---
-Directly downloading from the website
+Directly downloading from the website.
---
-Using an App Store like Microsoft Store
+Using an App Store like Microsoft Store.
#### --answer--
-Pressing the Network/Internet button in Settings
+Pressing the Network/Internet button in Settings.
### --question--
#### --text--
-Which of these peripherals is an input device?
+Which of the following formats does NOT preserve image quality after compression?
#### --distractors--
-Projector
+All of the other choices.
---
-Speakers
+PNG
---
-Monitor
+SVG
#### --answer--
-Microphone
+JPEG
### --question--
#### --text--
-Which of the following lists of parts can all be found in the circuit board?
+Which of the following parts can be found in the circuit board?
#### --distractors--
-Printer, Router, USB Ports
+Printer and Router.
---
-Mouse, Keyboard, Monitor
+Mouse and Keyboard.
---
-Motherboard, Hard Drive, GPU
+Hard Drive and GPU.
#### --answer--
-BIOS/UEFI Chip, CPU, RAM
+CPU and RAM.
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-css-accessibility/66ed8fc1f45ce3ece4053ead.md b/curriculum/challenges/german/25-front-end-development/quiz-css-accessibility/66ed8fc1f45ce3ece4053ead.md
index 019e90821e..414d24f413 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-css-accessibility/66ed8fc1f45ce3ece4053ead.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-css-accessibility/66ed8fc1f45ce3ece4053ead.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-accessibility
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-css-animations/66ed8fc9f45ce3ece4053eae.md b/curriculum/challenges/german/25-front-end-development/quiz-css-animations/66ed8fc9f45ce3ece4053eae.md
index 4befddea1b..f3355ce004 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-css-animations/66ed8fc9f45ce3ece4053eae.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-css-animations/66ed8fc9f45ce3ece4053eae.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-animations
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-css-attribute-selectors/66ed8fd0f45ce3ece4053eaf.md b/curriculum/challenges/german/25-front-end-development/quiz-css-attribute-selectors/66ed8fd0f45ce3ece4053eaf.md
index 8e578e4f09..725a82871d 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-css-attribute-selectors/66ed8fd0f45ce3ece4053eaf.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-css-attribute-selectors/66ed8fd0f45ce3ece4053eaf.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-attribute-selectors
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-css-backgrounds-and-borders/66ed8fd7f45ce3ece4053eb0.md b/curriculum/challenges/german/25-front-end-development/quiz-css-backgrounds-and-borders/66ed8fd7f45ce3ece4053eb0.md
index 7558dd38a0..05c1d209c7 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-css-backgrounds-and-borders/66ed8fd7f45ce3ece4053eb0.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-css-backgrounds-and-borders/66ed8fd7f45ce3ece4053eb0.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-backgrounds-and-borders
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-css-colors/66ed8fe1f45ce3ece4053eb1.md b/curriculum/challenges/german/25-front-end-development/quiz-css-colors/66ed8fe1f45ce3ece4053eb1.md
index 449e3fe6e7..7475192583 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-css-colors/66ed8fe1f45ce3ece4053eb1.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-css-colors/66ed8fe1f45ce3ece4053eb1.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-colors
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -413,91 +413,59 @@ Which color model includes the `hue` component?
#### --text--
-Which of the following is the correct syntax to create a CSS variable with a fallback value?
+Which color function also allows you to set the opacity of the color?
#### --distractors--
```css
-.element {
- color: var(--main-color; red);
-}
+hsl(0, 20%, 30%, 50%)
```
---
```css
-.element {
- color: var(--main-color);
-}
+rgb(20, 30, 80, 0.5)
```
---
```css
-.element {
- color: var(--main-color: red);
-}
+rgba(20, 30, 80)
```
#### --answer--
```css
-.element {
- color: var(--main-color, red);
-}
+hsla(0, 20%, 30%, 50%)
```
### --question--
#### --text--
-How can you use CSS variables to dynamically change the color of multiple elements?
+Which of the following is the correct way to give an element a top-to-bottom red-to-blue gradient background?
#### --distractors--
```css
-:root {
- primary-color: blue;
-}
-
-.element1, .element2 {
- color: --primary-color;
-}
+background: radial-gradient(red, blue)
```
---
```css
-body {
- --color: blue;
-}
-
-.element1, .element2 {
- color: var(color);
-}
+background: radial-gradient(blue, red)
```
---
```css
-:root {
- primary: blue;
-}
-
-.element1, .element2 {
- color: var(--primary);
-}
+background: linear-gradient(blue, red)
```
#### --answer--
```css
-:root {
- --primary-color: blue;
-}
-
-.element1, .element2 {
- color: var(--primary-color);
-}
+background: linear-gradient(red, blue)
```
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-css-flexbox/66ed8fe7f45ce3ece4053eb2.md b/curriculum/challenges/german/25-front-end-development/quiz-css-flexbox/66ed8fe7f45ce3ece4053eb2.md
index 64800f658e..802c8e1a5e 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-css-flexbox/66ed8fe7f45ce3ece4053eb2.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-css-flexbox/66ed8fe7f45ce3ece4053eb2.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-flexbox
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-css-grid/66ed8fedf45ce3ece4053eb3.md b/curriculum/challenges/german/25-front-end-development/quiz-css-grid/66ed8fedf45ce3ece4053eb3.md
index 212a4d9174..3a1db70a11 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-css-grid/66ed8fedf45ce3ece4053eb3.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-css-grid/66ed8fedf45ce3ece4053eb3.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-grid
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-css-layout-and-effects/66ed8ff4f45ce3ece4053eb4.md b/curriculum/challenges/german/25-front-end-development/quiz-css-layout-and-effects/66ed8ff4f45ce3ece4053eb4.md
index 96fa9703af..1a0901cda1 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-css-layout-and-effects/66ed8ff4f45ce3ece4053eb4.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-css-layout-and-effects/66ed8ff4f45ce3ece4053eb4.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-layout-and-effects
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-css-libraries-and-frameworks/66f1aeb60b11aec5abe83c2e.md b/curriculum/challenges/german/25-front-end-development/quiz-css-libraries-and-frameworks/66f1aeb60b11aec5abe83c2e.md
index 1becf6756e..9c4658cd5a 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-css-libraries-and-frameworks/66f1aeb60b11aec5abe83c2e.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-css-libraries-and-frameworks/66f1aeb60b11aec5abe83c2e.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-libraries-and-frameworks
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-css-positioning/66ed8ffcf45ce3ece4053eb5.md b/curriculum/challenges/german/25-front-end-development/quiz-css-positioning/66ed8ffcf45ce3ece4053eb5.md
index 9ac0e24c3c..36b0a03ebf 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-css-positioning/66ed8ffcf45ce3ece4053eb5.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-css-positioning/66ed8ffcf45ce3ece4053eb5.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-positioning
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -17,438 +17,594 @@ To pass the quiz, you must correctly answer at least 17 of the 20 questions belo
#### --text--
-What is the main purpose of the `float` property in CSS?
+Which of the following is NOT a valid value for the `position` property?
#### --distractors--
-To create rounded corners.
+`fixed`
---
-To control opacity.
+`absolute`
---
-To center vertically.
+`relative`
#### --answer--
-To align elements to either the left or the right of their container.
+`above`
### --question--
#### --text--
-Which CSS property is used to set the stack order of an element?
+What is the main purpose of the `float` property in CSS?
#### --distractors--
-`position`
+Floats are used to remove an element from its normal flow on the page and automatically position it in the upper right hand side of the webpage.
---
-`bg-green`
+Floats are used to remove an element from its normal flow on the page and position it to the top of its container.
---
-`float`
+Floats are used to remove an element from its normal flow on the page and automatically position it to the bottom right hand side of webpage.
#### --answer--
-`z-index`
+Floats are used to remove an element from its normal flow on the page and position it either on the left or right side of its container.
### --question--
#### --text--
-What happens when you apply `position: relative` to an element in CSS?
+Which of the following is an example making a box element float to the left?
#### --distractors--
-It removes the element from document flow.
+```css
+.box {
+ left: float;
+ margin-right: 15px;
+ width: 50px;
+ height: 50px;
+ background-color: black;
+}
+```
---
-It only moves the element relative to the viewport.
+```css
+.box {
+ position: float-left;
+ margin-right: 15px;
+ width: 50px;
+ height: 50px;
+ background-color: black;
+}
+```
---
-It positions the element in a fixed position relative to the viewport.
+```css
+.box {
+ float: left-side;
+ margin-right: 15px;
+ width: 50px;
+ height: 50px;
+ background-color: black;
+}
+```
#### --answer--
-It moves the element relative to its default position in the document.
+```css
+.box {
+ float: left;
+ margin-right: 15px;
+ width: 50px;
+ height: 50px;
+ background-color: black;
+}
+```
### --question--
#### --text--
-Which CSS property would you use to fix an element at a certain position on the page so that it does not move when scrolling occurs?
+What is the role of the `clear` property?
#### --distractors--
-`position: absolute`
+It is used to determine if an element needs to be moved to the bottom of the page.
---
-`position: relative`
+It is used to determine if an element needs to be completely cleared from the page.
---
-`display: block`
+It is used to determine if an element needs to be fixed to the top of the page.
#### --answer--
-`position: fixed`
+It is used to determine if an element needs to be moved below the floated content.
### --question--
#### --text--
-If an element has `position: absolute`, what element is it positioned relatively to?
+Which CSS property is used to control the vertical stacking order of positioned elements that overlap on the page?
#### --distractors--
-The closest ancestor with `position: fixed`.
+`position`
---
-The closest ancestor with `position: absolute`.
+`bg-green`
---
-The `` element.
+`float`
#### --answer--
-The closest positioned ancestor with `position` set to `relative`, `absolute`, or `fixed`.
+`z-index`
### --question--
#### --text--
-Which positioning method allows an element to stick to a defined position only when you scroll past a certain point?
+Which of the following is the correct syntax for relative positioning?
#### --distractors--
-`position: float`
+```css
+.relative {
+ position: relative-position;
+ top: 30px;
+ left: 30px;
+}
+```
---
-`position: fixed`
+```css
+.relative {
+ relative-position: relative;
+ top: 30px;
+ left: 30px;
+}
+```
---
-`position: absolute`
+```css
+.relative {
+ relative: position;
+ top: 30px;
+ left: 30px;
+}
+```
#### --answer--
-`position: sticky`
-
-### --question--
-
-#### --text--
-
-Given the following code:
-
```css
-#box1 {
+.relative {
position: relative;
- z-index: 1;
+ top: 30px;
+ left: 30px;
}
+```
-#box2 {
- position: relative;
- z-index: 2;
-}
+### --question--
-#box3 {
- position: relative;
- z-index: -1;
-}
-```
+#### --text--
-How will `#box3` be positioned on the page?
+Which CSS property would you use to fix an element at a certain position on the page so that it does not move when scrolling occurs?
#### --distractors--
-It will be stacked above all the other elements on the page.
+`position: no-scroll;`
---
-It will disappear from view.
+`position: relative;`
---
-It will stay at the bottom corner of the page.
+`display: block;`
#### --answer--
-It will be stacked below all the other elements on the page.
+`position: fixed;`
### --question--
#### --text--
-How does a floated element affect the layout of surrounding elements?
+What does absolute positioning do to an element?
#### --distractors--
-Other elements are placed in relation to the floated element.
+Absolute positioning is used to determine if an element needs to be moved below the floated content.
---
-The surrounding elements ignore the floated element and overlap it.
+Absolute positioning is used to position the element within the normal document flow.
---
-It will shift surrounding elements behind the floated element.
+Absolute positioning is used to control the vertical stacking order of positioned elements that overlap on the page.
#### --answer--
-Block elements surrounding it flow around the floated element.
+Absolute positioning allows you to take an element out of the normal document flow, making it behave independently from other elements.
### --question--
#### --text--
-What does an element with `position: sticky` require for it to work?
+Which of the following is NOT a valid property that you can use for absolute positioning?
#### --distractors--
-A `position: relative` parent element.
+`right`
---
-A `z-index` value greater than 1.
+`bottom`
---
-A `z-index` of 0 or greater.
+`top`
#### --answer--
-A declared `top`, `left`, `right`, or `bottom` property.
+`side`
### --question--
#### --text--
-What happens when setting the `overflow` property of a parent to `auto` and one of its children has the property `position: sticky`?
+What is the key difference between relative and absolute positioning?
#### --distractors--
-The child element's sticky behavior is not affected by the `overflow` property of the parent.
+Absolute positioning sets the element in a sticky position while relative positioning takes an element out of the normal document flow.
---
-The sticky element will maintain its behavior regardless of scrolling.
+Relative positioning sets the element in a fixed position while absolute positioning takes an element out of the normal document flow.
---
-The sticky element will act as if it has `position: fixed` within the parent.
+Absolute positioning positions the element within the normal document flow while relative positioning takes an element out of the normal document flow.
#### --answer--
-The child will lose its sticky behavior when the parent scrolls.
+Relative positioning positions the element within the normal document flow while absolute positioning takes an element out of the normal document flow.
### --question--
#### --text--
-Which of the following properties is used to offset a positioned element from its normal position?
+Which of the following is an example of positioning a box in the upper left hand corner of the page?
#### --distractors--
-`float`
+```css
+.box {
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ background-color: coral;
+ width: 50px;
+ height: 50px;
+}
+```
---
-`padding-right`
+```css
+.box {
+ position: absolute;
+ top: 0;
+ right: 0;
+ background-color: coral;
+ width: 50px;
+ height: 50px;
+}
+```
---
-`margin-right`
+```css
+.box {
+ position: absolute;
+ bottom: 0;
+ right: 0;
+ background-color: coral;
+ width: 50px;
+ height: 50px;
+}
+```
#### --answer--
-`right`
+```css
+.box {
+ position: absolute;
+ top: 0;
+ left: 0;
+ background-color: coral;
+ width: 50px;
+ height: 50px;
+}
+```
### --question--
#### --text--
-How does a floated element impact the height of its containing block when the containing block does not have an explicit height defined?
+Which positioning method allows an element to stick to a defined position only when you scroll past a certain point?
#### --distractors--
-The height of the containing block is automatically expanded to fit the floated element.
+Float positioning
---
-The height will automatically adapt to fit all the floated elements.
+Fixed positioning
---
-The containing block will automatically apply `clear: both` to fit the floated element.
+Absolute positioning
#### --answer--
-The containing block will collapse, completely ignoring its floated element height.
+Sticky positioning
### --question--
#### --text--
-Which of the following CSS techniques is an accepted method for preventing a parent container from shrinking in size when it contains only floated elements?
+Which of the following is a correct example of using sticky positioning?
#### --distractors--
-Set `float: none` to the container.
+```css
+.box {
+ sticky: position;
+ top: 30px;
+ right: 30px;
+ width: 50px;
+ height: 50px;
+ background-color: red;
+}
+```
---
-Add `margin: auto` to the parent container.
+```css
+.box {
+ position: sticky-fixed;
+ top: 30px;
+ right: 30px;
+ width: 50px;
+ height: 50px;
+ background-color: red;
+}
+```
---
-Use the `position: relative` on the parent container.
+```css
+.box {
+ position: sticky-top;
+ right: 30px;
+ width: 50px;
+ height: 50px;
+ background-color: red;
+}
+```
#### --answer--
-Adding the property `overflow: auto` or `overflow: hidden` to the parent container.
+```css
+.box {
+ position: sticky;
+ top: 30px;
+ right: 30px;
+ width: 50px;
+ height: 50px;
+ background-color: red;
+}
+```
### --question--
#### --text--
-When a floating element is followed by non-floating inline elements, how will their layout be affected?
+What is the difference between sticky and fixed positioning?
#### --distractors--
-The inline elements will be positioned below the floated element.
+Sticky elements can only be used in table layouts while fixed elements can be used in any type of CSS layout.
---
-Inline elements will always be on top of the floated element.
+Sticky elements will always remain in the same position while fixed elements will stick to a certain point then behave like relative elements.
---
-The inline elements will overlap the floated element.
+Fixed elements will be positioned relative to its normal position while sticky elements will only stick to a certain point then behave like relative elements.
#### --answer--
-Inline elements will wrap around the floated element if there is enough space.
+Fixed elements will remain in the same position on the screen while sticky elements will only stick to a certain point then behave like relative elements.
### --question--
#### --text--
-What happens when `clear: both` is applied to an element following two floated elements - one left and one right - in a container?
+What problem did the `clearfix` hack solve when working with floats?
#### --distractors--
-The element will be positioned to the left of the floated elements.
+The `clearfix` hack helped solve the issue of floated elements being removed from the normal document flow and being placed in a fixed position on the page.
---
-The element will align between the two floated elements.
+The `clearfix` hack helped solve the issue of floated elements not being responsive in mobile and tablet layouts.
---
-The element will wrap around the floated elements depending on space.
+The `clearfix` hack helped solve the issue of floated elements disappearing from the page.
#### --answer--
-The element will be underneath both floated elements - the float breaks.
+The `clearfix` hack helped solve the issue of overlaps and collapsing in the layouts when multiple floated elements were stacked next to each other.
### --question--
#### --text--
-When does an element with `z-index: auto` create a new stacking context?
+Which of the following is a correct example for using the `clearfix` hack?
#### --distractors--
-When combined with `position: absolute` or `position: relative`.
+```css
+.clearfix::before {
+ position: fixed;
+ top: 0;
+ width: 100%;
+ clear: both;
+}
+```
---
-When its parent element has `z-index: auto` and `position: fixed`.
+```css
+.clearfix::after {
+ position: relative;
+ top: 30px;
+ left: 30px;
+ clear: all;
+}
+```
---
-When it is combined with `float: left`, if two sibling elements are of the same `z-index` and absolutely positioned.
+```css
+.clearfix::before {
+ top: 30px;
+ clear: none;
+}
+```
#### --answer--
-In combination with `position: fixed` or `position: sticky`.
+```css
+.clearfix::after {
+ content: "";
+ display: block;
+ clear: both;
+}
+```
### --question--
#### --text--
-If two sibling elements have the same `z-index` and are both positioned absolutely using `position: absolute`, what determines which one is on top?
+What is static positioning?
#### --distractors--
-It rearranges the sibling elements in relation to its new position.
+This is used to remove an element from its normal flow on the page and automatically position it in the upper right hand side of the webpage.
---
-Adding `z-index: auto` to the parent container.
+This allows you to take an element out of the normal document flow, making it behave independently from other elements.
---
-Using `position: relative` on the parent container.
+This allows an element to stick to a defined position only when you scroll past a certain point.
#### --answer--
-The document source order (HTML position).
+This is the normal flow for the document. Elements are positioned from top to bottom and left to right one after another.
### --question--
#### --text--
-In what way will the property `position: relative` exert an effect on sibling elements in regards to document flow?
+Which of the following is an example of setting the navbar to the top of the page using fixed positioning?
#### --distractors--
-It removes the element from the normal document flow, which affects the positions of siblings.
+```css
+.navbar {
+ fixed: top;
+ top: 0;
+ width: 100%;
+}
+```
---
-The relative element will move by the parent's top and left properties.
+```css
+.navbar {
+ upper: fixed;
+ width: 100%;
+}
+```
---
-It creates a new stacking context which lifts the element in relation to any siblings.
+```css
+.navbar {
+ position: fixed-top;
+ top: 0;
+ width: 100%;
+}
+```
#### --answer--
-It allows the element to shift without affecting the document flow of sibling elements.
+```css
+.navbar {
+ position: fixed;
+ top: 0;
+ width: 100%;
+}
+```
### --question--
#### --text--
-What happens when a `position: relative` element is nested inside of a `position: absolute` parent, with `top` and `left` values set?
+Which of the following is a valid value to use for the `z-index` property?
#### --distractors--
-It moves relative to the parent element's original position.
+`12.0`
---
-It moves with respect to the absolute coordinates of the containing parent element.
+`none`
---
-It will never create a new stacking context regardless of the `z-index` value.
+`up`
#### --answer--
-It ignores the positioning of the parent and moves relative to its normal position.
+`1`
### --question--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-css-pseudo-classes/66ed9002f45ce3ece4053eb6.md b/curriculum/challenges/german/25-front-end-development/quiz-css-pseudo-classes/66ed9002f45ce3ece4053eb6.md
index 3e9e2dd892..3f797ae969 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-css-pseudo-classes/66ed9002f45ce3ece4053eb6.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-css-pseudo-classes/66ed9002f45ce3ece4053eb6.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-pseudo-classes
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-css-relative-and-absolute-units/66ed9009f45ce3ece4053eb7.md b/curriculum/challenges/german/25-front-end-development/quiz-css-relative-and-absolute-units/66ed9009f45ce3ece4053eb7.md
index 0ee4e9ffcf..fdbceb80b1 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-css-relative-and-absolute-units/66ed9009f45ce3ece4053eb7.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-css-relative-and-absolute-units/66ed9009f45ce3ece4053eb7.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-relative-and-absolute-units
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-css-typography/66ed9010f45ce3ece4053eb8.md b/curriculum/challenges/german/25-front-end-development/quiz-css-typography/66ed9010f45ce3ece4053eb8.md
index 45ba4f942a..2db93157b5 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-css-typography/66ed9010f45ce3ece4053eb8.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-css-typography/66ed9010f45ce3ece4053eb8.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-typography
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-css-variables/66ed9018f45ce3ece4053eb9.md b/curriculum/challenges/german/25-front-end-development/quiz-css-variables/66ed9018f45ce3ece4053eb9.md
index 7eee5f9ae0..80f213dbb3 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-css-variables/66ed9018f45ce3ece4053eb9.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-css-variables/66ed9018f45ce3ece4053eb9.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-variables
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-debugging-javascript/66edd10913f078e7669eca81.md b/curriculum/challenges/german/25-front-end-development/quiz-debugging-javascript/66edd10913f078e7669eca81.md
index eab6ee36ca..09f6c2d29e 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-debugging-javascript/66edd10913f078e7669eca81.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-debugging-javascript/66edd10913f078e7669eca81.md
@@ -7,7 +7,7 @@ dashedName: quiz-debugging-javascript
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-design-fundamentals/66ed901ff45ce3ece4053eba.md b/curriculum/challenges/german/25-front-end-development/quiz-design-fundamentals/66ed901ff45ce3ece4053eba.md
index c687e078a1..17d106d010 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-design-fundamentals/66ed901ff45ce3ece4053eba.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-design-fundamentals/66ed901ff45ce3ece4053eba.md
@@ -7,7 +7,7 @@ dashedName: quiz-design-fundamentals
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -39,7 +39,7 @@ Creates visual hierarchy, improves readability, focuses the viewer's attention o
#### --text--
-What is the design principle of carefully choosing the size of elements in relation to each other and the layout?
+What is the design principle of carefully choosing the size of elements in relation to each other?
#### --distractors--
@@ -65,25 +65,25 @@ Which of the following sites would most likely benefit from using breadcrumbs?
#### --distractors--
-A single-page portfolio site.
+A single-page portfolio site
---
-An infinite scroll gallery site.
+An infinite scroll gallery site
---
-A simple blog with only a few posts.
+A simple blog with only a few posts
#### --answer--
-A complex e-commerce site with multiple categories and subcategories.
+A complex e-commerce site with multiple categories and subcategories
### --question--
#### --text--
-What design pattern allows users to access and interact with specific elements and content on a website without or while deferring registration?
+Which design pattern allows users to access and interact with elements and content on a website without requiring immediate registration?
#### --distractors--
@@ -105,19 +105,19 @@ Deferred/lazy registration
#### --text--
-What are the three main types of text alignment?
+What are three types of text alignment?
#### --distractors--
-Vertical, center, horizontal
+Top, center, horizontal
---
-Left, right, justified
+Left, right, middle
---
-Vertical, horizontal, justified
+Vertical, horizontal, equal
#### --answer--
@@ -171,7 +171,7 @@ Elements that are strikingly different from each other visually
#### --text--
-In the examples below, which one is an example of visual hierarchy in design?
+Which of the following is an example of visual hierarchy in design?
#### --distractors--
@@ -197,7 +197,7 @@ What is a common goal of conducting exit interviews in user research?
#### --distractors--
-To increase the number of new users.
+To increase the number of new users
---
@@ -205,11 +205,11 @@ To test new features with existing users
---
-To gather data for A/B testing.
+To gather data for A/B testing
#### --answer--
-To understand the factors causing user churn.
+To understand the factors causing user churn
### --question--
@@ -285,19 +285,19 @@ How can user research impact user requirements?
#### --distractors--
-It has no impact on user requirements.
+It has no impact on user requirements
---
-It only affects non-functional requirements.
+It only affects non-functional requirements
---
-It only affects functional requirements.
+It only affects functional requirements
#### --answer--
-It can help define and refine user requirements based on user feedback.
+It can help define and refine user requirements based on user feedback
### --question--
@@ -307,63 +307,63 @@ Why is it important for a design brief to be reviewed and approved by all stakeh
#### --distractors--
-To ensure everyone is aware of the project's social media strategy.
+To ensure everyone is aware of the project's social media strategy
---
-To finalize the color palette and design elements.
+To finalize the color palette and design elements
---
-To determine the project's marketing budget.
+To determine the project's marketing budget
#### --answer--
-To confirm that all stakeholders agree on the project's objectives and requirements.
+To confirm that all stakeholders agree on the project's objectives and requirements
### --question--
#### --text--
-What is one bad practice method for implementing infinite scroll?
+What is considered bad practice when implementing infinite scroll?
#### --distractors--
-Allow users to jump to a page or section through the navbar or a pagination drop down menu
+Allowing users to jump to a page or section through the navbar or a pagination drop down menu
---
-Add a load more indicator or symbol after a certain point in the page along with the infinite scroll
+Adding a load more indicator or symbol after a certain point in the page along with the infinite scroll
---
-Integrate a footer reveal at the bottom
+Integrating a footer reveal at the bottom
#### --answer--
-No back to top button, alternative methods of navigating the page, and very long inefficient scrolling
+Not adding alternative methods of navigating the page
### --question--
#### --text--
-What is one bad practice for working with images?
+Which of the following is a best practice when designing progress indicators for forms?
#### --distractors--
-Make important images stand out by being larger in size
+Requiring users to restart the form if they navigate away from the page
---
-Separate text and images into columns or rows
+Keeping the progress indicator small and discreet
---
-Put images outside the layout and important ones on their own or full screen
+Making sure the progress is just displayed visually without any text
#### --answer--
-Images placed in the middle of text paragraphs with very little margin space for separation
+Breaking the progress indicator into labeled sections
### --question--
@@ -381,7 +381,7 @@ Do not allow users to add or remove items from the cart
---
-Include a checkout summary on another page
+Automatically add products to the cart without user interaction
#### --answer--
@@ -391,7 +391,7 @@ Include thumbnail images of products in the cart
#### --text--
-Dark mode doesn't mean pure black. What are some colors and good techniques to create a good dark mode color scheme?
+Dark mode doesn't mean pure black. What is a good technique to create an effective dark mode color scheme?
#### --distractors--
@@ -439,17 +439,17 @@ What is a design brief?
#### --distractors--
-A design brief is a document outlining the programming and design standards of the project
+A document outlining the programming and design standards of the project
---
-A design brief is a document explaining how to replicate a design
+A document explaining how to replicate a design
---
-A design brief is a document with detailed information of icons, colors, and assets the designer should use
+A document with detailed information of icons, colors, and assets the designer should use
#### --answer--
-A design brief states the goals and project scope, budget, design requirements, and other important details of the project
+A document stating the goals and project scope, budget and design requirements
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-dom-manipulation-and-click-event-with-javascript/66edd07682767adff3a6231e.md b/curriculum/challenges/german/25-front-end-development/quiz-dom-manipulation-and-click-event-with-javascript/66edd07682767adff3a6231e.md
index 73d4b048ea..50a47ba445 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-dom-manipulation-and-click-event-with-javascript/66edd07682767adff3a6231e.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-dom-manipulation-and-click-event-with-javascript/66edd07682767adff3a6231e.md
@@ -7,7 +7,7 @@ dashedName: quiz-dom-manipulation-and-click-event-with-javascript
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -276,7 +276,7 @@ Which of these does not set the element text color to `red`.
#### --text--
-In the case of a click event, which `Event` property returns the clicked sub-element that triggerred the parent's callback?
+In the case of a click event, which `Event` property returns the clicked sub-element that triggered the parent's callback?
#### --distractors--
@@ -427,7 +427,7 @@ The first parameter is the function callback and the second is the delay duratio
---
-`setTimeout` calls a function once after a delay and `setInterval` call a function continously after an interval delay.
+`setTimeout` calls a function once after a delay and `setInterval` call a function continuously after an interval delay.
---
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-form-validation-with-javascript/66edd3403d7077eece6dc4b6.md b/curriculum/challenges/german/25-front-end-development/quiz-form-validation-with-javascript/66edd3403d7077eece6dc4b6.md
index 6a20dd01ac..a722b78020 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-form-validation-with-javascript/66edd3403d7077eece6dc4b6.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-form-validation-with-javascript/66edd3403d7077eece6dc4b6.md
@@ -7,7 +7,7 @@ dashedName: quiz-form-validation-with-javascript
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-git/66f1b06a5a5d10cc100af620.md b/curriculum/challenges/german/25-front-end-development/quiz-git/66f1b06a5a5d10cc100af620.md
index bad816f377..d15e929765 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-git/66f1b06a5a5d10cc100af620.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-git/66f1b06a5a5d10cc100af620.md
@@ -7,7 +7,7 @@ dashedName: quiz-git
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-html-accessibility/66ed9026f45ce3ece4053ebb.md b/curriculum/challenges/german/25-front-end-development/quiz-html-accessibility/66ed9026f45ce3ece4053ebb.md
index 0b7b3e0703..97fddd99d5 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-html-accessibility/66ed9026f45ce3ece4053ebb.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-html-accessibility/66ed9026f45ce3ece4053ebb.md
@@ -7,7 +7,7 @@ dashedName: quiz-html-accessibility
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -21,41 +21,74 @@ What is accessibility?
#### --distractors--
-Accessibility focuses on making websites faster to load.
+Accessibility is a set of standardized practices that ensures your code is free from all security risks.
---
-Accessibility is a belief to make websites compatible with older browsers.
+Accessibility is a set of standardized practices that enhances the speed and performance for your web applications.
---
-Accessibility is a type of coding style.
+Accessibility is a set of standardized practices that ensures your code meets 100% test coverage.
#### --answer--
-Accessibility is a set of standardized practices that help make online content more usable by people with disabilities.
+Accessibility is a set of standardized practices to ensure your web applications can be used by everyone, including those with disabilities.
+
### --question--
#### --text--
-What is a best practice for creating accessible headings?
+Which of the following is a good example for proper heading level structure?
#### --distractors--
-Add SEO-friendly keywords.
+```html
+Heading 3
+Heading 3
+Heading 3
+
+Heading 1
+Heading 2
+Heading 4
+```
---
-Create humorous headings.
+```html
+Heading 6
+
+Heading 1
+Heading 1
+
+Heading 5
+
+Heading 2
+Heading 2
+```
---
-Place `h6` headings at the beginning of your webpage.
+```html
+Heading 6
+Heading 5
+Heading 4
+Heading 3
+Heading 2
+Heading 1
+```
#### --answer--
-Put headings in hierarchical order.
+```html
+Heading 1
+Heading 2
+Heading 3
+Heading 4
+Heading 5
+Heading 6
+```
### --question--
@@ -113,89 +146,91 @@ alt=""
#### --text--
-What is WAI-ARIA?
+What does WAI-ARIA stand for?
#### --distractors--
-WAI-ARIA is a programming language specifically designed for creating animated web graphics.
+Website Accessible Initiative - Accessible Rust Internet Applications
---
-WAI-ARIA is a set of guidelines for making websites more visually appealing and colorful.
+Web Anchor Initiative - Anchor Rich Internet Applications
---
-WAI-ARIA is a tool for optimizing website loading speeds and server performance.
+Web Accessibility Initial - Accessible Ready Internet Applications
#### --answer--
-WAI-ARIA is a set of standardized practices that helps make online content more accessible to people with disabilities.
+Web Accessibility Initiative - Accessible Rich Internet Applications
### --question--
#### --text--
-What is the function of the `hidden` attribute?
+What is the role of the `aria-hidden` attribute?
#### --distractors--
-To shrink the focused elements.
+This attribute is used to hide elements only for users with visual impairments.
---
-To add tabs.
+This attribute is used to hide and add label text for an element.
---
-To hide an HTML form.
+This attribute is used to hide an element only to keyboard users.
#### --answer--
-To prevent an element from being rendered.
+This attribute is used to hide an element from people using assistive technologies.
### --question--
#### --text--
-What is the function of the `tabindex` attribute?
+Which attribute makes elements focusable and defines the relative order in which they are navigated using the keyboard?
#### --distractors--
-To change the color of focused elements.
+`keyboardindex`
---
-To shrink the focused elements.
+`tabbingindex`
---
-To add tabs.
+`indextab`
#### --answer--
-To control keyboard navigation order and allow programmatic focus on elements that aren't accessible via keyboard.
+`tabindex`
### --question--
#### --text--
-Which of the following is a best practice for creating accessible data tables?
+Why is it a good practice to include the `caption` element inside an HTML table?
#### --distractors--
-Add a caption by using the `` tag.
+It enhances the table's appearance by adding a decorative header.
---
-Use the `aria-label` attribute to make sure that the data cells associate with the proper header.
+It allows users to easily sort and filter the table's data.
---
-Use absolute sizing to make sure that the data cells are not too large.
+It helps improve the table's responsiveness on mobile devices.
+
#### --answer--
-Designate row and/or column headers by using `` elements.
+It is helpful for users to quickly understand the table's purpose and content.
+
### --question--
@@ -223,67 +258,87 @@ The `aria-labelledby` attribute allows you to give an element an accessible name
#### --text--
-What is the function of the `aria-selected` attribute?
+Which of the following ARIA states is used to indicate that an element is selected?
#### --distractors--
-To change the font size of an element.
+`aria-haspopup`
---
-To change the background color of an element.
+`aria-label`
---
-To shrink an element.
+`aria-expanded`
#### --answer--
-To indicate if an element is selected.
+`aria-selected`
### --question--
#### --text--
-What is the function of `aria-expanded`?
+Which of the following is NOT a common ARIA state?
#### --distractors--
-To change the font size of an element.
+`aria-hidden`
---
-To change the background color of an element.
+`aria-checked`
---
-To shrink an element.
+`aria-disabled`
#### --answer--
-To indicate whether a control is currently expanded or collapsed, and whether its associated content is displayed or hidden.
+`aria-columns`
### --question--
#### --text--
-What is the correct way to give an input a label?
+Which of the following examples is the correct way to associate a `label` with an `input` element?
#### --distractors--
-Give the input a `name` attribute.
+```html
+
+```
---
-Add placeholder text to the input.
+```html
+
+```
---
-Pair the input with a `p` element.
+```html
+
+```
#### --answer--
-Use the `for` attribute on `label`s and matching `id` attribute on `input`s to associate them.
+```html
+
+```
### --question--
@@ -293,7 +348,7 @@ How does a screen magnifier help visually-impaired users navigate web pages?
#### --distractors--
-A screen magnifier reads the page's content aloud to the user.
+A screen magnifier will enlarge only images to twice their size so they can be better viewed by visually-impaired users.
---
@@ -311,7 +366,7 @@ A screen magnifier helps visually-impaired users navigate web pages by allowing
#### --text--
-What is the function of the `aria-haspopup` attribute?
+What is the role of the `aria-haspopup` attribute?
#### --distractors--
@@ -333,45 +388,46 @@ To indicate that an element can trigger a popup like a menu or dialog.
#### --text--
-What is a common keystroke to see if a website is keyboard navigation-friendly?
+Which of the following is NOT a commonly used ARIA role?
#### --distractors--
-Enter + 6
+`role="alert"`
---
-Enter
+`role="menu"`
---
-Caps Lock
+`role="tab"`
#### --answer--
-Shift + Tab
+`role="access"`
### --question--
#### --text--
-What is the function of the `aria-live` attribute?
+Which of the following attributes is used to create a live region on your page which can be used to notify screen reader users of dynamic content changes?
+
#### --distractors--
-To record live music performances.
+`aria-label`
---
-To make HTML elements focusable.
+`aria-region`
---
-To make HTML elements smaller.
+`aria-expanded`
#### --answer--
-To indicate that an element's content is dynamic and will be updated, which enables assistive technology to mention those updates to the user.
+`aria-live`
### --question--
@@ -381,15 +437,15 @@ What is the purpose of the `role` attribute?
#### --distractors--
-To style elements with CSS animations.
+To style elements with CSS animations allowing assistive technologies to better understand how the element should be interpreted and interacted with.
---
-To define the visual appearance of HTML elements.
+To define the visual appearance of HTML elements allowing assistive technologies to better understand how the element should be interpreted and interacted with.
---
-To modify HTML tags.
+To add labels to form elements allowing assistive technologies to better understand how the element should be interpreted and interacted with.
#### --answer--
@@ -399,65 +455,65 @@ To specify the type and purpose of an element, allowing assistive technologies t
#### --text--
-What is the best way to make a website's link accessible?
+Why is it important to use descriptive link text for links?
#### --distractors--
-Use phrases like "click here" to describe the link.
+To make the link text stand out visually from the rest of the page content.
---
-Add the site's URL to the link's text.
+To ensure the link loads faster when clicked.
---
-Link to two different URLs using the same words on the same page.
+To ensure that search engines will always list your site as the first result in the list.
#### --answer--
-Avoid linking whole paragraphs.
+To ensure that everyone, including users of assistive technology understand the purpose of the link.
### --question--
#### --text--
-When recording audio for a video, it is best to:
+Which of the following is a best practice for making audio and video content accessible?
#### --distractors--
-Use the latest recording tool.
+Providing high-quality graphics to accompany the audio and video content to make it accessible to people with visual impairments.
---
-Use jargon and terms related to the topic.
+Using bright colors and large text to make the content more engaging and to make it accessible to people with visual impairments.
---
-Speak quickly.
+Limiting the length of audio and video content to make it accessible to people with hearing impairments.
#### --answer--
-Speak slowly and clearly to give users time to process and understand the presented information.
+Providing captions and transcripts for audio and video content to make it accessible to people with hearing impairments.
### --question--
#### --text--
-What is the function of the `aria-checked` attribute?
+Which of the following attributes is used to indicate that an element is in the checked state?
#### --distractors--
-To show a checkmark.
+`aria-checking`
---
-To mark HTML elements.
+`aria-checkbox`
---
-To add a circle.
+`aria-ischecked`
#### --answer--
-To indicate whether an element is checked (`true`), unchecked (`false`), or in an indeterminate state (`mixed`), meaning neither checked nor unchecked.
+`aria-checked`
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-html-tables-and-forms/66ed902df45ce3ece4053ebc.md b/curriculum/challenges/german/25-front-end-development/quiz-html-tables-and-forms/66ed902df45ce3ece4053ebc.md
index 9333d52145..dfb273d8d4 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-html-tables-and-forms/66ed902df45ce3ece4053ebc.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-html-tables-and-forms/66ed902df45ce3ece4053ebc.md
@@ -7,7 +7,7 @@ dashedName: quiz-html-tables-and-forms
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-javascript-arrays/66edcccbba6dacdb65a59067.md b/curriculum/challenges/german/25-front-end-development/quiz-javascript-arrays/66edcccbba6dacdb65a59067.md
index e86f0e3326..2a996ef3a0 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-javascript-arrays/66edcccbba6dacdb65a59067.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-javascript-arrays/66edcccbba6dacdb65a59067.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-arrays
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -17,45 +17,62 @@ To pass the quiz, you must correctly answer at least 17 of the 20 questions belo
#### --text--
-What is the correct way to declare a JavaScript array?
+What will be the output for the following code?
+
+```js
+const numbers = [1, 2, 3];
+console.log(numbers[10]);
+```
#### --distractors--
-`let arr = array(1, 2, 3);`
+`[1, 2, 3]`
---
-`let arr = "1, 2, 3";`
+`null`
---
-`let arr = {1, 2, 3};`
+`10`
#### --answer--
-`let arr = [1, 2, 3];`
+`undefined`
### --question--
#### --text--
-What is the key difference between primitive and non-primitive data types?
+Which of the following is the correct way access the string `"Jessica"` from the `developers` array?
#### --distractors--
-Primitives can store multiple values.
+```js
+const developers = ["Jessica", "Naomi", "Tom"];
+developers[1]
+```
---
-Non-primitives cannot hold references to other objects.
+```js
+const developers = ["Jessica", "Naomi", "Tom"];
+developers[2]
+```
---
-Non-primitives store values directly.
+```js
+const developers = ["Jessica", "Naomi", "Tom"];
+developers[-1]
+```
#### --answer--
-Primitives hold direct values, non-primitives hold references.
+```js
+const developers = ["Jessica", "Naomi", "Tom"];
+developers[0]
+```
### --question--
@@ -89,316 +106,291 @@ console.log(index);
#### --text--
-What value will be assigned to the `arr2` variable?
-
-```js
-const arr1 = [1, 2, 3];
-const arr2 = [...arr1, 4, 5];
-console.log(arr2);
-```
+What does the rest syntax do?
#### --distractors--
-`[4, 5, 1, 2, 3]`
+It is used to divide a string into an array of substrings.
---
-`[1, 2, [3, 4, 5]]`
+It is used to add or remove elements from any position in an array.
---
-`[1, 2, 3]`
+It is used to add elements to the end of the array and will return the new length.
#### --answer--
-`[1, 2, 3, 4, 5]`
+It captures the remaining elements of an array into a new array.
### --question--
#### --text--
-What will this code print to the console?
-
-```js
-const colors = ['red', 'blue', 'green', 'yellow'];
-colors.splice(1, 2, 'purple');
-console.log(colors);
-```
+What is array destructuring?
#### --distractors--
-`['red', 'purple', 'green', 'yellow']`
+It is used to concatenate all of the elements of an array into a single string.
---
-`['red', 'blue', 'yellow']`
+It is used to check if an array contains a specific value.
---
-`['red', 'blue', 'green', 'yellow']`
+It is used to remove the last element from an array and will return that removed element.
#### --answer--
-`['red', 'purple', 'yellow']`
+It is used to extract values from arrays and assign them to variables in a more concise and readable way.
### --question--
#### --text--
-What value will be assigned to the `slicedArr` variable?
+What value will be assigned to the `arr2` variable?
```js
-const arr = ['apple', 'banana', 'cherry', 'date'];
-const slicedArr = arr.slice(1, 3);
-console.log(slicedArr);
+const arr1 = [1, 2, 3];
+const arr2 = [...arr1, 4, 5];
+console.log(arr2);
```
#### --distractors--
-`['apple', 'banana']`
+`[4, 5, 1, 2, 3]`
---
-`['cherry', 'date']`
+`[1, 2, [3, 4, 5]]`
---
-`['apple', 'cherry']`
+`[1, 2, 3]`
#### --answer--
-`['banana', 'cherry']`
+`[1, 2, 3, 4, 5]`
### --question--
#### --text--
-Which method returns the first index of a given element in an array?
+What will this code log to the console?
+
+```js
+const colors = ["red", "blue", "green", "yellow"];
+colors.splice(1, 2, "purple");
+console.log(colors);
+```
#### --distractors--
-`findIndex()`
+`["red", "blue", "green", "yellow"]`
---
-`lastIndexOf()`
+`["red", "blue", "yellow"]`
---
-`slice()`
+`["red", "yellow"]`
#### --answer--
-`indexOf()`
+`["red", "purple", "yellow"]`
### --question--
#### --text--
-Which method removes the first element from an array and shifts all other elements down?
+What value will be assigned to the `slicedArr` variable?
+
+```js
+const arr = ["apple", "banana", "cherry", "date"];
+const slicedArr = arr.slice(1, 3);
+console.log(slicedArr);
+```
#### --distractors--
-`pop()`
+`["apple", "banana"]`
---
-`slice()`
+`["cherry", "date"]`
---
-`splice()`
+`["apple", "cherry"]`
#### --answer--
-`shift()`
+`["banana", "cherry"]`
### --question--
#### --text--
-What does `Array.prototype.concat()` do?
+Which method returns the first index of a given element in an array?
#### --distractors--
-Joins array elements into a string.
+`firstIndex()`
---
-Adds an element to the beginning of an array.
+`lastIndex()`
---
-Removes an element from the array.
+`searchIndex()`
#### --answer--
-Merges two arrays into a new array.
+`indexOf()`
### --question--
#### --text--
-What happens if you set an array's length to a value smaller than the current length?
+Which method is used to remove the first element from an array and returns that removed element?
#### --distractors--
-It throws a syntax error.
+`pop()`
---
-The extra space is filled with `undefined`.
+`slice()`
---
-Nothing happens; the array remains the same size.
+`splice()`
#### --answer--
-The array gets truncated, removing elements beyond the new length.
+`shift()`
### --question--
#### --text--
-What will be the output of this code ?
-
-```js
-const fruits = ['apple', 'banana', 'cherry', 'apple', 'orange'];
-const index = fruits.indexOf('apple');
-if (index !== -1) {
- fruits.splice(index, 1);
-}
-console.log(fruits);
-```
+What does the `concat()` method do?
#### --distractors--
-`['banana', 'cherry', 'orange']`
+Joins array elements into a string.
---
-`['apple', 'cherry', 'apple', 'orange']`
+Adds an element to the beginning of an array.
---
-`['banana', 'cherry', 'apple']`
+Removes an element from the array.
#### --answer--
-`['banana', 'cherry', 'apple', 'orange']`
+Merges two arrays into a new array.
### --question--
#### --text--
-What is the final value of `result` in the following code?
+What will be the output of this code?
```js
-const arr1 = [1, 2];
-const arr2 = [3, 4, 5];
-const combined = arr1.concat(arr2);
-const result = combined.includes(3);
-console.log(result);
+const fruits = ["apple", "banana", "cherry", "apple", "orange"];
+
+fruits.splice(0, 1);
+
+console.log(fruits);
```
#### --distractors--
-`false`
+`["apple", "banana", "cherry", "apple", "orange"]`
---
-`[1, 2, 3, 4, 5]`
+`["apple", "banana", "cherry"]`
---
-`undefined`
+`["cherry", 'apple']`
#### --answer--
-`true`
+`["banana", "cherry", "apple", "orange"]`
### --question--
#### --text--
-What does the following code output?
-
-```js
-const nums = [1, 2, 3, 4];
-const doubled = nums.map(n => n * 2);
-console.log(doubled.includes(8));
-```
+What does the `includes()` method do?
#### --distractors--
-`false`
+It is used to divide a string into an array of substrings.
---
-`[2, 4, 6, 8]`
+It is used to concatenate all of the elements of an array into a single string.
---
-`Error`
+It is used to add or remove elements from any position in an array.
#### --answer--
-`true`
+It is used to check if an array contains a specific value.
### --question--
#### --text--
-What is the output when using `splice()` to remove elements from a 2D array?
-
-```js
-let matrix = [
- [1, 2, 3],
- [4, 5, 6],
- [7, 8, 9]
-];
-matrix.splice(1, 1);
-console.log(matrix);
-```
+Which of the following methods is used to reverse an array in place?
#### --distractors--
-`[[1, 2, 3], [4, 5, 6]]`
+`reversed()`
---
-`[[1, 2], [4, 5], [7, 8]]`
+`reverseArr()`
---
-`[[7, 8, 9]]`
+`reversing()`
#### --answer--
-`[[1, 2, 3], [7, 8, 9]]`
+`reverse()`
### --question--
#### --text--
-Which of the following statements about `.length` is correct?
+What is a two dimensional array?
#### --distractors--
-It counts the number of values in a 2D array.
+An array that only contains object literals.
---
-It returns `undefined` for empty arrays.
+An array of fixed length.
---
-It gives the total number of elements in a 2D array.
+An array of floating point numbers.
#### --answer--
-It counts the number of top-level elements in a 2D array.
+An array of arrays.
### --question--
@@ -426,75 +418,73 @@ It returns `-1` if the element is not found.
#### --text--
-What is the main difference between `push()` and `concat()` when working with arrays?
+Which of the following is NOT an array method?
#### --distractors--
-`push()` adds multiple arrays together, while `concat()` adds a single element.
+`includes()`
---
-`concat()` modifies the original array, while `push()` creates a new array.
+`pop()`
---
-Both `push()` and `concat()` are immutable methods.
+`push()`
#### --answer--
-`push()` modifies the original array, while `concat()` creates a new array.
+`keys()`
### --question--
#### --text--
-How does the rest parameter `...rest` work in array destructuring in JavaScript?
+What will be the output for the following code?
+
+```js
+const arr = ["o", "l", "l", "e", "h"];
+console.log(arr.join(""));
+```
#### --distractors--
-It is used to add extra elements to the array.
+`["o", "l", "l", "e", "h"]`
---
-It allows you to access elements outside the array's bounds.
+`"hello"`
---
-It removes the last element of the array.
+`undefined`
#### --answer--
-It collects the remaining elements into a new array after the initial elements are assigned to variables.
+`"olleh"`
### --question--
#### --text--
-What will be the result of this code ?
+What will be the result of using the `shift()` method on an empty array?
-```js
-const numbers = [10, 20, 30];
-numbers.push(40);
-numbers.pop();
-const length = numbers.length;
-console.log(length);
-```
#### --distractors--
-2
+`TypeError`
---
-5
+`[]`
---
-4
+`null`
#### --answer--
-3
+`undefined`
### --question--
@@ -504,7 +494,7 @@ Which method will return a new array without changing the original array?
#### --distractors--
-`splice()`
+`shift()`
---
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-javascript-audio-and-video/66edd3b3096349f06cf688bb.md b/curriculum/challenges/german/25-front-end-development/quiz-javascript-audio-and-video/66edd3b3096349f06cf688bb.md
index 01af9a24ea..7d821914e4 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-javascript-audio-and-video/66edd3b3096349f06cf688bb.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-javascript-audio-and-video/66edd3b3096349f06cf688bb.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-audio-and-video
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-javascript-classes/67358ac128957c865dcf3ddf.md b/curriculum/challenges/german/25-front-end-development/quiz-javascript-classes/67358ac128957c865dcf3ddf.md
index 0dfe06296f..e06087a7bd 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-javascript-classes/67358ac128957c865dcf3ddf.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-javascript-classes/67358ac128957c865dcf3ddf.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-classes
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-javascript-comparisons-and-conditionals/66edc47c11492ac5cf258ad9.md b/curriculum/challenges/german/25-front-end-development/quiz-javascript-comparisons-and-conditionals/66edc47c11492ac5cf258ad9.md
index b01389747e..47999af6dc 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-javascript-comparisons-and-conditionals/66edc47c11492ac5cf258ad9.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-javascript-comparisons-and-conditionals/66edc47c11492ac5cf258ad9.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-comparisons-and-conditionals
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-javascript-dates/66edd3711bb9f7efa73aef91.md b/curriculum/challenges/german/25-front-end-development/quiz-javascript-dates/66edd3711bb9f7efa73aef91.md
index 13af765c56..23bf2405bd 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-javascript-dates/66edd3711bb9f7efa73aef91.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-javascript-dates/66edd3711bb9f7efa73aef91.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-dates
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-javascript-events/66edd0ac31fea6e678eb925a.md b/curriculum/challenges/german/25-front-end-development/quiz-javascript-events/66edd0ac31fea6e678eb925a.md
index 74b23bfcb7..5736bbd1e8 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-javascript-events/66edd0ac31fea6e678eb925a.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-javascript-events/66edd0ac31fea6e678eb925a.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-events
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-javascript-functional-programming/66edd4f31ff19bf5573bf64b.md b/curriculum/challenges/german/25-front-end-development/quiz-javascript-functional-programming/66edd4f31ff19bf5573bf64b.md
index 26d0998da5..7c59a461c7 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-javascript-functional-programming/66edd4f31ff19bf5573bf64b.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-javascript-functional-programming/66edd4f31ff19bf5573bf64b.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-functional-programming
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-javascript-functions/66edcc779993c0da6906dbb9.md b/curriculum/challenges/german/25-front-end-development/quiz-javascript-functions/66edcc779993c0da6906dbb9.md
index 623be232b7..dd7f298fdf 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-javascript-functions/66edcc779993c0da6906dbb9.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-javascript-functions/66edcc779993c0da6906dbb9.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-functions
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -17,468 +17,543 @@ To pass the quiz, you must correctly answer at least 17 of the 20 questions belo
#### --text--
-What is the correct syntax for a function declaration?
+Which of the following is the correct way to declare a function in JavaScript?
#### --distractors--
-`var myFunction = function() {};`
+```js
+func greet () {
+ console.log("Hello there!");
+}
+```
---
-`myFunction: function() {}`
+```js
+defineFunction greet () {
+ console.log("Hello there!");
+}
+```
---
-`function = myFunction();`
+```js
+def greet () {
+ console.log("Hello there!");
+}
+```
#### --answer--
-`function myFunction() {}`
+```js
+function greet () {
+ console.log("Hello there!");
+}
+```
### --question--
#### --text--
-Which of the following is a valid function expression?
+What happens when you call (or execute) a function?
#### --distractors--
-```js
-function getSum(x, y) {
- return x + y;
-};
-```
+The code inside the function will run and `null` will always be returned.
---
-```js
-getSum: function(x, y) {
- return x + y;
-};
-```
+Nothing will happen when you call a function.
---
-```js
-function = getSum(x, y) {
- return x + y;
-};
-```
+A `TypeError` will be thrown and the program will crash.
#### --answer--
-```js
-getSum = function(x, y) {
- return x + y;
-};
-```
+The code inside the function will run and a value will be returned.
### --question--
#### --text--
-Where can function expressions be used?
+Which of the following is the correct way to call a function?
#### --distractors--
-Only within other functions
+```js
+exampleFunction;
+```
---
-Only as part of an object literal
+```js
+exampleFunction>>;
+```
---
-Only in the global scope
+```js
+()exampleFunction();
+```
#### --answer--
-Anywhere a variable can be used
+```js
+exampleFunction();
+```
### --question--
#### --text--
-What is the difference between a function expression and a function declaration?
+What is the role of the `return` keyword?
#### --distractors--
-Function expressions can be hoisted, while function declarations cannot.
+The `return` keyword will execute the function.
---
-Both function expressions and function declarations can be hoisted.
+The `return` keyword will throw a type error.
---
-Neither function expressions nor function declarations can be hoisted.
+The `return` keyword serves no purpose in functions.
#### --answer--
-Function declarations can be hoisted, while function expressions cannot.
+The `return` keyword returns a value from the function.
### --question--
#### --text--
-What does it mean for functions to be first-class citizens in JavaScript?
+Which of the following is a valid function expression?
#### --distractors--
-They can be assigned to variables.
+```js
+expression function getSum(x, y) {
+ return x + y;
+};
+```
---
-They can be passed as arguments to other functions.
+```js
+getSum: function(x, y) {
+ return x + y;
+};
+```
---
-They can be returned from functions.
+```js
+function = getSum(x, y) {
+ return x + y;
+};
+```
#### --answer--
-All of the answers are correct.
+```js
+const getSum = function(x, y) {
+ return x + y;
+};
+```
### --question--
#### --text--
-Which of the following is a common use case for first-class functions in JavaScript?
+What are function arguments?
#### --distractors--
-Implementing object-oriented programming
+Values that represents the absence of a value.
---
-Defining global variables
+Special values that act similar to anonymous functions.
---
-Creating custom data types
+Placeholder values used inside of the function.
#### --answer--
-Creating higher-order functions
+Real values passed to a function when it is called.
### --question--
#### --text--
-Which of the following is an example of a first-class function?
+What are function parameters?
#### --distractors--
-```js
-function greet(name) {
- console.log("Hello, " + name);
-}
-```
+Floating point values used inside of the function.
---
-```js
-var greet = function(name) {
- console.log("Hello, " + name);
-};
-```
+Values passed to a function when it is called.
---
-```js
-const greet = (name) => {
- console.log("Hello, " + name);
-}
-```
+Values that represent the intentional absence of the value.
#### --answer--
-All of the answers are correct.
+Values listed inside the function definition.
### --question--
#### --text--
-Which of the following is not a common use case for first-class functions?
+What value will be returned in the following code example?
+
+```js
+function greet () {
+ console.log("Hello there!");
+}
+
+greet();
+```
#### --distractors--
-Defining object methods
+`NaN`
---
-Implementing closures
+`TypeError`
---
-Creating callbacks
+`null`
#### --answer--
-Creating custom data types
+`undefined`
### --question--
#### --text--
-What is the syntax for an arrow function?
+Which of the following is the correct syntax for an arrow function?
#### --distractors--
-`myFunction: function() {}`
+```js
+const sum <<>> (num1, num2) => num1 + num2
+```
---
-`function myFunction() {}`
+```js
+const sum === (num1, num2) === num1 + num2
+```
---
-`const myFunction = function() {};`
+```js
+const sum >=> (num1, num2) => num1 + num2
+```
#### --answer--
-`myFunction = () => { ... };`
+```js
+const sum = (num1, num2) => num1 + num2
+```
### --question--
#### --text--
-What is the difference between a regular function and an arrow function?
+What will be result for the following code?
+
+```js
+function greet() {
+ const developer = "Jessica";
+ console.log("Hello there!");
+}
+
+console.log(developer);
+```
#### --distractors--
-Arrow functions do not have their own 'this' binding.
+Nothing will happen and the code will run normally.
---
-Arrow functions cannot be used as constructors.
+The string `"Hello there!"` will be logged to the console.
---
-Arrow functions cannot be used with the 'new' keyword.
+The string `"Hello!"` will be logged to the console.
#### --answer--
-All of the answers are correct.
+You will get a reference error because `developer` is not defined globally.
### --question--
#### --text--
-You can also call arrow function as
+When can you omit a set of parentheses around a parameter list for an arrow function?
#### --distractors--
-Lambda function
+You should always omit the parentheses around a parameter list.
---
-Fat arrow function
+You are never supposed to omit the parentheses for an arrow function.
---
-Neither Lambda function or Fat arrow function
+You should only omit the parentheses when you are working with multiple parameters.
#### --answer--
-Both Lambda function and Fat arrow function
+You should only omit the parentheses when you only have one parameter.
### --question--
#### --text--
-What is the benefit of using arrow functions?
+When can you omit the curly braces and `return` keyword for an arrow function?
#### --distractors--
-You can omit curly braces and return keyword if your output is going to be a single line.
+You should always omit the curly braces and `return` keyword.
---
-They provide easy syntax while writing promises and callbacks.
+You should never omit the curly braces and `return` keyword.
---
-They have short syntax and increase readability.
+When the function body has multiple lines of code.
#### --answer--
-All of the answers are correct.
+When the function body consists of a single expression.
### --question--
#### --text--
-What is the difference between a function and a method?
+What will be the result for the following code?
+
+```js
+function exampleFunction () {
+
+}
+exampleFunction();
+```
#### --distractors--
-There is no difference between functions and methods.
+The program will crash.
---
-Functions and methods are properties of objects
+JavaScript will skip over that piece of code.
---
-Functions are properties of objects, while methods are standalone functions.
+An error message will display.
#### --answer--
-Methods are properties of objects, while functions are standalone functions.
+Nothing will happen.
### --question--
#### --text--
-Can a method be used outside of its object?
+Which of the following is the correct way to use default parameters?
#### --distractors--
-Yes, methods can be used anywhere a function can be used.
+```js
+function sum (num1, num2 <<>> 12) {
+ return num1 + num2
+}
+```
---
-Methods can be used outside of their object, but only if they are bound to a specific 'this' value.
+```js
+function sum (num1, num2 === 12) {
+ return num1 + num2
+}
+```
---
-Methods can be used outside of their object, but only if they are defined as arrow functions.
+```js
+function sum (num1, num2 >> 12) {
+ return num1 + num2
+}
+```
#### --answer--
-No, methods can only be used within their object.
+```js
+function sum (num1, num2 = 12) {
+ return num1 + num2
+}
+```
### --question--
#### --text--
-Which of the following is an example of a method?
-
-#### --distractors--
+What will be the result for the following code?
```js
-function greet(name) {
- console.log("Hello, " + name);
+const developer = "Jessica";
+
+function greet() {
+ console.log("Hello, " + developer)
}
+
+greet();
```
+#### --distractors--
+
+The string `"Hello, developer"` will be logged to the console.
+
---
-```js
-var greet = function(name) {
- console.log("Hello, " + name);
-};
-```
+An error message will display in the console.
---
-All of them.
+Nothing will display in the console.
#### --answer--
-```js
-const person = {
- name: "Alice",
- greet: function() {
- console.log("Hello, my name is " + this.name);
- }
-};
-```
+The string `"Hello, Jessica"` will be logged to the console.
### --question--
#### --text--
-What is the benefit of using methods instead of functions?
+What happens if you try to remove the curly braces for a regular function?
#### --distractors--
-Methods provide a more organized way to group related functionality.
+An alert box will display on the page with an error.
---
-Methods can be accessed using dot notation, which can make code more readable.
+The program will crash and not start again.
---
-Methods have access to the properties and methods of their object.
+Nothing will happen.
#### --answer--
-All of the answers are correct.
+You will get a syntax error.
### --question--
#### --text--
-What is the difference between arguments and parameters?
+What will be the result for the following code?
+
+```js
+const sum = (num1, num2) => num1 + num2
+console.log(sum(0, 0) + 10);
+```
#### --distractors--
-There is no difference between arguments and parameters.
+An error message will display in the console.
---
-Parameters are the actual values passed to a function when it is called, while arguments are the names of variables used in a function definition.
+The number `0` will be logged to the console.
---
-Arguments and parameters are used interchangeably.
+Nothing will be logged to the console.
#### --answer--
-Parameters are the names of variables used in a function definition, while arguments are the actual values passed to the function when it is called.
+The number `10` will be logged to the console.
### --question--
#### --text--
-What happens if a function is called with more arguments than it expects?
+What will be the output for the following code?
+
+```js
+const exampleFunction = (param1, param2) => param1 + param2;
+console.log(exampleFunction(3, "Something"));
+```
#### --distractors--
-The extra arguments will be assigned to the remaining parameters.
+`null`
---
-The function will throw an error.
+`undefined`
---
-The function will use the default values specified in the function definition.
+`3 + "Something"`
#### --answer--
-The extra arguments will be ignored.
+`"3Something"`
### --question--
#### --text--
-What is the correct syntax for defining a function with default parameter values?
+What will be the result for the following code?
+
+```js
+const sum = (num1, num2) => num1 + num2
+console.log(sum(0, 0) + num2);
+```
#### --distractors--
-`function myFunction(param1 = value1, param2) { ... }`
+An error message saying `num1` is not defined.
---
-`function myFunction(param1, param2 = value2) { ... }`
+The number `0` will be displayed in the console.
---
-`function myFunction(param1: value1, param2: value2) { ... }`
+`undefined` will be displayed in the console.
#### --answer--
-`function myFunction(param1 = value1, param2 = value2) { ... }`
+An error message saying `num2` is not defined.
### --question--
#### --text--
-What is the default value for a missing argument in a function call?
+What will be the output for the following code?
+
+```js
+const divideTwoNumbers = (num1, num2) => num1 / num2;
+console.log(divideTwoNumbers(3, 0));
+```
#### --distractors--
@@ -494,5 +569,5 @@ What is the default value for a missing argument in a function call?
#### --answer--
-`undefined`
+`Infinity`
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-javascript-fundamentals/66edcd875b0d91de1fbbb492.md b/curriculum/challenges/german/25-front-end-development/quiz-javascript-fundamentals/66edcd875b0d91de1fbbb492.md
index 43ab730256..36e3ec148f 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-javascript-fundamentals/66edcd875b0d91de1fbbb492.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-javascript-fundamentals/66edcd875b0d91de1fbbb492.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-fundamentals
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-javascript-higher-order-functions/66edcdd18a4ef8df16e6bb7e.md b/curriculum/challenges/german/25-front-end-development/quiz-javascript-higher-order-functions/66edcdd18a4ef8df16e6bb7e.md
index 7be9dba11e..de53f54549 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-javascript-higher-order-functions/66edcdd18a4ef8df16e6bb7e.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-javascript-higher-order-functions/66edcdd18a4ef8df16e6bb7e.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-higher-order-functions
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-javascript-loops/66edcd49e73385dd4df54ac7.md b/curriculum/challenges/german/25-front-end-development/quiz-javascript-loops/66edcd49e73385dd4df54ac7.md
index 8f79dade85..765b9aa915 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-javascript-loops/66edcd49e73385dd4df54ac7.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-javascript-loops/66edcd49e73385dd4df54ac7.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-loops
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-javascript-maps-and-sets/67358be1c7903489c0a7db78.md b/curriculum/challenges/german/25-front-end-development/quiz-javascript-maps-and-sets/67358be1c7903489c0a7db78.md
index 9f9c01a60e..0c9007b514 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-javascript-maps-and-sets/67358be1c7903489c0a7db78.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-javascript-maps-and-sets/67358be1c7903489c0a7db78.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-maps-and-sets
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-javascript-math/66edc3ab8c6413c344f401bf.md b/curriculum/challenges/german/25-front-end-development/quiz-javascript-math/66edc3ab8c6413c344f401bf.md
index 23c49152c8..fa9233cfd8 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-javascript-math/66edc3ab8c6413c344f401bf.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-javascript-math/66edc3ab8c6413c344f401bf.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-math
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -17,53 +17,33 @@ To pass the quiz, you must correctly answer at least 17 of the 20 questions belo
#### --text--
-What is the result of this code?
-
-``` js
-const num1 = Number('888');
-const num2 = new Number('777');
-
-console.log(num1 === 888);
-console.log(num2 === 777);
-```
+What does `NaN` stand for?
#### --distractors--
-```js
-true
-true
-```
+`Numeric and Number`
---
-```js
-false
-false
-```
+`Not a Null`
---
-```js
-false
-true
-```
+`Null and Number`
#### --answer--
-```js
-true
-false
-```
+`Not a Number`
### --question--
#### --text--
-Which of the following is not an arithmetic operator in JavaScript?
+Which of the following is NOT an arithmetic operator in JavaScript?
#### --distractors--
-`%`
+`*`
---
@@ -71,71 +51,55 @@ Which of the following is not an arithmetic operator in JavaScript?
---
-`--`
+`-`
#### --answer--
-`==`
+`??`
### --question--
#### --text--
-Which of the following will log the correct gross profit?
+What happens if you try to divide by zero in JavaScript?
#### --distractors--
-``` js
-let store1_sales = 7500;
-let store2_sales = 6000;
-console.log("Total Sales: " + store1_sales + store2_sales);
-```
+JavaScript will output 0
---
-``` js
-let store1_sales = 7500;
-let store2_sales = 6000;
-console.log("Total Sales: " + store1_sales - store2_sales);
-```
+Nothing will happen
---
-``` js
-let store1_sales = 7500;
-let store2_sales = 6000;
-console.log("Total Sales: " + (store1_sales - store2_sales));
-```
+JavaScript will throw an error
#### --answer--
-``` js
-let store1_sales = 7500;
-let store2_sales = 6000;
-console.log("Total Sales: " + (store1_sales + store2_sales));
-```
+JavaScript will output `Infinity`
### --question--
#### --text--
-What is the result of the statement `25 * 4 - 16 / (2 * 4) + 8`?
+Which of the following is the correct use of the exponentiation operator?
#### --distractors--
-`18.5`
+`2*3`
---
-`107.5`
+`2#3`
---
-`17`
+`2%3`
#### --answer--
-`106`
+`2**3`
### --question--
@@ -163,7 +127,7 @@ Which operator should you use when decrementing a variable in JavaScript?
#### --text--
-Which of the following is not a bitwise operator?
+Which of the following is NOT a bitwise operator?
#### --distractors--
@@ -229,89 +193,89 @@ The `==` operator only compares values whereas the `===` operator compares value
#### --text--
-Which of the following statements are false about unary plus (`+`) operators?
+What is the unary plus operator (`+`) used for?
#### --distractors--
-It tries to convert the operand into a number.
+It is used to decrement a value by one.
---
-It is the fastest way to convert an operand to a number.
+It is used to get the remainder from an operation.
---
-It can convert operands with negative numbers except for hexadecimals.
+It is used to invert the binary representation of a number.
#### --answer--
-It can't convert `true`, `false`, or `null` into a number.
+It is used to convert its operand into a number.
### --question--
#### --text--
-Which method in the built-in Math object is used to round up a number?
+Which of the following `Math` methods rounds a value to the nearest whole integer?
#### --distractors--
-`Math.round(num)`
+`Math.trunc()`
---
-`Math.floor(num)`
+`Math.max()`
---
-`Math.fround(num)`
+`Math.min()`
#### --answer--
-`Math.ceil(num)`
+`Math.round()`
### --question--
#### --text--
-Which of the following Math object methods are used to raise a base to a power?
+What does the `Math.sqrt()` method do?
#### --distractors--
-`Math.exp(base, power)`
+This method returns a random floating point number.
---
-`Math.raise(base, power)`
+This method returns the absolute value for a number.
---
-`Math.e(base, power)`
+This method returns the cube of a number.
#### --answer--
-`Math.pow(base, power)`
+This method returns the square root of a number.
### --question--
#### --text--
-Which of the following is the correct method for generating a random number in JavaScript?
+Which of the following is NOT a valid method for the `Math` object?
#### --distractors--
-`Math.rand(1,10)`
+`Math.ceil()`
---
-`Math.rand()`
+`Math.pow()`
---
-`Math.random(1,10)`
+`Math.abs()`
#### --answer--
-`Math.random()`
+`Math.extend()`
### --question--
@@ -321,11 +285,11 @@ Which of the following will return `false`?
#### --distractors--
-`isNaN("1998", "1999")`
+`isNaN("Matt")`
---
-`isNaN({})`
+`isNaN()`
---
@@ -333,105 +297,114 @@ Which of the following will return `false`?
#### --answer--
-`isNaN(null)`
+`isNaN(7)`
### --question--
#### --text--
-Which of the following will convert `172` to its hexadecimal equivalent?
+What does the `parseFloat()` method do?
#### --distractors--
-`(-0xa5).toString(2);`
+It parses a string argument and performs a bitwise operation on it.
---
-`(172).string(0x);`
+It parses a string argument and returns `false`.
---
-`(172).parseString(0x);`
+It parses a string argument and returns an integer.
#### --answer--
-`(172).toString(16);`
+It parses a string argument and returns a floating-point number.
### --question--
#### --text--
-Which of the following is the right way to convert a string to an integer?
+What will be logged to the console?
+
+```js
+const num = 5;
+console.log(++num);
+```
#### --distractors--
-`parseINT("300")`
+`error`
---
-`int("300")`
+`null`
---
-`integer("300")`
+`5`
#### --answer--
-`parseInt("300")`
+`6`
### --question--
#### --text--
-Which of the following statements is false?
+What would be the output for the following code?
+
+```js
+console.log(5 == '5');
+```
#### --distractors--
-`parseFloat()` ignores trailing invalid characters
+`undefined`
---
-`parseFloat()` can parse a string that begins with `Infinity` or `-Infinity`
+`false`
---
-`parseFloat("0x1f")` will return `0`
+`null`
#### --answer--
-`parseFloat()` requires two parameters
+`true`
### --question--
#### --text--
-Which of the following is false?
+What is operator precedence?
#### --distractors--
-A number greater than 100 as an argument to the `Number.prototype.toFixed()` method will result to a range error
+Operator precedence is used to check if the value on the left is less than the one on the right.
---
-`Number.prototype.toFixed(numDecimalPlaces)` is used to return a number converted to a string with decimals places depending on the argument
+Operator precedence is used to raise a variable to the power of the specified number and reassigns the result to the variable.
---
-Calling the `Number.prototype.toFixed()` method on a number object with decimal points and no argument will round the number to the nearest ones
+Operator precedence is used to to increase the value by one.
#### --answer--
-Using `Number.prototype.toFixed()` without an argument will by default add a decimal point followed by a zero
+Operator precedence determines the order in which operations are evaluated in an expression.
### --question--
#### --text--
-Which of the following is not a comparison operator?
+Which of the following is NOT a comparison operator?
#### --distractors--
-`!=`
+`>`
---
@@ -439,7 +412,7 @@ Which of the following is not a comparison operator?
---
-`===`
+`<`
#### --answer--
@@ -449,43 +422,75 @@ Which of the following is not a comparison operator?
#### --text--
-Which of the following is false?
+What does the unary negation operator (`-`) do?
#### --distractors--
-Exponentiation has a lower operator precedence than the grouping operator `()`.
+It flips the boolean value of its operand.
---
-Postfix operators like `x++` or `x--` has higher precedence than prefix operators.
+It decreases the value by one.
---
-Relational operators like `>` or `<` has higher precedence than equality operators.
+It increases the value by one.
#### --answer--
-Logical operator like `AND` and `OR` have higher precedence than bitwise operators.
+It negates the operand.
### --question--
#### --text--
-`Math.random()` returns a number in what range?
+Which of the following is an example of using the nullish coalescing operator?
#### --distractors--
-`Math.random()` returns a number between 0 (inclusive) and 1 (inclusive)
+```js
+const userSettings = {
+ theme: null,
+ volume: 0,
+ notifications: false,
+};
+
+userSettings.theme () 'light';
+```
---
-`Math.random()` returns a number between 0 (exclusive) and 1 (inclusive)
+```js
+const userSettings = {
+ theme: null,
+ volume: 0,
+ notifications: false,
+};
+
+userSettings.theme ** 'light';
+```
---
-`Math.random()` returns a number between 0 (exclusive) and 1 (exclusive)
+```js
+const userSettings = {
+ theme: null,
+ volume: 0,
+ notifications: false,
+};
+
+userSettings.theme \\ 'light';
+```
#### --answer--
-`Math.random()`returns a number between 0 (inclusive) and 1 (exclusive)
+```js
+const userSettings = {
+ theme: null,
+ volume: 0,
+ notifications: false,
+};
+
+userSettings.theme ?? 'light';
+```
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-javascript-objects/66edcd0ecb4b25dc64a34804.md b/curriculum/challenges/german/25-front-end-development/quiz-javascript-objects/66edcd0ecb4b25dc64a34804.md
index 04ccf94347..32d7860e61 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-javascript-objects/66edcd0ecb4b25dc64a34804.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-javascript-objects/66edcd0ecb4b25dc64a34804.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-objects
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -17,7 +17,7 @@ To pass the quiz, you must correctly answer at least 17 of the 20 questions belo
#### --text--
-Which of the following does not describe an object in Javascript?
+Which of the following does not describe an object in JavaScript?
#### --distractors--
@@ -29,11 +29,11 @@ A container for properties and methods
---
-One of Javascript's data types
+One of JavaScript's data types
#### --answer--
-One of Javascript's primitives
+One of JavaScript's primitives
### --question--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-javascript-regular-expressions/66edd3011f18f4ee1bd9d28b.md b/curriculum/challenges/german/25-front-end-development/quiz-javascript-regular-expressions/66edd3011f18f4ee1bd9d28b.md
index 3ba595809d..9a372d5f6d 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-javascript-regular-expressions/66edd3011f18f4ee1bd9d28b.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-javascript-regular-expressions/66edd3011f18f4ee1bd9d28b.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-regular-expressions
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-javascript-strings/66edc31c44f1b9c1d5c5ebca.md b/curriculum/challenges/german/25-front-end-development/quiz-javascript-strings/66edc31c44f1b9c1d5c5ebca.md
index b8c343bfbe..4a89fdc6d1 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-javascript-strings/66edc31c44f1b9c1d5c5ebca.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-javascript-strings/66edc31c44f1b9c1d5c5ebca.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-strings
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -65,19 +65,19 @@ Which of the following options is the newline character?
#### --distractors--
-`'\newline'`
+`\newline`
---
-`'\new'`
+`\new`
---
-`'\line'`
+`\line`
#### --answer--
-`'\n'`
+`\n`
### --question--
@@ -205,57 +205,56 @@ developer[2];
#### --text--
-How can you obtain the ASCII value of a character in a string?
+How can you obtain the ASCII value of the first character in the string `"hello"`?
#### --distractors--
-`str.charCode()`
+`"hello".charCode(0)`
---
-`str.codeAt()`
+`"hello".codeAt(0)`
---
-`str.getCharIndex()`
+`"hello".getCharIndex(0)`
#### --answer--
-`str.charCodeAt()`
+`"hello".charCodeAt(0)`
### --question--
#### --text--
-How can you obtain the character corresponding to an ASCII value?
+Which method can you use to obtain the character corresponding to an ASCII value?
#### --distractors--
-`String.toASCII()`
+`toASCII()`
---
-`String.toChar()`
+`toChar()`
---
-`String.toCode()`
+`toCode()`
#### --answer--
-`String.fromCharCode()`
+`fromCharCode()`
### --question--
#### --text--
-Which of the following `indexOf` examples will correctly return -1?
+Which of the following `indexOf` examples will log `-1` to the console?
#### --distractors--
```js
const organization = "freeCodeCamp";
-
console.log(organization.indexOf("e"));
```
@@ -263,7 +262,6 @@ console.log(organization.indexOf("e"));
```js
const organization = "freeCodeCamp";
-
console.log(organization.indexOf("f"));
```
@@ -271,7 +269,6 @@ console.log(organization.indexOf("f"));
```js
const organization = "freeCodeCamp";
-
console.log(organization.indexOf("C"));
```
@@ -279,7 +276,6 @@ console.log(organization.indexOf("C"));
```js
const organization = "freeCodeCamp";
-
console.log(organization.indexOf("c"));
```
@@ -287,23 +283,23 @@ console.log(organization.indexOf("c"));
#### --text--
-How can you check if the string `"JavaScript"` contains a specific substring?
+How can you check if the string `"JavaScript"` contains `"Script"`?
#### --distractors--
-`"JavaScript".has()`
+`"JavaScript".has("Script")`
---
-`"JavaScript".contains()`
+`"JavaScript".contains("Script")`
---
-`"JavaScript".exists()`
+`"JavaScript".exists("Script")`
#### --answer--
-`"JavaScript".includes()`
+`"JavaScript".includes("Script")`
### --question--
@@ -313,7 +309,7 @@ Which of the following extracts the substring `"Script"` from the string `"JavaS
#### --distractors--
-`"JavaScript".remove(3)`
+`"JavaScript".find(5)`
---
@@ -321,7 +317,7 @@ Which of the following extracts the substring `"Script"` from the string `"JavaS
---
-`"JavaScript".cut(3)`
+`"JavaScript".cut(5)`
#### --answer--
@@ -375,23 +371,23 @@ How do you convert the string `"JavaScript"` to lowercase?
#### --text--
-Which of the following methods is used to find a specified value in a string and replace it with another value?
+Which of the following will replace `"dogs"` with `"cats"` in the string `"I love dogs"`.
#### --distractors--
-`indexOf()`
+`"I love dogs".slice("dogs", "cats")`
---
-`replaceWith()`
+`"I love dogs".replaceWith("dogs", "cats")`
---
-`find()`
+`"I love dogs".find("dogs", "cats")`
#### --answer--
-`replace()`
+`"I love dogs".replace("dogs", "cats")`
### --question--
@@ -401,25 +397,25 @@ Which method is used to repeat a string a specified number of times?
#### --distractors--
-`str.times()`
+`times()`
---
-`str.repeatTimes()`
+`repeatTimes()`
---
-`str.repeatNumber()`
+`repeatNumber()`
#### --answer--
-`str.repeat()`
+`repeat()`
### --question--
#### --text--
-What will the following code return: `'abc'.repeat(3)`?
+What will the following code return: `"abc".repeat(3)`?
#### --distractors--
@@ -441,23 +437,23 @@ It will throw an error.
#### --text--
-How do you remove whitespace from the beginning and end of a string?
+Which method will remove whitespace from the beginning and end of a string?
#### --distractors--
-`str.strip()`
+`strip()`
---
-`str.removeWhitespace()`
+`removeWhitespace()`
---
-`str.trimWhitespace()`
+`trimWhitespace()`
#### --answer--
-`str.trim()`
+`trim()`
### --question--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-javascript-variables-and-data-types/66edc25ae5ea80bf6f785552.md b/curriculum/challenges/german/25-front-end-development/quiz-javascript-variables-and-data-types/66edc25ae5ea80bf6f785552.md
index c84a01b0e9..fd6f7460d3 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-javascript-variables-and-data-types/66edc25ae5ea80bf6f785552.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-javascript-variables-and-data-types/66edc25ae5ea80bf6f785552.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-variables-and-data-types
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -17,7 +17,7 @@ To pass the quiz, you must correctly answer at least 17 of the 20 questions belo
#### --text--
-What is JavaScript?
+Which of the following best describes JavaScript?
#### --distractors--
@@ -33,7 +33,7 @@ A database management system.
#### --answer--
-A programming language primarily used for web development.
+A programming language used for web development.
### --question--
@@ -43,19 +43,19 @@ Which of the following is NOT a JavaScript data type?
#### --distractors--
-`null`
+`Number`
---
-`undefined`
+`Undefined`
---
-`bigInt`
+`Object`
#### --answer--
-`double`
+`Double`
### --question--
@@ -77,29 +77,29 @@ Which of the following is NOT a valid JavaScript variable declaration?
#### --answer--
-`public final Long x;`
+`public Int x;`
### --question--
#### --text--
-Which of the following is a conventional variable name in JavaScript?
+Which of the following is a common naming convention for variables in JavaScript?
#### --distractors--
-`my_var`
+JavaScript case
---
-`my-var`
+Lightning case
---
-`MyVar`
+Giraffe case
#### --answer--
-`myVar`
+Camel case
### --question--
@@ -127,28 +127,23 @@ What is the difference between `let` and `const` variable declarations in JavaSc
#### --text--
-What would be the outcome of the following code?
-
-```js
-let name = "Andy";
-name[0] = "M";
-```
+Why are strings considered immutable in JavaScript?
#### --distractors--
-The value of `name` would be `"MAndy"`.
+You cannot create strings using variables.
---
-The value of `name` would be `"Mndy"`.
+Strings can only be created using literals.
---
-The value of `name` would still be `"Andy"`.
+You can change strings, but only through global variables.
#### --answer--
-It would throw an error.
+Once a string is created, you cannot change its characters directly.
### --question--
@@ -186,7 +181,7 @@ console.log(hello);
#### --distractors--
-Reassigns `world` to the variable `hello`, and prints it out in the console.
+Reassigns `" world"` to the variable `hello`, and prints it out in the console.
---
@@ -194,33 +189,33 @@ Prints out the number of characters in `Hello world` in the console.
---
-Adds the string `world` to the variable `hello`, and prints it out in the console.
+Combines `"Hello"` and `" world"` into a new string and prints it, but the value of `hello` remains `"Hello"`.
#### --answer--
-Creates a new string that is made of the values of `hello` and `" world"` combined together, and assigns this new string back to `hello` and then prints it out in the console.
+Combines the current value of `hello` with the string `" world"`, reassigns it to `hello`, and prints it to the console.
### --question--
#### --text--
-Are semicolons required in JavaScript?
+Which JavaScript character is used to mark the end of a statement?
#### --distractors--
-Yes. The code won't work without semicolons.
+`:`
---
-Semicolons are sometimes required in JavaScript.
+`,`
---
-No. It's recommended not to use semicolons in JavaScript.
+`.`
#### --answer--
-No, but it is generally recommended to use semicolons consistently to avoid potential issues in code.
+`;`
### --question--
@@ -264,7 +259,7 @@ JavaScript performs type checking before execution, meaning type related errors
#### --answer--
-You don't need to declare the data type of a variable before using it. JavaScript infers the type based on the value assigned to the variable.
+JavaScript infers the type based on the value assigned to the variable.
### --question--
@@ -410,7 +405,7 @@ Which of the following is NOT a valid string concatenation method in JavaScript?
---
-``console.log(`${string1} ${string2}`);``
+`console.log("string1 " + string2);`
---
@@ -424,7 +419,7 @@ Which of the following is NOT a valid string concatenation method in JavaScript?
#### --text--
-Which of the following variable names uses camelCase correctly?
+Which of the following variable names uses camel case correctly?
#### --distractors--
@@ -446,23 +441,23 @@ Which of the following variable names uses camelCase correctly?
#### --text--
-Which character JavaScript uses to mark the end of a statement?
+Why is it beneficial to use semicolons explicitly even though JavaScript has Automatic Semicolon Insertion?
#### --distractors--
-`:`
+To increase the execution speed of the code.
---
-`,`
+To maintain consistency with other programming languages.
---
-`.`
+To allow for better debugging and error tracing.
#### --answer--
-`;`
+To improve code readability and reliability.
### --question--
@@ -485,4 +480,3 @@ Which of the following is NOT a JavaScript data type?
#### --answer--
`Float`
-
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-local-storage-and-crud/66edd3f9bef926f129990425.md b/curriculum/challenges/german/25-front-end-development/quiz-local-storage-and-crud/66edd3f9bef926f129990425.md
index 516d98c4d5..e24ac7258c 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-local-storage-and-crud/66edd3f9bef926f129990425.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-local-storage-and-crud/66edd3f9bef926f129990425.md
@@ -7,7 +7,7 @@ dashedName: quiz-local-storage-and-crud
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-nano/66f1b03b922a53cb231e1c0d.md b/curriculum/challenges/german/25-front-end-development/quiz-nano/66f1b03b922a53cb231e1c0d.md
index c64fbf7b45..0db555f3f7 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-nano/66f1b03b922a53cb231e1c0d.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-nano/66f1b03b922a53cb231e1c0d.md
@@ -7,7 +7,7 @@ dashedName: quiz-nano
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-react-basics/66f1a2009e65c9a40a26d51e.md b/curriculum/challenges/german/25-front-end-development/quiz-react-basics/66f1a2009e65c9a40a26d51e.md
index c4d04944fa..3a650302e0 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-react-basics/66f1a2009e65c9a40a26d51e.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-react-basics/66f1a2009e65c9a40a26d51e.md
@@ -7,7 +7,7 @@ dashedName: quiz-react-basics
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-react-state-and-hooks/66f1a417757b6ca4eecd89d6.md b/curriculum/challenges/german/25-front-end-development/quiz-react-state-and-hooks/66f1a417757b6ca4eecd89d6.md
index 9567f42558..ccd75bb2fc 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-react-state-and-hooks/66f1a417757b6ca4eecd89d6.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-react-state-and-hooks/66f1a417757b6ca4eecd89d6.md
@@ -7,7 +7,7 @@ dashedName: quiz-react-state-and-hooks
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-recursion/66edd43cded6bff30944b676.md b/curriculum/challenges/german/25-front-end-development/quiz-recursion/66edd43cded6bff30944b676.md
index 19b2f867d6..4c664d2c9d 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-recursion/66edd43cded6bff30944b676.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-recursion/66edd43cded6bff30944b676.md
@@ -7,7 +7,7 @@ dashedName: quiz-recursion
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-relational-database/66f1af82732957c895f0b21a.md b/curriculum/challenges/german/25-front-end-development/quiz-relational-database/66f1af82732957c895f0b21a.md
index 0d211c1fe3..34a426be61 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-relational-database/66f1af82732957c895f0b21a.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-relational-database/66f1af82732957c895f0b21a.md
@@ -7,7 +7,7 @@ dashedName: quiz-relational-database
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-responsive-web-design/66ed9034f45ce3ece4053ebd.md b/curriculum/challenges/german/25-front-end-development/quiz-responsive-web-design/66ed9034f45ce3ece4053ebd.md
index 09267e343a..81e621ef35 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-responsive-web-design/66ed9034f45ce3ece4053ebd.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-responsive-web-design/66ed9034f45ce3ece4053ebd.md
@@ -7,7 +7,7 @@ dashedName: quiz-responsive-web-design
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-semantic-html/66ed903cf45ce3ece4053ebe.md b/curriculum/challenges/german/25-front-end-development/quiz-semantic-html/66ed903cf45ce3ece4053ebe.md
index 9ea0ef0e53..e791468957 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-semantic-html/66ed903cf45ce3ece4053ebe.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-semantic-html/66ed903cf45ce3ece4053ebe.md
@@ -7,7 +7,7 @@ dashedName: quiz-semantic-html
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -391,7 +391,7 @@ Which of the following elements represents a description term inside a descripti
#### --text--
-What is the role of the idiomatic text element?
+What is the role of the `i` element?
#### --distractors--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-styling-forms/66ed9043f45ce3ece4053ebf.md b/curriculum/challenges/german/25-front-end-development/quiz-styling-forms/66ed9043f45ce3ece4053ebf.md
index 9e01e081b0..c425ccad6a 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-styling-forms/66ed9043f45ce3ece4053ebf.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-styling-forms/66ed9043f45ce3ece4053ebf.md
@@ -7,7 +7,7 @@ dashedName: quiz-styling-forms
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-testing/66f1aeffc5774ac692112a7e.md b/curriculum/challenges/german/25-front-end-development/quiz-testing/66f1aeffc5774ac692112a7e.md
index 61e38a9945..7a66d675b9 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-testing/66f1aeffc5774ac692112a7e.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-testing/66f1aeffc5774ac692112a7e.md
@@ -7,7 +7,7 @@ dashedName: quiz-testing
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-typescript/66f1ae758b77cfc3e4da6151.md b/curriculum/challenges/german/25-front-end-development/quiz-typescript/66f1ae758b77cfc3e4da6151.md
index b87747ea76..402ae44070 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-typescript/66f1ae758b77cfc3e4da6151.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-typescript/66f1ae758b77cfc3e4da6151.md
@@ -7,7 +7,7 @@ dashedName: quiz-typescript
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/quiz-web-performance/66f1adcf97e3e4c1bd89ebf5.md b/curriculum/challenges/german/25-front-end-development/quiz-web-performance/66f1adcf97e3e4c1bd89ebf5.md
index 20779836c1..f0064b2f01 100644
--- a/curriculum/challenges/german/25-front-end-development/quiz-web-performance/66f1adcf97e3e4c1bd89ebf5.md
+++ b/curriculum/challenges/german/25-front-end-development/quiz-web-performance/66f1adcf97e3e4c1bd89ebf5.md
@@ -7,7 +7,7 @@ dashedName: quiz-web-performance
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/german/25-front-end-development/review-design-fundamentals/671a892927fdba60db05edfe.md b/curriculum/challenges/german/25-front-end-development/review-design-fundamentals/671a892927fdba60db05edfe.md
index 711022707e..25db0fc484 100644
--- a/curriculum/challenges/german/25-front-end-development/review-design-fundamentals/671a892927fdba60db05edfe.md
+++ b/curriculum/challenges/german/25-front-end-development/review-design-fundamentals/671a892927fdba60db05edfe.md
@@ -33,6 +33,7 @@ Review the concepts below to prepare for the upcoming quiz.
- **Progressive Enhancement**: This is a design approach that ensures all users, regardless of browser or device, can access the essential content and functionality of an application.
- **User-centered Design**: This is an approach that prioritizes the end user, from their needs to their preferences and limitations. The goal of user-centered design is to craft a web page that is intuitive, efficient to use, and pleasing for your users to interact with.
- **User Research**: This is the systematic study of the people who use your product. The goal is to measure user needs, behaviors, and pain points.
+- **Exit Interviews**: This is a survey you can give to users when they cancel their accounts. It can help you understand why users are leaving and what you can do to reduce churn.
- **User Testing**: This refers to the practice of capturing data from users as they interface with your application.
- **A/B Testing**: This is the process of shipping a new feature to a randomly selected subset of your user base. You can then leverage analytics data to determine if the feature is beneficial.
- **User Requirements**: This refers to the stories or rubric that your application needs to follow. User requirements might be defined by user research or industry standards. They can even be defined by stakeholder input.
diff --git a/curriculum/challenges/german/25-front-end-development/review-form-validation-with-javascript/6723ce555ff2dfc0cc04b69a.md b/curriculum/challenges/german/25-front-end-development/review-form-validation-with-javascript/6723ce555ff2dfc0cc04b69a.md
index 9c220360ea..e8b56c6cae 100644
--- a/curriculum/challenges/german/25-front-end-development/review-form-validation-with-javascript/6723ce555ff2dfc0cc04b69a.md
+++ b/curriculum/challenges/german/25-front-end-development/review-form-validation-with-javascript/6723ce555ff2dfc0cc04b69a.md
@@ -91,7 +91,7 @@ button.addEventListener('click',(event) => {
```
-- **`enctype` Attribute**: The `form` element accepts an `enctype` attribute, which represents the encoding type to use for the data. This attribute only accepts three values: `application/x-www-form-urlencoded` (which is the default, sending the data as a URL-encoded form body), `text/plain` (which sends the data in plaintext form, in `name=value` pairs separated by new lines), or `mulitpart/form-data`, which is specifically for handling forms with a file upload.
+- **`enctype` Attribute**: The `form` element accepts an `enctype` attribute, which represents the encoding type to use for the data. This attribute only accepts three values: `application/x-www-form-urlencoded` (which is the default, sending the data as a URL-encoded form body), `text/plain` (which sends the data in plaintext form, in `name=value` pairs separated by new lines), or `multipart/form-data`, which is specifically for handling forms with a file upload.
# --assignment--
diff --git a/curriculum/challenges/german/25-front-end-development/review-javascript-comparisons-and-conditionals/6723c554025f449f4f39c3f5.md b/curriculum/challenges/german/25-front-end-development/review-javascript-comparisons-and-conditionals/6723c554025f449f4f39c3f5.md
index 5ebdbeb3cc..94e4249f6d 100644
--- a/curriculum/challenges/german/25-front-end-development/review-javascript-comparisons-and-conditionals/6723c554025f449f4f39c3f5.md
+++ b/curriculum/challenges/german/25-front-end-development/review-javascript-comparisons-and-conditionals/6723c554025f449f4f39c3f5.md
@@ -28,7 +28,7 @@ console.log(null === undefined); // false
## `switch` Statements
-- **Definition**: A `switch` statement evaluates an expression and matches its value against a series of `case` clauses. When a match is found, the code block associated with that case is executed.
+- **Definition**: A `switch` statement evaluates an expression and matches its value against a series of `case` clauses. When a match is found, the code block associated with that case is executed. A `break` statement should be placed at the end of each case, to terminate its execution and continue with the next. The `default` case is an optional case and only executes if none of the other cases match. The `default` case is placed at the end of a `switch` statement.
```js
const dayOfWeek = 3;
diff --git a/curriculum/challenges/german/25-front-end-development/review-javascript-math/6723c463e51a2d9b747d7529.md b/curriculum/challenges/german/25-front-end-development/review-javascript-math/6723c463e51a2d9b747d7529.md
index 643130919d..f16459f6a3 100644
--- a/curriculum/challenges/german/25-front-end-development/review-javascript-math/6723c463e51a2d9b747d7529.md
+++ b/curriculum/challenges/german/25-front-end-development/review-javascript-math/6723c463e51a2d9b747d7529.md
@@ -56,7 +56,7 @@ console.log(typeof result2); // number
## Operator Precedence
-- **Definition**: Operator precedence determines the order in which operations are evaluated in an expression. Operators with higher precedence are evaluated before those with lower precedence. Values inside the parenthesis will be evaluated first and multiplication/division will have higher precedence than addition/subtraction. If the operators have the same precedence, then JavaScript will use associativity. Associativity is what tells JavaScript whether to evaluate operators from left to right or right to left. For example, the exponent operator is also right to left associative:
+- **Definition**: Operator precedence determines the order in which operations are evaluated in an expression. Operators with higher precedence are evaluated before those with lower precedence. Values inside the parenthesis will be evaluated first and multiplication/division will have higher precedence than addition/subtraction. If the operators have the same precedence, then JavaScript will use associativity.
```js
const result = (2 + 3) * 4;
@@ -72,6 +72,14 @@ const result3 = 2 ** 3 ** 2;
console.log(result3); // 512
```
+- **Definition**: Associativity informs us the direction in which an expression is evaluated when multiple operators of the same type exist. It defines whether the expression should be evaluated from left-to-right (`left-associative`) or right-to-left (`right-associative`). For example, the exponent operator is also right to left associative:
+
+```js
+const result4 = 5 ** 4 ** 1; // 625
+
+console.log(result4);
+```
+
## Increment and Decrement Operators
- **Increment Operator**: This operator is used to increase the value by one. The prefix notation `++num` increases the value of the variable first, then returns a new value. The postfix notation `num++` returns the current value of the variable first, then increases it.
diff --git a/curriculum/challenges/german/25-front-end-development/review-javascript/6723d3cfdd0717d3f1bf27e3.md b/curriculum/challenges/german/25-front-end-development/review-javascript/6723d3cfdd0717d3f1bf27e3.md
index 8579e569a2..3d41c6a64e 100644
--- a/curriculum/challenges/german/25-front-end-development/review-javascript/6723d3cfdd0717d3f1bf27e3.md
+++ b/curriculum/challenges/german/25-front-end-development/review-javascript/6723d3cfdd0717d3f1bf27e3.md
@@ -2126,7 +2126,7 @@ button.addEventListener('click',(event) => {
```
-- **`enctype` Attribute**: The `form` element accepts an `enctype` attribute, which represents the encoding type to use for the data. This attribute only accepts three values: `application/x-www-form-urlencoded` (which is the default, sending the data as a URL-encoded form body), `text/plain` (which sends the data in plaintext form, in `name=value` pairs separated by new lines), or `mulitpart/form-data`, which is specifically for handling forms with a file upload.
+- **`enctype` Attribute**: The `form` element accepts an `enctype` attribute, which represents the encoding type to use for the data. This attribute only accepts three values: `application/x-www-form-urlencoded` (which is the default, sending the data as a URL-encoded form body), `text/plain` (which sends the data in plaintext form, in `name=value` pairs separated by new lines), or `multipart/form-data`, which is specifically for handling forms with a file upload.
## The `date()` Object and Common Methods
diff --git a/curriculum/challenges/german/25-front-end-development/review-semantic-html/671a83934b61f64cefe87a61.md b/curriculum/challenges/german/25-front-end-development/review-semantic-html/671a83934b61f64cefe87a61.md
index 22f275bcb5..9649027bef 100644
--- a/curriculum/challenges/german/25-front-end-development/review-semantic-html/671a83934b61f64cefe87a61.md
+++ b/curriculum/challenges/german/25-front-end-development/review-semantic-html/671a83934b61f64cefe87a61.md
@@ -33,7 +33,7 @@ Review the concepts below to prepare for the upcoming quiz.
- **Abbreviation (`abbr`) element**: used to represent an abbreviation or acronym.
- **Contact Address (`address`) element**: used to represent the contact information.
- **(Date) Time (`time`) element**: used to represent a date and/or time. The `datetime` attribute is used to translate dates and times into a machine-readable format.
-- **ISO 8601 Date (`datetime`) attribute**: used to represent dates and times in a machine-readable format. The standard format is `YYYY-MM-DDThh:mm:ss`.
+- **ISO 8601 Date (`datetime`) attribute**: used to represent dates and times in a machine-readable format. The standard format is `YYYY-MM-DDThh:mm:ss`, with the capital `T` being a separator between the date and time.
- **Superscript (`sup`) element**: used to represent superscript text.
- **Subscript (`sub`) element**: used to represent subscript text.
- **Inline Code (`code`) element**: used to represent a fragment of computer code.
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-cat-photo-app/5ef9b03c81a63668521804d2.md b/curriculum/challenges/german/25-front-end-development/workshop-cat-photo-app/5ef9b03c81a63668521804d2.md
index 8841cff630..d414bd8b0e 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-cat-photo-app/5ef9b03c81a63668521804d2.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-cat-photo-app/5ef9b03c81a63668521804d2.md
@@ -9,7 +9,7 @@ dashedName: step-29
The code for an ordered list (`ol`) is similar to an unordered list, but list items in an ordered list are numbered when displayed.
-After the second `section` element's last `h3` element, add an ordered list with these three list items:
+Below the `h3` element, add an ordered list with these three list items:
`flea treatment` `thunder` `other cats`
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a8290a27c2c625e2355042.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a8290a27c2c625e2355042.md
index 6c3df3a32e..a0916ffe35 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a8290a27c2c625e2355042.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a8290a27c2c625e2355042.md
@@ -8,7 +8,7 @@ demoType: onLoad
# --description--
-In this workshop, you will learn how to work with HTML forms by building a Hotel Feedback Form.
+In this workshop, you will practice working with HTML forms by building a Hotel Feedback Form.
Start by adding the `` followed by an `html` element with a `lang` attribute of `en`.
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a83601cd819e37f0dccd14.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a83601cd819e37f0dccd14.md
index 0211b2d4d8..e8c6d8bb07 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a83601cd819e37f0dccd14.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a83601cd819e37f0dccd14.md
@@ -45,14 +45,14 @@ Your `h1` element should have the text `Hotel Feedback Form`.
```js
const h1 = document.querySelector('h1');
-assert.strictEqual(h1.innerText, 'Hotel Feedback Form');
+assert.strictEqual(h1?.innerText, 'Hotel Feedback Form');
```
Your `h1` element should be inside the `header` element.
```js
const h1 = document.querySelector('h1');
-assert.strictEqual(h1.parentElement.tagName, 'HEADER');
+assert.strictEqual(h1?.parentElement.tagName, 'HEADER');
```
You should have an opening `p` tag.
@@ -71,14 +71,21 @@ Your paragraph element should have the text `Thank you for staying with us. Plea
```js
const pElement = document.querySelector('header p');
-assert.strictEqual(pElement.innerText, 'Thank you for staying with us. Please provide feedback on your recent stay.');
+assert.strictEqual(pElement?.innerText, 'Thank you for staying with us. Please provide feedback on your recent stay.');
```
Your paragraph element should be inside your `header`.
```js
const pElement = document.querySelector('p');
-assert.strictEqual(pElement.parentElement.tagName, 'HEADER');
+assert.strictEqual(pElement?.parentElement.tagName, 'HEADER');
+```
+
+Your paragraph element should come after your `h1`.
+
+```js
+const pElement = document.querySelector('p');
+assert.strictEqual(pElement?.previousElementSibling.tagName, 'H1');
```
@@ -94,9 +101,9 @@ assert.strictEqual(pElement.parentElement.tagName, 'HEADER');
Hotel Feedback Form
- --fcc-editable-region--
+--fcc-editable-region--
- --fcc-editable-region--
+--fcc-editable-region--
```
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a83bdcf425e7446900b7c4.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a83bdcf425e7446900b7c4.md
index e8cb3207e0..d4643171b3 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a83bdcf425e7446900b7c4.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a83bdcf425e7446900b7c4.md
@@ -41,14 +41,14 @@ Your `form` element should have an `action` attribute set to `"https://hotel-fee
```js
const formElement = document.querySelector('form');
-assert.strictEqual(formElement.getAttribute('action'), 'https://hotel-feedback.freecodecamp.org');
+assert.strictEqual(formElement?.getAttribute('action'), 'https://hotel-feedback.freecodecamp.org');
```
Your `form` element should have a `method` attribute set to `"POST"`.
```js
const formElement = document.querySelector('form');
-assert.strictEqual(formElement.getAttribute('method'), 'POST');
+assert.strictEqual(formElement?.getAttribute('method'), 'POST');
```
# --seed--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a83e5e491625454b6f62c3.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a83e5e491625454b6f62c3.md
index 87d46b2f3d..7dc28787ec 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a83e5e491625454b6f62c3.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a83e5e491625454b6f62c3.md
@@ -7,7 +7,7 @@ dashedName: step-7
# --description--
-Forms consist of `inputs` where users can input their data. You can group related inputs together using the fieldset element.
+Forms consist of `inputs` where users can input their data. You can group related inputs together using the `fieldset` element.
Here is an example of using a `fieldset` element:
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a83fec026a7a4631e084d2.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a83fec026a7a4631e084d2.md
index 6a4db699c7..2e3fef945c 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a83fec026a7a4631e084d2.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a83fec026a7a4631e084d2.md
@@ -7,7 +7,7 @@ dashedName: step-8
# --description--
-When working with `fieldset` elements, it is common to use a caption to describe the group of inputs. You can use the legend element for this.
+When working with `fieldset` elements, it is common to use a caption to describe the group of inputs. You can use the `legend` element for this.
Here is an example of using a `legend` element:
@@ -46,7 +46,7 @@ Your `legend` element should contain the text `Personal Information`.
```js
const legend = document.querySelector('fieldset legend');
-assert.strictEqual(legend.innerText, 'Personal Information');
+assert.strictEqual(legend?.innerText, 'Personal Information');
```
# --seed--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a84111965a0c46df6bbd0a.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a84111965a0c46df6bbd0a.md
index 421514bde0..99916982c2 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a84111965a0c46df6bbd0a.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a84111965a0c46df6bbd0a.md
@@ -16,7 +16,7 @@ In the previous lecture videos, you learned how to associate a `label` element w
The `for` attribute on the `label` element should match the `id` attribute on the `input` element. This is known as an explicit association.
-Below your `legend` element, add a `label` element with the text of `Name (required):`. For the `for` attribute, set it to the value of `"full-name"`.
+Below your `legend` element, add a `label` element with the text of `Name (required):`. Set its `for` attribute to the value of `"full-name"`.
Then below your `label` element, add an `input` element with no attributes. In the next steps, you will add the necessary attributes.
@@ -34,30 +34,30 @@ You should have a closing `label` tag.
assert.match(code, /<\/label>/);
```
-Your `label` element should be inside the `fieldset` element.
+Your `label` element should be placed below your `legend` inside the `fieldset` element.
```js
-assert.isNotNull(document.querySelector('fieldset label'));
+assert.isNotNull(document.querySelector('fieldset legend + label'));
```
Your `label` element should have a `for` attribute with the value of `"full-name"`.
```js
-const label = document.querySelector('fieldset label');
-assert.strictEqual(label.getAttribute('for'), 'full-name');
+const label = document.querySelector('fieldset legend + label');
+assert.strictEqual(label?.getAttribute('for'), 'full-name');
```
Your `label` element should have the text of `Name (required):`.
```js
-const label = document.querySelector('fieldset label');
-assert.strictEqual(label.innerText, 'Name (required):');
+const label = document.querySelector('fieldset legend + label');
+assert.strictEqual(label?.innerText, 'Name (required):');
```
-You should have an `input` element.
+You should have an `input` element below your `label` element.
```js
-assert.isNotNull(document.querySelector('fieldset input'));
+assert.isNotNull(document.querySelector('fieldset label + input'));
```
# --seed--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a930b20f589b6664c51cb0.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a930b20f589b6664c51cb0.md
index 11278eddcd..72982e9f9e 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a930b20f589b6664c51cb0.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a930b20f589b6664c51cb0.md
@@ -37,14 +37,14 @@ Your `input` element should have a `type` attribute with the value of `"text"`.
```js
const input = document.querySelector('fieldset input');
-assert.strictEqual(input.getAttribute('type'), 'text');
+assert.strictEqual(input?.getAttribute('type'), 'text');
```
Your `input` element should have an `id` attribute with the value of `"full-name"`.
```js
const input = document.querySelector('fieldset input');
-assert.strictEqual(input.getAttribute('id'), 'full-name');
+assert.strictEqual(input?.getAttribute('id'), 'full-name');
```
# --seed--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a93730719e1f68410cce54.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a93730719e1f68410cce54.md
index 18f06cf3fa..4b1fd523b8 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a93730719e1f68410cce54.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a93730719e1f68410cce54.md
@@ -35,7 +35,7 @@ Your `input` element should have a `name` attribute with the value of `"name"`.
```js
const input = document.querySelector('fieldset input');
-assert.strictEqual(input.getAttribute('name'), 'name');
+assert.strictEqual(input?.getAttribute('name'), 'name');
```
# --seed--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a937e74920ba68ebe5e86d.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a937e74920ba68ebe5e86d.md
index 3bb5f70c0d..08e22cce0c 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a937e74920ba68ebe5e86d.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a937e74920ba68ebe5e86d.md
@@ -28,7 +28,7 @@ assert.isNotNull(document.querySelector('fieldset input'));
Your `input` should have a `placeholder` attribute with the value of `"Ex. John Doe"`.
```js
-assert.strictEqual(document.querySelector('fieldset input').getAttribute('placeholder'), 'Ex. John Doe');
+assert.strictEqual(document.querySelector('fieldset input')?.getAttribute('placeholder'), 'Ex. John Doe');
```
Your `input` should have a `required` attribute.
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a93bbe65a26169dbf3bc39.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a93bbe65a26169dbf3bc39.md
index 46689a95ea..8c4badd666 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a93bbe65a26169dbf3bc39.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a93bbe65a26169dbf3bc39.md
@@ -22,13 +22,13 @@ assert.strictEqual(document.querySelectorAll('fieldset label').length, 2);
Your `label` element should have the text `Email address (required):`.
```js
-assert.strictEqual(document.querySelector('fieldset label:nth-of-type(2)').innerText, 'Email address (required):');
+assert.strictEqual(document.querySelector('fieldset label:nth-of-type(2)')?.innerText, 'Email address (required):');
```
Your `label` element should have a `for` attribute set to the value of `"email"`.
```js
-assert.strictEqual(document.querySelector('fieldset label[for="email"]').getAttribute('for'), 'email');
+assert.strictEqual(document.querySelector('fieldset label[for="email"]')?.getAttribute('for'), 'email');
```
# --seed--
@@ -56,9 +56,9 @@ assert.strictEqual(document.querySelector('fieldset label[for="email"]').getAttr
- --fcc-editable-region--
+--fcc-editable-region--
- --fcc-editable-region--
+--fcc-editable-region--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a93c95bc58e26a8fe95818.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a93c95bc58e26a8fe95818.md
index f04b7770ce..6af65ea159 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a93c95bc58e26a8fe95818.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a93c95bc58e26a8fe95818.md
@@ -7,7 +7,7 @@ dashedName: step-14
# --description--
-Next, add an `input` with the type of `"email"` to the form. This `input` should have an `id` attribute set to the value of `"email"`. Also, set the `name` attribute to the value of `"email"`.
+Next, add an `input` with the type of `"email"` below your email `label`. This `input` should have an `id` attribute set to the value of `"email"`. Also, set the `name` attribute to the value of `"email"`.
This `input` is also required, so make sure to add the `required` attribute.
@@ -15,10 +15,10 @@ Finally, add a `placeholder` attribute set to `"example@email.com"`.
# --hints--
-You should have an `input` element.
+You should have an `input` element below your email `label`.
```js
-assert.strictEqual(document.querySelectorAll('input').length, 2);
+assert.isNotNull(document.querySelector('label[for="email"] + input'));
```
Your `input` element should have a `type` of `"email"`.
@@ -42,13 +42,13 @@ assert.isNotNull(document.querySelector('input[name="email"]'));
Your `input` element should have a `required` attribute.
```js
-assert.strictEqual(document.querySelector('input#email').getAttribute('required'), "");
+assert.strictEqual(document.querySelector('input#email')?.getAttribute('required'), "");
```
Your `input` element should have a `placeholder` attribute set to `"example@email.com"`.
```js
-assert.strictEqual(document.querySelector('input#email').getAttribute('placeholder'), "example@email.com");
+assert.strictEqual(document.querySelector('input#email')?.getAttribute('placeholder'), "example@email.com");
```
# --seed--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9401c9d660d6bb15993e2.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9401c9d660d6bb15993e2.md
index cf1e0025a7..ebebb67286 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9401c9d660d6bb15993e2.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9401c9d660d6bb15993e2.md
@@ -30,7 +30,7 @@ assert.isNotNull(document.querySelector('label[for="age"]'));
Your `label` element should have the text `Age (optional):`.
```js
-assert.strictEqual(document.querySelector('label[for="age"]').textContent, "Age (optional):");
+assert.strictEqual(document.querySelector('label[for="age"]')?.textContent, "Age (optional):");
```
# --seed--
@@ -67,9 +67,9 @@ assert.strictEqual(document.querySelector('label[for="age"]').textContent, "Age
type="email"
name="email"
/>
- --fcc-editable-region--
+--fcc-editable-region--
- --fcc-editable-region--
+--fcc-editable-region--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9419e2d18476c645ce693.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9419e2d18476c645ce693.md
index 109e7342f5..ea66f91d44 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9419e2d18476c645ce693.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9419e2d18476c645ce693.md
@@ -23,34 +23,34 @@ The `name` attribute should be set to `"age"`, the `min` attribute should be set
# --hints--
-You should have a number `input`.
+You should have a number `input` below your `label` element.
```js
-assert.isNotNull(document.querySelector('input[type="number"]'));
+assert.isNotNull(document.querySelector('label + input[type="number"]'));
```
Your number `input` should have an `id` of `age`.
```js
-assert.isNotNull(document.querySelector('input#age'));
+assert.isNotNull(document.querySelector('label + input#age'));
```
Your number `input` should have a `name` attribute set to `age`.
```js
-assert.isNotNull(document.querySelector('input[name="age"]'));
+assert.isNotNull(document.querySelector('label + input[name="age"]'));
```
Your number `input` should have a `min` attribute set to `"3"`.
```js
-assert.isNotNull(document.querySelector('input[min="3"]'));
+assert.isNotNull(document.querySelector('label + input[min="3"]'));
```
Your number `input` should have a `max` attribute set to `"100"`.
```js
-assert.isNotNull(document.querySelector('input[max="100"]'));
+assert.isNotNull(document.querySelector('label + input[max="100"]'));
```
# --seed--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a94ea5df66236ebed260e8.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a94ea5df66236ebed260e8.md
index e2670a4a35..111a4674d7 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a94ea5df66236ebed260e8.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a94ea5df66236ebed260e8.md
@@ -24,13 +24,13 @@ assert.strictEqual(document.querySelectorAll('fieldset').length, 2);
You should have a `legend` element inside of your `fieldset` element.
```js
-assert.strictEqual(document.querySelectorAll('legend').length, 2);
+assert.strictEqual(document.querySelectorAll('fieldset legend').length, 2);
```
Your `legend` element should have the text of `Was this your first time at our hotel?`.
```js
-assert.strictEqual(document.querySelectorAll('legend')[1].textContent, 'Was this your first time at our hotel?');
+assert.strictEqual(document.querySelectorAll('fieldset legend')[1]?.textContent, 'Was this your first time at our hotel?');
```
# --seed--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9521bc70162712caf118d.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9521bc70162712caf118d.md
index 19893e4ad3..076eaed7ac 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9521bc70162712caf118d.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9521bc70162712caf118d.md
@@ -26,40 +26,40 @@ Below your `label` element, add a `radio` button with the `id` set to `"yes-opti
# --hints--
-You should have a `label` element inside your `fieldset` element.
+You should have a `label` element below your `legend` element.
```js
-assert(document.querySelector('fieldset:nth-of-type(2) label'));
+assert(document.querySelector('fieldset:nth-of-type(2) legend + label'));
```
Your `label` element should have a `for` attribute set to `"yes-option"`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) label').htmlFor, 'yes-option');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) legend + label')?.htmlFor, 'yes-option');
```
Your `label` element should have the text `Yes`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) label').innerText, 'Yes');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) legend + label')?.innerText, 'Yes');
```
-You should have a `radio` button inside your `fieldset` element.
+You should have a `radio` button below your `label` element.
```js
-assert(document.querySelector('fieldset:nth-of-type(2) input[type="radio"]'));
+assert(document.querySelector('fieldset:nth-of-type(2) label + input[type="radio"]'));
```
Your `radio` button should have an `id` attribute set to `"yes-option"`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) input[type="radio"]').id, 'yes-option');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) label + input[type="radio"]')?.id, 'yes-option');
```
Your `radio` button should have a `name` attribute set to `"hotel-stay"`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) input[type="radio"]').name, 'hotel-stay');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) label + input[type="radio"]')?.name, 'hotel-stay');
```
# --seed--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a954b2bcddba72076c1857.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a954b2bcddba72076c1857.md
index 7df9c2ecbf..01c269b481 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a954b2bcddba72076c1857.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a954b2bcddba72076c1857.md
@@ -15,46 +15,46 @@ When you are finished, you can now try out the radio buttons by selecting one op
# --hints--
-You should have a `label` element inside your `fieldset` element.
+You should have a `label` element below your first radio button.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(2) label').length, 2);
+assert.isNotNull(document.querySelector('fieldset:nth-of-type(2) input[type="radio"] + label'));
```
Your `label` should have a `for` attribute set to `"no-option"`.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(2) label[for="no-option"]').length, 1);
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) input[type="radio"] + label')?.htmlFor, "no-option");
```
Your `label` should have the text of `No`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) label[for="no-option"]').textContent, 'No');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) input[type="radio"] + label[for="no-option"]')?.textContent, 'No');
```
-You should have a second `input` inside your `fieldset` element.
+You should have a second `input` below your second `label` element.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(2) input').length, 2);
+assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(2) label + input').length, 2);
```
Your `input` should have a `type` of `radio`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) input:nth-of-type(2)').getAttribute('type'), 'radio');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) label + input:nth-of-type(2)')?.getAttribute('type'), 'radio');
```
Your `input` should have an `id` of `"no-option"`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) input:nth-of-type(2)').id, 'no-option');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) label + input:nth-of-type(2)')?.id, 'no-option');
```
Your `input` should have a `name` of `"hotel-stay"`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) input:nth-of-type(2)').name, 'hotel-stay');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) label + input:nth-of-type(2)')?.name, 'hotel-stay');
```
# --seed--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9577022877d72d8f43b4f.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9577022877d72d8f43b4f.md
index 41b72559ab..ee058e8d9a 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9577022877d72d8f43b4f.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9577022877d72d8f43b4f.md
@@ -30,7 +30,7 @@ assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) legend').l
Your `legend` element should have the text of `Why did you choose to stay at our hotel? (Check all that apply)`. Double check for spelling errors and spacing issues.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(3) legend').innerText, 'Why did you choose to stay at our hotel? (Check all that apply)');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(3) legend')?.innerText, 'Why did you choose to stay at our hotel? (Check all that apply)');
```
# --seed--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a95d0eff8168747805f1f3.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a95d0eff8168747805f1f3.md
index 4dd311c518..03feb9e5e7 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a95d0eff8168747805f1f3.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a95d0eff8168747805f1f3.md
@@ -29,47 +29,47 @@ Below your `label` element, add a checkbox input with the `id`, `name` and `valu
# --hints--
-You should have a `label` element inside your `fieldset`.
+You should have a `label` element below your `legend`.
```js
-assert(document.querySelector("fieldset:nth-of-type(3) label"));
+assert(document.querySelector("fieldset:nth-of-type(3) legend + label"));
```
Your `label` element should have the text of `Social Media Ads`.
```js
-assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) label").textContent, "Social Media Ads");
+assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) legend + label")?.textContent, "Social Media Ads");
```
Your `label` element should have a `for` attribute set to `"ads"`.
```js
-assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) label").getAttribute("for"), "ads");
+assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) legend + label")?.getAttribute("for"), "ads");
```
-You should have a checkbox `input` inside your `fieldset`.
+You should have a checkbox `input` below your `label`.
```js
-const inputElement = document.querySelector("fieldset:nth-of-type(3) input[type='checkbox']");
-assert.strictEqual(inputElement.parentElement.tagName, "FIELDSET");
+const inputElement = document.querySelector("fieldset:nth-of-type(3) label + input[type='checkbox']");
+assert.strictEqual(inputElement?.parentElement.tagName, "FIELDSET");
```
Your checkbox should have an `id` attribute set to `"ads"`.
```js
-assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) input[type='checkbox']").id, "ads");
+assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) label + input[type='checkbox']")?.id, "ads");
```
Your checkbox should have a `name` attribute set to `"ads"`.
```js
-assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) input[type='checkbox']").name, "ads");
+assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) label + input[type='checkbox']")?.name, "ads");
```
Your checkbox should have a `value` attribute set to `"ads"`.
```js
-assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) input[type='checkbox']").value, "ads");
+assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) label + input[type='checkbox']")?.value, "ads");
```
# --seed--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a96127422411756204bc1b.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a96127422411756204bc1b.md
index 859a784036..137d577163 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a96127422411756204bc1b.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a96127422411756204bc1b.md
@@ -13,46 +13,46 @@ Below the `label` element, add another checkbox `input` with the `id`, `name` an
# --hints--
-You should have a `label` element.
+You should have a `label` element below your checkbox.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label").length, 2);
+assert.isNotNull(document.querySelector('fieldset:nth-of-type(3) input[type="checkbox"] + label'));
```
Your `label` element should have the text of `Personal Recommendation`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label")[1].textContent, "Personal Recommendation");
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(3) input[type="checkbox"] + label')?.textContent, "Personal Recommendation");
```
Your `label` element should have a `for` attribute set to `"recommendation"`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label")[1].getAttribute("for"), "recommendation");
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(3) input[type="checkbox"] + label')?.getAttribute("for"), "recommendation");
```
-You should have a checkbox `input`.
+You should have a checkbox `input` below your `label`.
```js
-assert(document.querySelector("fieldset:nth-of-type(3) input:nth-of-type(2)[type='checkbox']"));
+assert(document.querySelector("fieldset:nth-of-type(3) label + input:nth-of-type(2)[type='checkbox']"));
```
Your checkbox should have an `id` set to `"recommendation"`.
```js
-assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) input:nth-of-type(2)[type='checkbox']").id, "recommendation");
+assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) label + input:nth-of-type(2)[type='checkbox']")?.id, "recommendation");
```
Your checkbox should have a `name` attribute set to `"recommendation"`.
```js
-assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) input:nth-of-type(2)[type='checkbox']").name, "recommendation");
+assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) label + input:nth-of-type(2)[type='checkbox']")?.name, "recommendation");
```
Your checkbox should have a `value` attribute set to `"recommendation"`.
```js
-assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) input:nth-of-type(2)[type='checkbox']").value, "recommendation");
+assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) label + input:nth-of-type(2)[type='checkbox']")?.value, "recommendation");
```
# --seed--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a962954f4e0d76223b37ed.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a962954f4e0d76223b37ed.md
index d089dc58f3..be9afe70f6 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a962954f4e0d76223b37ed.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a962954f4e0d76223b37ed.md
@@ -20,73 +20,73 @@ For the checkbox `input`, both the `id`, `name` and `value` attributes should be
You should have a `label` element with the text of `Location`.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) label')[2].textContent, 'Location');
+assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) label')[2]?.textContent, 'Location');
```
Your `label` should have the `for` attribute set to `"location"`.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) label')[2].getAttribute('for'), 'location');
+assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) label')[2]?.getAttribute('for'), 'location');
```
-You should have a third checkbox `input`.
+You should have a third checkbox `input` after your `label`.
```js
-assert(document.querySelector("fieldset:nth-of-type(3) input:nth-of-type(3)[type='checkbox']"));
+assert(document.querySelector("fieldset:nth-of-type(3) label + input:nth-of-type(3)[type='checkbox']"));
```
Your third checkbox input should have an `id` set to `"location"`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) input[type='checkbox']")[2].getAttribute('id'), 'location');
+assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label + input[type='checkbox']")[2]?.getAttribute('id'), 'location');
```
Your third checkbox should have a `name` of `"location"`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) input[type='checkbox']")[2].getAttribute('name'), 'location');
+assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label + input[type='checkbox']")[2]?.getAttribute('name'), 'location');
```
Your third checkbox should have a `value` of `"location"`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) input[type='checkbox']")[2].getAttribute('value'), 'location');
+assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label + input[type='checkbox']")[2]?.getAttribute('value'), 'location');
```
-You should have a `label` element with the text of `Reputation`.
+You should have a `label` element with the text of `Reputation` below the location checkbox.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) label')[3].textContent, 'Reputation');
+assert.isNotNull(document.querySelectorAll('fieldset:nth-of-type(3) input[value="location"] + label')?.textContent, 'Reputation');
```
Your `label` should have the `for` attribute set to `"reputation"`.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) label')[3].getAttribute('for'), 'reputation');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(3) input[value="location"] + label')?.getAttribute('for'), 'reputation');
```
-You should have a fourth checkbox `input`.
+You should have a fourth checkbox `input` below your `label`.
```js
-assert(document.querySelector("fieldset:nth-of-type(3) input:nth-of-type(4)[type='checkbox']"));
+assert(document.querySelector("fieldset:nth-of-type(3) label + input:nth-of-type(4)[type='checkbox']"));
```
You should have a fourth checkbox `input` with an `id` of `"reputation"`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) input[type='checkbox']")[3].getAttribute('id'), 'reputation');
+assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label + input[type='checkbox']")[3]?.getAttribute('id'), 'reputation');
```
Your fourth checkbox should have a `name` of `"reputation"`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) input[type='checkbox']")[3].getAttribute('name'), 'reputation');
+assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label + input[type='checkbox']")[3]?.getAttribute('name'), 'reputation');
```
Your fourth checkbox should have a `value` of `"reputation"`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) input[type='checkbox']")[3].getAttribute('value'), 'reputation');
+assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label + input[type='checkbox']")[3]?.getAttribute('value'), 'reputation');
```
# --seed--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9689b1bf24b7750898a1b.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9689b1bf24b7750898a1b.md
index e2ad802d0d..9a016e98fa 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9689b1bf24b7750898a1b.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9689b1bf24b7750898a1b.md
@@ -18,37 +18,37 @@ Now you can test out your `form` by selecting the various checkboxes.
You should have a `label` element with the text of `Price`.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) label')[4].textContent, 'Price');
+assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) label')[4]?.textContent, 'Price');
```
Your `label` should have the `for` attribute set to `"price"`.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) label')[4].getAttribute('for'), 'price');
+assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) label')[4]?.getAttribute('for'), 'price');
```
-You should have a fifth checkbox `input`.
+You should have a fifth checkbox `input` below your `label`.
```js
-assert(document.querySelector("fieldset:nth-of-type(3) input:nth-of-type(5)[type='checkbox']"));
+assert(document.querySelector("fieldset:nth-of-type(3) label + input:nth-of-type(5)[type='checkbox']"));
```
You should have a checkbox input with an `id` of `"price"`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) input[type='checkbox']")[4].getAttribute('id'), 'price');
+assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label + input[type='checkbox']")[4]?.getAttribute('id'), 'price');
```
You should have a checkbox input with a `name` of `"price"`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) input[type='checkbox']")[4].getAttribute('name'), 'price');
+assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label + input[type='checkbox']")[4]?.getAttribute('name'), 'price');
```
Your checkbox input should have a `value` of `"price"`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) input[type='checkbox']")[4].getAttribute('value'), 'price');
+assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label + input[type='checkbox']")[4]?.getAttribute('value'), 'price');
```
# --seed--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a969951120be7818d8ee49.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a969951120be7818d8ee49.md
index 56c8279abc..1d88b0af4c 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a969951120be7818d8ee49.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a969951120be7818d8ee49.md
@@ -30,25 +30,25 @@ assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(4) legend').l
Your legend should have the text `Ratings`.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(4) legend')[0].textContent, 'Ratings');
+assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(4) legend')[0]?.textContent, 'Ratings');
```
-Your `fieldset` should have a `label` element.
+Your `fieldset` should have a `label` element below the `legend`.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(4) label').length, 1);
+assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(4) legend + label').length, 1);
```
Your `label` should have the text `How was the service?`.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(4) label')[0].textContent, 'How was the service?');
+assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(4) legend + label')[0]?.textContent, 'How was the service?');
```
Your `label` should have the `for` attribute set to `"service"`.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(4) label')[0].getAttribute('for'), 'service');
+assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(4) legend + label')[0]?.getAttribute('for'), 'service');
```
# --seed--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a96b01f33ef178dfca9e42.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a96b01f33ef178dfca9e42.md
index bde295f1a0..c4b5140287 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a96b01f33ef178dfca9e42.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a96b01f33ef178dfca9e42.md
@@ -7,7 +7,7 @@ dashedName: step-27
# --description--
-When you want users to make selections from a dropdown menu, you can use the select and option elements.
+When you want users to make selections from a dropdown menu, you can use the `select` and `option` elements.
Here is an example of using the `select` and `option` elements to create a dropdown for different cities:
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a972137acd1179fa3fe8a0.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a972137acd1179fa3fe8a0.md
index 364f267a89..ca114d2cbf 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a972137acd1179fa3fe8a0.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a972137acd1179fa3fe8a0.md
@@ -36,7 +36,7 @@ assert(document.querySelector('option[value="poor"]'));
Your `option` element with the `value` of `"poor"` should have the text `Poor`.
```js
-assert.strictEqual(document.querySelector('option[value="poor"]').textContent, 'Poor');
+assert.strictEqual(document.querySelector('option[value="poor"]')?.textContent, 'Poor');
```
You should have an `option` element with the `value` set to `"satisfactory"`.
@@ -48,7 +48,7 @@ assert(document.querySelector('option[value="satisfactory"]'));
Your `option` element with the `value` of `"satisfactory"` should have the text `Satisfactory`.
```js
-assert.strictEqual(document.querySelector('option[value="satisfactory"]').textContent, 'Satisfactory');
+assert.strictEqual(document.querySelector('option[value="satisfactory"]')?.textContent, 'Satisfactory');
```
You should have an `option` element with the `value` set to `"good"`.
@@ -61,7 +61,7 @@ Your `option` element with the `value` of `"good"` should have the text `Good`.
```js
-assert.strictEqual(document.querySelector('option[value="good"]').textContent, 'Good');
+assert.strictEqual(document.querySelector('option[value="good"]')?.textContent, 'Good');
```
You should have an `option` element with the value set to `"very-good"`.
@@ -73,7 +73,7 @@ assert(document.querySelector('option[value="very-good"]'));
Your `option` element with the `value` of `"very-good"` should have the text `Very Good`.
```js
-assert.strictEqual(document.querySelector('option[value="very-good"]').textContent, 'Very Good');
+assert.strictEqual(document.querySelector('option[value="very-good"]')?.textContent, 'Very Good');
```
You should have an `option` element with the value set to `"excellent"`.
@@ -86,7 +86,7 @@ Your `option` element with the `value` of `"excellent"` should have the text `Ex
```js
-assert.strictEqual(document.querySelector('option[value="excellent"]').textContent, 'Excellent');
+assert.strictEqual(document.querySelector('option[value="excellent"]')?.textContent, 'Excellent');
```
# --seed--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a975c259525b7bc2d5c776.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a975c259525b7bc2d5c776.md
index 557159f69f..6dd68c0f3a 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a975c259525b7bc2d5c776.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a975c259525b7bc2d5c776.md
@@ -24,19 +24,19 @@ assert(document.querySelector('label[for="food"]'));
Your `label` should have the text `How was the food?`.
```js
-assert.strictEqual(document.querySelector('label[for="food"]').textContent, 'How was the food?');
+assert.strictEqual(document.querySelector('label[for="food"]')?.textContent, 'How was the food?');
```
-You should have a `select` element with the `id` set to `"food"`.
+You should have a `select` element with the `id` set to `"food"` below your `label`.
```js
-assert(document.querySelector('select#food'));
+assert(document.querySelector('label + select#food'));
```
Your `select` element should have the `name` attribute set to `"food"`.
```js
-assert(document.querySelector('select[name="food"]'));
+assert(document.querySelector('label + select[name="food"]'));
```
# --seed--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a97ca8c4cbae7d0bb6e0ad.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a97ca8c4cbae7d0bb6e0ad.md
index 26e3f22fc2..24f241b603 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a97ca8c4cbae7d0bb6e0ad.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a97ca8c4cbae7d0bb6e0ad.md
@@ -39,7 +39,7 @@ assert(document.querySelector('fieldset:nth-of-type(4) select#food option[value=
Your `option` with the `value` of `"poor"` should have the text `"Poor"`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(4) select#food option[value="poor"]').textContent, 'Poor');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(4) select#food option[value="poor"]')?.textContent, 'Poor');
```
You should have an `option` element with the `value` set to `"satisfactory"`.
@@ -51,7 +51,7 @@ assert(document.querySelector('fieldset:nth-of-type(4) select#food option[value=
Your `option` with the `value` of `"satisfactory"` should have the text `"Satisfactory"`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(4) select#food option[value="satisfactory"]').textContent, 'Satisfactory');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(4) select#food option[value="satisfactory"]')?.textContent, 'Satisfactory');
```
You should have an `option` element with the `value` set to `"good"`.
@@ -64,7 +64,7 @@ Your `option` with the `value` of `"good"` should have the text `"Good"`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(4) select#food option[value="good"]').textContent, 'Good');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(4) select#food option[value="good"]')?.textContent, 'Good');
```
You should have an `option` element with the value set to `"very-good"`.
@@ -76,7 +76,7 @@ assert(document.querySelector('fieldset:nth-of-type(4) select#food option[value=
Your `option` with the `value` of `"very-good"` should have the text `"Very Good"`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(4) select#food option[value="very-good"]').textContent, 'Very Good');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(4) select#food option[value="very-good"]')?.textContent, 'Very Good');
```
You should have an `option` element with the value set to `"excellent"`.
@@ -89,7 +89,7 @@ Your `option` with the `value` of `"excellent"` should have the text `"Excellent
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(4) select#food option[value="excellent"]').textContent, 'Excellent');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(4) select#food option[value="excellent"]')?.textContent, 'Excellent');
```
You should have an `option` element with the `selected` attribute set to `"excellent"`.
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a97f40ddd40d7deb0618b7.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a97f40ddd40d7deb0618b7.md
index 0d44e4526b..1f5fb54be0 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a97f40ddd40d7deb0618b7.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a97f40ddd40d7deb0618b7.md
@@ -22,7 +22,7 @@ assert(document.querySelector('label[for="comments"]'));
Your `label` should have the text `Other Comments?`.
```js
-assert.strictEqual(document.querySelector('label[for="comments"]').textContent, 'Other Comments?');
+assert.strictEqual(document.querySelector('label[for="comments"]')?.textContent, 'Other Comments?');
```
# --seed--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9824ac5d9f77ec304969f.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9824ac5d9f77ec304969f.md
index 0a292d9ff3..53f4ab8e89 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9824ac5d9f77ec304969f.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9824ac5d9f77ec304969f.md
@@ -7,7 +7,7 @@ dashedName: step-33
# --description--
-If you want users to have more space to write their comments, you can use a textarea element.
+If you want users to have more space to write their comments, you can use a `textarea` element.
The `textarea` element is a multi-line text input control that allows users to enter text that is longer than a single line. It can be used to create a comment box, a message input, or other text input that requires multiple lines.
@@ -23,10 +23,10 @@ Below your `label` element, add a `textarea` element. In the next step, you will
# --hints--
-You should have a `textarea` element inside your form.
+You should have a `textarea` element below your label.
```js
-assert(document.querySelector('form textarea'));
+assert(document.querySelector('label + textarea'));
```
# --seed--
@@ -131,9 +131,8 @@ assert(document.querySelector('form textarea'));
-
-
--fcc-editable-region--
+
--fcc-editable-region--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9843525e9fa8046d709b7.md b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9843525e9fa8046d709b7.md
index d68684042a..e792e40d4e 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9843525e9fa8046d709b7.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-hotel-feedback-form/66a9843525e9fa8046d709b7.md
@@ -32,7 +32,7 @@ assert(document.querySelector('button[type="submit"]'));
Your button should have the text content of `Submit`.
```js
-assert.strictEqual(document.querySelector('button').textContent, 'Submit');
+assert.strictEqual(document.querySelector('button')?.textContent, 'Submit');
```
# --seed--
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-library-manager/67116d7584d0b469b14579c3.md b/curriculum/challenges/german/25-front-end-development/workshop-library-manager/67116d7584d0b469b14579c3.md
index da8f4aa2b4..3042cddf8f 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-library-manager/67116d7584d0b469b14579c3.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-library-manager/67116d7584d0b469b14579c3.md
@@ -30,7 +30,7 @@ assert.lengthOf(getBooksByAuthor, 2)
Your `getBooksByAuthor` function should return an array.
```js
-assert.isArray(getBooksByAuthor(library))
+assert.isArray(getBooksByAuthor(library, ''));
```
Your `getBooksByAuthor` function should use a higher order function. Ex. (`filter`, `map`, `reduce`).
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-music-player/674728eda5829d7b4c360643.md b/curriculum/challenges/german/25-front-end-development/workshop-music-player/674728eda5829d7b4c360643.md
index d4725a42a5..60faf74736 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-music-player/674728eda5829d7b4c360643.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-music-player/674728eda5829d7b4c360643.md
@@ -49,7 +49,7 @@ The third object in your `allSongs` array should have a `duration` property set
assert.equal(allSongs[2].duration, "3:51");
```
-The third object in your `allSongs` array should have a `src` property set to the string `"https://cdn.freecodecamp.org/curriculum/js-music-player/can't-stay-down.mp3"`.
+The third object in your `allSongs` array should have a `src` property set to the string `"https://cdn.freecodecamp.org/curriculum/js-music-player/still-learning.mp3"`.
```js
assert.equal(allSongs[2].src, "https://cdn.freecodecamp.org/curriculum/js-music-player/still-learning.mp3");
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-recipe-ingredient-converter/673543d867b44ac7580610a2.md b/curriculum/challenges/german/25-front-end-development/workshop-recipe-ingredient-converter/673543d867b44ac7580610a2.md
index 233026de48..ac61da05b2 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-recipe-ingredient-converter/673543d867b44ac7580610a2.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-recipe-ingredient-converter/673543d867b44ac7580610a2.md
@@ -9,7 +9,7 @@ dashedName: step-18
To finish the project, you'll need to run the `updateResultsList` function when the recipe form is submitted.
-Use an event listener to do so, and remember that you'll need to prevent the default behaviour (or the page will refresh).
+Use an event listener to do so, and remember that you'll need to prevent the default behavior (or the page will refresh).
Once that's done, take some time to experiment with different values in the form before moving on to the next module.
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-recipe-tracker/66fbcf750a62784cf11f5630.md b/curriculum/challenges/german/25-front-end-development/workshop-recipe-tracker/66fbcf750a62784cf11f5630.md
index 408895d618..77e052536f 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-recipe-tracker/66fbcf750a62784cf11f5630.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-recipe-tracker/66fbcf750a62784cf11f5630.md
@@ -9,7 +9,7 @@ dashedName: step-6
A third `recipe3` object has been filled in for you. It has the same properties as `recipe1` and `recipe2`.
-You should now push the three objects into the `recipes` array. To do thus, you can use the `push()` method.
+You should now push the three objects into the `recipes` array. To do this, you can use the `push()` method.
Use the `push()` method to push all the recipe objects into the `recipes` array. Make sure to push `recipe1`, `recipe2`, and `recipe3` in that order.
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-reusable-mega-navbar/6740495ba48aa94e5667b436.md b/curriculum/challenges/german/25-front-end-development/workshop-reusable-mega-navbar/6740495ba48aa94e5667b436.md
index 2e0e0fd742..1b7a8867a4 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-reusable-mega-navbar/6740495ba48aa94e5667b436.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-reusable-mega-navbar/6740495ba48aa94e5667b436.md
@@ -8,7 +8,7 @@ demoType: onLoad
# --description--
-In this workshop, you will practice working with React functional components by building a resuable navbar.
+In this workshop, you will practice working with React functional components by building a reusable navbar.
All the CSS have been provided for you so you can focus on creating the navbar.
diff --git a/curriculum/challenges/german/25-front-end-development/workshop-shopping-cart/63effe558c87a70e7072e447.md b/curriculum/challenges/german/25-front-end-development/workshop-shopping-cart/63effe558c87a70e7072e447.md
index bff342d205..c355e87360 100644
--- a/curriculum/challenges/german/25-front-end-development/workshop-shopping-cart/63effe558c87a70e7072e447.md
+++ b/curriculum/challenges/german/25-front-end-development/workshop-shopping-cart/63effe558c87a70e7072e447.md
@@ -7,7 +7,7 @@ dashedName: step-27
# --description--
-The behaviour of the `addItem` method needs to change if the product is already in the cart or not. Create a ternary that checks if the current product is already in the cart. Use `undefined` for both the truthy and falsy expressions to avoid a syntax error.
+The behavior of the `addItem` method needs to change if the product is already in the cart or not. Create a ternary that checks if the current product is already in the cart. Use `undefined` for both the truthy and falsy expressions to avoid a syntax error.
# --hints--
diff --git a/curriculum/challenges/italian/02-javascript-algorithms-and-data-structures/basic-javascript/increment-a-number-with-javascript.md b/curriculum/challenges/italian/02-javascript-algorithms-and-data-structures/basic-javascript/increment-a-number-with-javascript.md
index b1a9402123..85593d8a80 100644
--- a/curriculum/challenges/italian/02-javascript-algorithms-and-data-structures/basic-javascript/increment-a-number-with-javascript.md
+++ b/curriculum/challenges/italian/02-javascript-algorithms-and-data-structures/basic-javascript/increment-a-number-with-javascript.md
@@ -39,7 +39,7 @@ Non dovresti utilizzare l'operatore di assegnazione.
```js
assert(
- /let\s*myVar\s*=\s*87;\s*\/*.*\s*([+]{2}\s*myVar|myVar\s*[+]{2})/.test(__helpers.removeJSComments(code))
+ /let\s+myVar\s*=\s*87;\s*\/*.*\s*([+]{2}\s*myVar|myVar\s*[+]{2})/.test(__helpers.removeJSComments(code))
);
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614396f7ae83f20ea6f9f4b3.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614396f7ae83f20ea6f9f4b3.md
index 2403a50728..82326d1ca6 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614396f7ae83f20ea6f9f4b3.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614396f7ae83f20ea6f9f4b3.md
@@ -15,12 +15,10 @@ Questo modello utilizza le seguenti proprietà CSS:
position: absolute;
width: 1px;
height: 1px;
-padding: 0;
-margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+clip-path: inset(50%);
white-space: nowrap;
-border: 0;
```
Use the above to define the `.sr-only` CSS rule.
@@ -51,18 +49,6 @@ Dovresti assegnare a `.sr-only` una proprietà `height` con il valore `1px`.
assert.equal(new __helpers.CSSHelp(document).getStyle('.sr-only')?.height, '1px');
```
-Dovresti assegnare a `.sr-only` una proprietà `padding` con il valore `0`.
-
-```js
-assert.equal(new __helpers.CSSHelp(document).getStyle('.sr-only')?.padding, '0px');
-```
-
-Dovresti assegnare a `.sr-only` una proprietà `margin` con il valore `-1px`.
-
-```js
-assert.equal(new __helpers.CSSHelp(document).getStyle('.sr-only')?.margin, '-1px');
-```
-
Dovresti assegnare a `.sr-only` una proprietà `overflow` con il valore `hidden`.
```js
@@ -75,16 +61,16 @@ Dovresti assegnare a `.sr-only` una proprietà `clip` con il valore `rect(0, 0,
assert.equal(new __helpers.CSSHelp(document).getStyle('.sr-only')?.clip, 'rect(0px, 0px, 0px, 0px)');
```
-Dovresti assegnare a `.sr-only` una proprietà `white-space` con il valore `nowrap`.
+You should give the `.sr-only` a `clip-path` of `inset(50%)`.
```js
-assert.equal(new __helpers.CSSHelp(document).getStyle('.sr-only')?.whiteSpace, 'nowrap');
+assert.equal(new __helpers.CSSHelp(document).getStyle('.sr-only')?.clipPath, `inset(50%)`);
```
-Dovresti assegnare a `.sr-only` una proprietà `border` con il valore `0`.
+Dovresti assegnare a `.sr-only` una proprietà `white-space` con il valore `nowrap`.
```js
-assert.equal(new __helpers.CSSHelp(document).getStyle('.sr-only')?.borderWidth, '0px');
+assert.equal(new __helpers.CSSHelp(document).getStyle('.sr-only')?.whiteSpace, 'nowrap');
```
# --seed--
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143cb26f7edff2dc28f7da5.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143cb26f7edff2dc28f7da5.md
index b13a165b60..f060be37c0 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143cb26f7edff2dc28f7da5.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6143cb26f7edff2dc28f7da5.md
@@ -166,12 +166,10 @@ h2 {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6144e818fd5ea704fe56081d.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6144e818fd5ea704fe56081d.md
index 233ece82cb..66cddce68e 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6144e818fd5ea704fe56081d.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6144e818fd5ea704fe56081d.md
@@ -184,12 +184,10 @@ h2 {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6144f8dc6849e405dd8bb829.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6144f8dc6849e405dd8bb829.md
index 0165ef95c7..b3d212eb60 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6144f8dc6849e405dd8bb829.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6144f8dc6849e405dd8bb829.md
@@ -220,12 +220,10 @@ h2 {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145e6eeaa66c605eb087fe9.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145e6eeaa66c605eb087fe9.md
index 82465a34ca..3b813fca4f 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145e6eeaa66c605eb087fe9.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145e6eeaa66c605eb087fe9.md
@@ -186,12 +186,10 @@ h2 {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145e8b5080a5f06bb0223d0.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145e8b5080a5f06bb0223d0.md
index 815c27ca9c..fcd7df7e4e 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145e8b5080a5f06bb0223d0.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145e8b5080a5f06bb0223d0.md
@@ -276,12 +276,10 @@ h2 {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145eb5f08a38a0786c7a80c.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145eb5f08a38a0786c7a80c.md
index 3e8e809def..669aa8fedd 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145eb5f08a38a0786c7a80c.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145eb5f08a38a0786c7a80c.md
@@ -213,12 +213,10 @@ h2 {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145ed1f22caab087630aaad.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145ed1f22caab087630aaad.md
index ea914a4f9b..001f1a7c75 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145ed1f22caab087630aaad.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145ed1f22caab087630aaad.md
@@ -180,12 +180,10 @@ h2 {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145ee65e2e1530938cb594d.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145ee65e2e1530938cb594d.md
index 3410a5f586..1541a668c7 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145ee65e2e1530938cb594d.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145ee65e2e1530938cb594d.md
@@ -221,12 +221,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f02240ff8f09f7ec913c.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f02240ff8f09f7ec913c.md
index cc29699ab2..70964e1a40 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f02240ff8f09f7ec913c.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f02240ff8f09f7ec913c.md
@@ -204,12 +204,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f14f019a4b0adb94b051.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f14f019a4b0adb94b051.md
index bbb48ff509..445665035c 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f14f019a4b0adb94b051.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f14f019a4b0adb94b051.md
@@ -239,12 +239,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f3a5cd9be60b9459cdd6.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f3a5cd9be60b9459cdd6.md
index 60a7107a2a..8fcb4f2ed9 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f3a5cd9be60b9459cdd6.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f3a5cd9be60b9459cdd6.md
@@ -211,12 +211,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f47393fbe70c4d885f9c.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f47393fbe70c4d885f9c.md
index 36f7f10c1c..616d5afe47 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f47393fbe70c4d885f9c.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f47393fbe70c4d885f9c.md
@@ -210,12 +210,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f59029474c0d3dc1c8b8.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f59029474c0d3dc1c8b8.md
index ef1a54f402..9d9ef41d12 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f59029474c0d3dc1c8b8.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f59029474c0d3dc1c8b8.md
@@ -225,12 +225,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f685797bd30df9784e8c.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f685797bd30df9784e8c.md
index dc7fdcd234..ea8233cc86 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f685797bd30df9784e8c.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f685797bd30df9784e8c.md
@@ -219,12 +219,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f829ac6a920ebf5797d7.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f829ac6a920ebf5797d7.md
index 442e72b69e..4553382a04 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f829ac6a920ebf5797d7.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f829ac6a920ebf5797d7.md
@@ -204,12 +204,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f8f8bcd4370f6509078e.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f8f8bcd4370f6509078e.md
index 40db094ca0..1621f58e10 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f8f8bcd4370f6509078e.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f8f8bcd4370f6509078e.md
@@ -209,12 +209,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145fb5018cb5b100cb2a88c.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145fb5018cb5b100cb2a88c.md
index d42648d55f..9606b55f4b 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145fb5018cb5b100cb2a88c.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145fb5018cb5b100cb2a88c.md
@@ -218,12 +218,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145fc3707fc3310c277f5c8.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145fc3707fc3310c277f5c8.md
index bdc65ae0ae..6e2f973b78 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145fc3707fc3310c277f5c8.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145fc3707fc3310c277f5c8.md
@@ -245,12 +245,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614796cb8086be482d60e0ac.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614796cb8086be482d60e0ac.md
index a6f5100c17..952a4c38a3 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614796cb8086be482d60e0ac.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614796cb8086be482d60e0ac.md
@@ -260,12 +260,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6147a14ef5668b5881ef2297.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6147a14ef5668b5881ef2297.md
index 85b551178c..f8a747298a 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6147a14ef5668b5881ef2297.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6147a14ef5668b5881ef2297.md
@@ -249,12 +249,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614878f7a412310647873015.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614878f7a412310647873015.md
index ccab73f517..bdbb2e4937 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614878f7a412310647873015.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614878f7a412310647873015.md
@@ -234,12 +234,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61487b77d4a37707073a64e5.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61487b77d4a37707073a64e5.md
index 61152cbeb1..45ec074684 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61487b77d4a37707073a64e5.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61487b77d4a37707073a64e5.md
@@ -249,12 +249,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61487da611a65307e78d2c20.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61487da611a65307e78d2c20.md
index c9dbe96206..dabf43054f 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61487da611a65307e78d2c20.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61487da611a65307e78d2c20.md
@@ -263,12 +263,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61487f703571b60899055cf9.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61487f703571b60899055cf9.md
index 9d0fce80dc..3438ce0f73 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61487f703571b60899055cf9.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61487f703571b60899055cf9.md
@@ -275,12 +275,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614880dc16070e093e29bc56.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614880dc16070e093e29bc56.md
index 0f6f20d084..974fb73fca 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614880dc16070e093e29bc56.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614880dc16070e093e29bc56.md
@@ -247,12 +247,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614883b6fa720e09fb167de9.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614883b6fa720e09fb167de9.md
index 7a1188668a..710e24533e 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614883b6fa720e09fb167de9.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614883b6fa720e09fb167de9.md
@@ -268,12 +268,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614884c1f5d6f30ab3d78cde.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614884c1f5d6f30ab3d78cde.md
index e2304e4099..7652013203 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614884c1f5d6f30ab3d78cde.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614884c1f5d6f30ab3d78cde.md
@@ -352,12 +352,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61488ecfd05e290b5712e6da.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61488ecfd05e290b5712e6da.md
index 8d7461fea4..3b79953125 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61488ecfd05e290b5712e6da.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/61488ecfd05e290b5712e6da.md
@@ -274,12 +274,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148d99cdc7acd0c519862cb.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148d99cdc7acd0c519862cb.md
index 637f3b818a..332ddc683e 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148d99cdc7acd0c519862cb.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148d99cdc7acd0c519862cb.md
@@ -279,12 +279,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148da157cc0bd0d06df5c0a.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148da157cc0bd0d06df5c0a.md
index 854585dd67..4a9b54a068 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148da157cc0bd0d06df5c0a.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148da157cc0bd0d06df5c0a.md
@@ -287,12 +287,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148dc095264000dce348bf5.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148dc095264000dce348bf5.md
index cd9cb94d59..81ebdd13d4 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148dc095264000dce348bf5.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148dc095264000dce348bf5.md
@@ -311,12 +311,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148dcaaf2e8750e6cb4501a.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148dcaaf2e8750e6cb4501a.md
index 6cd33aecf1..c7fc1110ab 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148dcaaf2e8750e6cb4501a.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148dcaaf2e8750e6cb4501a.md
@@ -304,12 +304,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148dd31d210990f0fb140f8.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148dd31d210990f0fb140f8.md
index dd34201f99..6d7a7a1490 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148dd31d210990f0fb140f8.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148dd31d210990f0fb140f8.md
@@ -300,12 +300,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148defa9c01520fb9d178a0.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148defa9c01520fb9d178a0.md
index 7ca63e7a25..3df13d0aee 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148defa9c01520fb9d178a0.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148defa9c01520fb9d178a0.md
@@ -311,12 +311,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148dfab9b54c110577de165.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148dfab9b54c110577de165.md
index 69541b2ae3..bbd82281f6 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148dfab9b54c110577de165.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148dfab9b54c110577de165.md
@@ -348,12 +348,10 @@ h3::before {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148e0bcc13efd10f7d7a6a9.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148e0bcc13efd10f7d7a6a9.md
index 127d670332..8bcf5d7455 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148e0bcc13efd10f7d7a6a9.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148e0bcc13efd10f7d7a6a9.md
@@ -324,12 +324,10 @@ button {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148e161ecec9511941f8833.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148e161ecec9511941f8833.md
index e166921915..68bf6ded8f 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148e161ecec9511941f8833.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148e161ecec9511941f8833.md
@@ -344,12 +344,10 @@ footer {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148e28706b34912340fd042.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148e28706b34912340fd042.md
index b8f07d1aa0..22f4ca297a 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148e28706b34912340fd042.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148e28706b34912340fd042.md
@@ -347,12 +347,10 @@ footer a {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148e335c1edd512d00e4691.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148e335c1edd512d00e4691.md
index 8d07d121e5..5a71a13960 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148e335c1edd512d00e4691.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148e335c1edd512d00e4691.md
@@ -330,12 +330,10 @@ address {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148e41c728f65138addf9cc.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148e41c728f65138addf9cc.md
index 0f05a3f3da..8bda789e4c 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148e41c728f65138addf9cc.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6148e41c728f65138addf9cc.md
@@ -350,12 +350,10 @@ address {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
@@ -665,11 +663,9 @@ address {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6351e7a8684bf5377c4ee7f7.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6351e7a8684bf5377c4ee7f7.md
index b54607c6a4..29cfa6e0e8 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6351e7a8684bf5377c4ee7f7.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6351e7a8684bf5377c4ee7f7.md
@@ -216,12 +216,10 @@ h2 {
position: absolute;
width: 1px;
height: 1px;
- padding: 0;
- margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
+ clip-path: inset(50%);
white-space: nowrap;
- border: 0;
}
```
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e9.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e9.md
index f53ca2d0fe..56dbbfb4ad 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e9.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98e9.md
@@ -11,25 +11,25 @@ You should optimize your code. Move the `position` and `top` properties and valu
# --hints--
-You should not remove the `.foreground-buildings` declaration.
+Non dovresti rimuovere la dichiarazione `.foreground-buildings`.
```js
assert.exists(new __helpers.CSSHelp(document).getStyle('.foreground-buildings'));
```
-You should remove the `position` property from `.foreground-buildings`.
+Dovresti rimuovere la proprietà `position` da `.foreground-buildings`.
```js
assert.isEmpty(new __helpers.CSSHelp(document).getStyle('.foreground-buildings')?.position);
```
-You should remove the `top` property from `.foreground-buildings`.
+Dovresti rimuovere la proprietà `top` da `.foreground-buildings`.
```js
assert.isEmpty(new __helpers.CSSHelp(document).getStyle('.foreground-buildings')?.top);
```
-You should add the `position` property of `absolute` to `.background-buildings, .foreground-buildings`.
+Dovresti aggiungere la proprietà `position` con il valore `absolute` a `.background-buildings, .foreground-buildings`.
```js
function eitherOr() {
@@ -39,7 +39,7 @@ function eitherOr() {
assert.equal(eitherOr()?.position, 'absolute');
```
-You should add the `top` property of `0` to `.background-buildings, .foreground-buildings`.
+Dovresti aggiungere la proprietà `top` con il valore `0` a `.background-buildings, .foreground-buildings`.
```js
function eitherOr() {
@@ -49,7 +49,7 @@ function eitherOr() {
assert.equal(eitherOr()?.top, '0px');
```
-You should use a comma to use both `.foreground-buildings` and `.background-buildings` selectors in the same style declaration.
+Dovresti usare una virgola per utilizzare entrambi i selettori `.foreground-buildings` e `.background-buildings` nella stessa dichiarazione.
```js
function eitherOr() {
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98f0.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98f0.md
index cde269a3ef..431858271a 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98f0.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98f0.md
@@ -16,29 +16,29 @@ gradient-type(
);
```
-In the example, `color1` is solid at the top, `color2` is solid at the bottom, and in between it transitions evenly from one to the next. In `.bb1a`, add a `background` property below the `background-color` property. Set it as a gradient of type `linear-gradient` that uses `--building-color1` as the first color and `--window-color1` as the second.
+Nell'esempio, la transizione avviene in modo uniforme tra `color1` (in alto) e `color2` (in basso). In `.bb1a`, aggiungi una proprietà `background` sotto la proprietà `background-color`. Impostala con un gradiente di tipo `linear-gradient` che utilizza `--building-color1` come primo colore e `--window-color1` come secondo.
# --hints--
-You should apply a `background` to `.bb1a` right after the `background-color`.
+Dovresti applicare un `background` a `.bb1a` subito dopo `background-color`.
```js
assert(new __helpers.CSSHelp(document).getStyle('.bb1a')?.background);
```
-You should give the `background` a `linear-gradient`.
+Dovresti assegnare un `linear-gradient` al `background`.
```js
assert.include(new __helpers.CSSHelp(document).getStyle('.bb1a')?.background, 'linear-gradient');
```
-You should give the `background` a `linear-gradient` starting from `var(--building-color1)`.
+Dovresti dare un `linear-gradient` al `background` partendo da `var(--building-color1)`.
```js
assert.include(new __helpers.CSSHelp(document).getStyle('.bb1a')?.getPropVal('background', true), 'linear-gradient(var(--building-color1');
```
-You should give the `background` a `linear-gradient` ending at `var(--window-color1)`.
+Dovresti dare un `linear-gradient` al `background` finendo con `var(--window-color1)`.
```js
assert.include(new __helpers.CSSHelp(document).getStyle('.bb1a')?.getPropVal('background', true), 'linear-gradient(var(--building-color1),var(--window-color1))');
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9903.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9903.md
index 02320a6bd3..c07beb3f9a 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9903.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9903.md
@@ -11,13 +11,13 @@ On to the next building! Create a new variable called `--window-color3` in `:roo
# --hints--
-You should define a new property variable `--window-color3`.
+Dovresti definire una nuova variabile di proprietà `--window-color3`.
```js
assert(new __helpers.CSSHelp(document).isPropertyUsed("--window-color3"));
```
-You should give `--window-color3` a value of `#d98cb3`.
+Dovresti dare a `--window-color3` il valore `#d98cb3`.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(":root")?.getPropertyValue("--window-color3")?.trim(), "#d98cb3");
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e991a.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e991a.md
index 38a750c2e1..6751d6a29d 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e991a.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e991a.md
@@ -11,20 +11,20 @@ On to the next building! Nest two `div` elements within `.fb2` and give them cla
# --hints--
-You should add two `div` elements within `.fb2`.
+Dovresti aggiungere due elementi `div` all'interno di `.fb2`.
```js
assert.equal(document.querySelectorAll("div.fb2 > div")?.length, 2);
```
-You should give the first new `div` a class of `fb2a`.
+Dovresti dare al primo nuovo `div` la classe `fb2a`.
```js
assert.exists(document.querySelector("div.fb2 > div.fb2a"));
assert(document.querySelector("div.fb2 > div.fb2a") === document.querySelector("div.fb2")?.firstElementChild);
```
-You should give the second new `div` a class of `fb2b`.
+Dovresti dare al secondo nuovo `div` la classe `fb2b`.
```js
assert.exists(document.querySelector("div.fb2 > div.fb2b"));
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9927.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9927.md
index 98a329d9a5..6074375080 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9927.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9927.md
@@ -11,7 +11,7 @@ Add your `window-wrap` class to the `.fb3a` element to center and space the wind
# --hints--
-You should give `.fb3a` a class of `window-wrap`.
+Dovresti dare a `.fb3a` la classe `window-wrap`.
```js
assert.exists(document.querySelector("div.fb3a.window-wrap"));
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e992c.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e992c.md
index 47bd92f34d..699fe0ed6e 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e992c.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e992c.md
@@ -11,13 +11,13 @@ Nest six `div` elements within `.fb4b` and give them all a class of `fb4-window`
# --hints--
-You should add six `div` elements within `.fb4b`.
+Dovresti aggiungere sei elementi `div` all'interno di `.fb4b`.
```js
assert.equal(document.querySelectorAll("div.fb4b > div")?.length, 6);
```
-You should give each new `div` a class of `fb4-window`.
+Dovresti dare a ogni nuovo `div` la classe `fb4-window`.
```js
assert.equal(document.querySelectorAll("div.fb4-window")?.length, 6);
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9939.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9939.md
index 82ecd30f91..d93e2c55ec 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9939.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9939.md
@@ -11,7 +11,7 @@ At the top of the sky gradient color list, where you would put a direction for t
# --hints--
-You should give the `.sky` `radial-gradient` a direction of `circle closest-corner at 15% 15%`.
+Dovresti dare al `radial-gradient` di `.sky` la direzione `circle closest-corner at 15% 15%`.
```js
assert.match(new __helpers.CSSHelp(document).getStyle(".sky")?.background, /radial-gradient\(circle closest-corner at 15% 15%, rgb\(255, 207, 51\)|( 0%), rgb\(255, 207, 51\) 20%, rgb\(255, 255, 102\) 21%, rgb\(187, 238, 255\) 100%\)/);
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e993e.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e993e.md
index e1130fb698..021d02f59d 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e993e.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e993e.md
@@ -9,29 +9,29 @@ dashedName: step-118
Lastly, in the `:root` selector of the media query, redefine all four of the `--window-color` variables to use `#777`. When you're done, resize the window and watch it go from day to night.
-Variables are primarily used with colors, and that's how you used them here. But they can be given any value and used on any property. Your project looks great!
+Le variabili sono usate principalmente con i colori, ed è così che le hai usate qui. Ma si può dare loro qualsiasi valore e possono essere utilizzate su qualsiasi proprietà. Il tuo progetto sembra ottimo!
# --hints--
-You should add `--window-color1` with a value of `#777`.
+Dovresti aggiungere `--window-color1` con il valore `#777`.
```js
assert.equal(new __helpers.CSSHelp(document).getRuleListsWithinMedia("(max-width: 1000px)")?.find(x=>x.selectorText === ":root")?.style?.getPropertyValue("--window-color1")?.trim(), "#777");
```
-You should add `--window-color2` with a value of `#777`.
+Dovresti aggiungere `--window-color2` con il valore `#777`.
```js
assert.equal(new __helpers.CSSHelp(document).getRuleListsWithinMedia("(max-width: 1000px)")?.find(x=>x.selectorText === ":root")?.style?.getPropertyValue("--window-color2")?.trim(), "#777");
```
-You should add `--window-color3` with a value of `#777`.
+Dovresti aggiungere `--window-color3` con il valore `#777`.
```js
assert.equal(new __helpers.CSSHelp(document).getRuleListsWithinMedia("(max-width: 1000px)")?.find(x=>x.selectorText === ":root")?.style?.getPropertyValue("--window-color3")?.trim(), "#777");
```
-You should add `--window-color4` with a value of `#777`.
+Dovresti aggiungere `--window-color4` con il valore `#777`.
```js
assert.equal(new __helpers.CSSHelp(document).getRuleListsWithinMedia("(max-width: 1000px)")?.find(x=>x.selectorText === ":root")?.style?.getPropertyValue("--window-color4")?.trim(), "#777");
diff --git a/curriculum/challenges/italian/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5ef9b03c81a63668521804d2.md b/curriculum/challenges/italian/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5ef9b03c81a63668521804d2.md
index 17c64dd61f..a84f708bec 100644
--- a/curriculum/challenges/italian/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5ef9b03c81a63668521804d2.md
+++ b/curriculum/challenges/italian/14-responsive-web-design-22/learn-html-by-building-a-cat-photo-app/5ef9b03c81a63668521804d2.md
@@ -9,7 +9,7 @@ dashedName: step-29
The code for an ordered list (`ol`) is similar to an unordered list, but list items in an ordered list are numbered when displayed.
-Dopo l'ultimo elemento `h3` del secondo elemento `section`, aggiungi una lista ordinata con i seguenti elementi di lista:
+Below the `h3` element, add an ordered list with these three list items:
`flea treatment` `thunder` `other cats`
diff --git a/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65606ed6ea2baca053327e9b.md b/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65606ed6ea2baca053327e9b.md
index dca6971ea7..3a7dd17b00 100644
--- a/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65606ed6ea2baca053327e9b.md
+++ b/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-basic-string-and-array-methods-by-building-a-music-player/65606ed6ea2baca053327e9b.md
@@ -49,7 +49,7 @@ The third object in your `allSongs` array should have a `duration` property set
assert.equal(allSongs[2].duration, "3:51");
```
-The third object in your `allSongs` array should have a `src` property set to the string `"https://cdn.freecodecamp.org/curriculum/js-music-player/can't-stay-down.mp3"`.
+The third object in your `allSongs` array should have a `src` property set to the string `"https://cdn.freecodecamp.org/curriculum/js-music-player/still-learning.mp3"`.
```js
assert.equal(allSongs[2].src, "https://cdn.freecodecamp.org/curriculum/js-music-player/still-learning.mp3");
diff --git a/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f1e3f047bf4e403268713.md b/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f1e3f047bf4e403268713.md
index 3ca43b789c..54d128e9a2 100644
--- a/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f1e3f047bf4e403268713.md
+++ b/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f1e3f047bf4e403268713.md
@@ -22,7 +22,7 @@ assert.match(__helpers.removeJSComments(code), /result/);
You should use `let` to declare your `result` variable.
```js
-assert.match(__helpers.removeJSComments(code), /let\s*result/);
+assert.match(__helpers.removeJSComments(code), /let\s+result/);
```
Your `result` variable should be an empty string.
diff --git a/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4a1472f8e63d76162ce5.md b/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4a1472f8e63d76162ce5.md
index f299158dee..0228433467 100644
--- a/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4a1472f8e63d76162ce5.md
+++ b/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4a1472f8e63d76162ce5.md
@@ -22,20 +22,20 @@ assert.lengthOf(__helpers.removeJSComments(code).match(/for\s*\(/g), 2);
Your `for` loop should initialise `i` with the value of `count`.
```js
-assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s*i\s*=\s*count/);
+assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s+i\s*=\s*count/);
```
Your `for` loop should use `false` as the condition.
```js
-assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s*i\s*=\s*count\s*;\s*false/);
+assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s+i\s*=\s*count\s*;\s*false/);
```
Your `for` loop should use `false` as the iteration.
```js
-assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s*i\s*=\s*count\s*;\s*false\s*;\s*false\s*\)/);
+assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s+i\s*=\s*count\s*;\s*false\s*;\s*false\s*\)/);
```
# --seed--
diff --git a/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4a83373de83ea101685f.md b/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4a83373de83ea101685f.md
index 1e3c44fc2d..6b4056f560 100644
--- a/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4a83373de83ea101685f.md
+++ b/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4a83373de83ea101685f.md
@@ -16,7 +16,7 @@ Set your loop's condition to run when `i` is greater than `0`.
Your `for` loop should run when `i` is greater than `0`.
```js
-assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s*i\s*=\s*count\s*;\s*i\s*>\s*0\s*;\s*false\s*\)/);
+assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s+i\s*=\s*count\s*;\s*i\s*>\s*0\s*;\s*false\s*\)/);
```
# --seed--
diff --git a/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4ae5b3924c3fc3373973.md b/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4ae5b3924c3fc3373973.md
index 89ca64d9d1..910c6691c0 100644
--- a/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4ae5b3924c3fc3373973.md
+++ b/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4ae5b3924c3fc3373973.md
@@ -16,7 +16,7 @@ Like you did earlier with `i = i + 1`, update your iteration statement to give `
Your `for` loop should use `i = i - 1` as the iteration.
```js
-assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s*i\s*=\s*count\s*;\s*i\s*>\s*0\s*;\s*i\s*=\s*i\s*-\s*1\s*\)/);
+assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s+i\s*=\s*count\s*;\s*i\s*>\s*0\s*;\s*i\s*=\s*i\s*-\s*1\s*\)/);
```
# --seed--
diff --git a/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4b33e2a3364094ecb540.md b/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4b33e2a3364094ecb540.md
index a9d699b131..2099106248 100644
--- a/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4b33e2a3364094ecb540.md
+++ b/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4b33e2a3364094ecb540.md
@@ -16,25 +16,25 @@ Open up the console to see the upside-down pyramid.
Your `for` loop should call `rows.push()`.
```js
-assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s*i\s*=\s*count\s*;\s*i\s*>\s*0\s*;\s*i\s*=\s*i\s*-\s*1\s*\)\s*\{\s*rows\.push\(/);
+assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s+i\s*=\s*count\s*;\s*i\s*>\s*0\s*;\s*i\s*=\s*i\s*-\s*1\s*\)\s*\{\s*rows\.push\(/);
```
You should call `padRow()` in your `.push()` call.
```js
-assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s*i\s*=\s*count\s*;\s*i\s*>\s*0\s*;\s*i\s*=\s*i\s*-\s*1\s*\)\s*\{\s*rows\.push\(\s*padRow\s*\(/);
+assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s+i\s*=\s*count\s*;\s*i\s*>\s*0\s*;\s*i\s*=\s*i\s*-\s*1\s*\)\s*\{\s*rows\.push\(\s*padRow\s*\(/);
```
You should pass `i` as the first argument to your `padRow()` call.
```js
-assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s*i\s*=\s*count\s*;\s*i\s*>\s*0\s*;\s*i\s*=\s*i\s*-\s*1\s*\)\s*\{\s*rows\.push\(\s*padRow\s*\(\s*i/);
+assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s+i\s*=\s*count\s*;\s*i\s*>\s*0\s*;\s*i\s*=\s*i\s*-\s*1\s*\)\s*\{\s*rows\.push\(\s*padRow\s*\(\s*i/);
```
You should pass `count` as the second argument to your `padRow()` call.
```js
-assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s*i\s*=\s*count\s*;\s*i\s*>\s*0\s*;\s*i\s*=\s*i\s*-\s*1\s*\)\s*\{\s*rows\.push\(\s*padRow\s*\(\s*i\s*,\s*count\s*\)\s*\)/);
+assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s+i\s*=\s*count\s*;\s*i\s*>\s*0\s*;\s*i\s*=\s*i\s*-\s*1\s*\)\s*\{\s*rows\.push\(\s*padRow\s*\(\s*i\s*,\s*count\s*\)\s*\)/);
```
diff --git a/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4b641290da41b2cf0dd9.md b/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4b641290da41b2cf0dd9.md
index 46157c7570..9661c03941 100644
--- a/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4b641290da41b2cf0dd9.md
+++ b/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4b641290da41b2cf0dd9.md
@@ -16,13 +16,13 @@ Replace your iteration statement with the correct statement using the subtractio
Your `for` loop should not use `i = i - 1`.
```js
-assert.notMatch(__helpers.removeJSComments(code), /for\s*\(\s*let\s*i\s*=\s*count\s*;\s*i\s*>\s*0\s*;\s*i\s*=\s*i\s*-\s*1\s*\)\s*\{\s*rows\.push\(\s*padRow\s*\(\s*i\s*,\s*count\s*\)\s*\);/);
+assert.notMatch(__helpers.removeWhiteSpace(__helpers.removeJSComments(code)), /for\(leti=count;i>0;i=i-1\)\{rows\.push\(padRow\(i,count\)\);/);
```
Your `for` loop should use subtraction assignment to reduce `i` by `1`.
```js
-assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s*i\s*=\s*count\s*;\s*i\s*>\s*0\s*;\s*i\s*-=\s*1\s*\)\s*\{\s*rows\.push\(\s*padRow\s*\(\s*i\s*,\s*count\s*\)\s*\);/);
+assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s+i\s*=\s*count\s*;\s*i\s*>\s*0\s*;\s*i\s*-=\s*1\s*\)\s*\{\s*rows\.push\(\s*padRow\s*\(\s*i\s*,\s*count\s*\)\s*\);/);
```
# --seed--
diff --git a/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4c3b01c44743719c99e4.md b/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4c3b01c44743719c99e4.md
index 609eb8a720..bf1ec2fe75 100644
--- a/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4c3b01c44743719c99e4.md
+++ b/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/660f4c3b01c44743719c99e4.md
@@ -16,13 +16,13 @@ Replace your subtraction assignment with the decrement operator.
Your `for` loop should not use subtraction assignment.
```js
-assert.notMatch(__helpers.removeJSComments(code), /for\s*\(\s*let\s*i\s*=\s*count\s*;\s*i\s*>\s*0\s*;\s*i\s*-=\s*1\s*\)\s*\{\s*rows\.push\(\s*padRow\s*\(\s*i\s*,\s*count\s*\)\s*\);/);
+assert.notMatch(__helpers.removeWhiteSpace(__helpers.removeJSComments(code)), /for\(leti=count;i>0;i-=1\)\{rows\.push\(padRow\(i,count\)\);/);
```
Your `for` loop should use the decrement operator.
```js
-assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s*i\s*=\s*count\s*;\s*i\s*>\s*0\s*;\s*i--\s*\)\s*\{\s*rows\.push\(\s*padRow\s*\(\s*i\s*,\s*count\s*\)\s*\);/);
+assert.match(__helpers.removeJSComments(code), /for\s*\(\s*let\s+i\s*=\s*count\s*;\s*i\s*>\s*0\s*;\s*i--\s*\)\s*\{\s*rows\.push\(\s*padRow\s*\(\s*i\s*,\s*count\s*\)\s*\);/);
```
# --seed--
diff --git a/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/6610c8cfe4cf4d278e35c156.md b/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/6610c8cfe4cf4d278e35c156.md
index f64b00b9a5..8a06ab492f 100644
--- a/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/6610c8cfe4cf4d278e35c156.md
+++ b/curriculum/challenges/italian/15-javascript-algorithms-and-data-structures-22/learn-introductory-javascript-by-building-a-pyramid-generator/6610c8cfe4cf4d278e35c156.md
@@ -14,7 +14,7 @@ As expected, your function now returns `undefined` again. Your `call` variable i
You should not have a `call` declaration.
```js
-assert.notMatch(__helpers.removeJSComments(code), /const\s*call/);
+assert.notMatch(__helpers.removeWhiteSpace(__helpers.removeJSComments(code)), /constcall/);
```
You should not log your `call` variable.
diff --git a/curriculum/challenges/italian/21-a2-english-for-developers/learn-how-to-describe-your-current-project/656a46e84a0ad845901ea907.md b/curriculum/challenges/italian/21-a2-english-for-developers/learn-how-to-describe-your-current-project/656a46e84a0ad845901ea907.md
index 4003df9904..717d988dcc 100644
--- a/curriculum/challenges/italian/21-a2-english-for-developers/learn-how-to-describe-your-current-project/656a46e84a0ad845901ea907.md
+++ b/curriculum/challenges/italian/21-a2-english-for-developers/learn-how-to-describe-your-current-project/656a46e84a0ad845901ea907.md
@@ -13,15 +13,17 @@ To `experiment` means to try new ideas or methods.
An `interview` is a conversation where someone asks questions to get information.
-An `infographic` is a visual image like a chart or diagram used to represent information. For example:
+An `infographic` is a visual image like a chart or diagram used to represent information.
`Readers` are people who read, especially those who read a particular publication.
-`We experiment with new teaching methods` (trying new ideas)
+For example:
-`The journalist conducts interviews with her readers` (conversation for information)
+* `We experiment with new teaching methods.` (trying new ideas)
-`They use infographics to explain data` (visual images for information)
+* `The journalist conducts interviews with her readers.` (conversation for information)
+
+* `They use infographics to explain data.` (visual images for information)
# --fillInTheBlank--
diff --git a/curriculum/challenges/italian/21-a2-english-for-developers/learn-how-to-discuss-your-morning-or-evening-routine/6556bc95e6ce5d850d37dd07.md b/curriculum/challenges/italian/21-a2-english-for-developers/learn-how-to-discuss-your-morning-or-evening-routine/6556bc95e6ce5d850d37dd07.md
index 183dddda2f..903686e319 100644
--- a/curriculum/challenges/italian/21-a2-english-for-developers/learn-how-to-discuss-your-morning-or-evening-routine/6556bc95e6ce5d850d37dd07.md
+++ b/curriculum/challenges/italian/21-a2-english-for-developers/learn-how-to-discuss-your-morning-or-evening-routine/6556bc95e6ce5d850d37dd07.md
@@ -7,24 +7,23 @@ dashedName: task-3
# --description--
-Adjectives are words that describe or give more information about nouns or pronouns. For example, in the phrase `the blue sky`, `blue` is an adjective describing the sky.
+Adjectives describe or provide more information about nouns or pronouns. They usually come before the noun they modify. For example:
-Notice how the adjective comes before the noun. It is `blue sky` not `sky blue`.
+- `The blue sky` - Here, `blue` is an adjective describing the noun `sky`. Notice how the adjective `blue` comes before the noun.
-Expressive language can include idiomatic expressions or descriptive adjectives to communicate strong feelings or vivid ideas, like saying `sparkling eyes` to describe someone's bright, lively eyes.
+- `She enjoys early mornings.` - The adjective `early` describes the type of mornings she enjoys.
-Instead of saying `It seems like you have a ton of energy this morning`, James could say something like `You look energetic this morning` to convey the same idea. `Energetic` is the adjective to represent someone who has a lot of energy.
+- `He has a quick shower in the morning.` - The adjective `quick` describes how short the shower is.
-Here are some more examples:
+Adjectives can also make language more expressive by giving details about a person, place, or thing. For example:
-* `She wakes up early every day` - `Early` describes the time of her waking up.
-* `He has a quick shower in the morning` - `Quick` describes the short duration of the shower.
+Instead of saying `It seems like you have a lot of energy this morning`, you could say `You look energetic this morning`. Here, the adjective `energetic` is more concise and expressive, showing that someone has a lot of energy in a positive way.
# --questions--
## --text--
-What does the adjective `energetic` imply about someone?
+In the sentence `You look energetic this morning`, what does `energetic` suggest about the person?
## --answers--
@@ -32,7 +31,7 @@ That the person is feeling unwell.
### --feedback--
-`Energetic` is generally used to express a positive feeling about a person, not that they are feeling unwell..
+Does `energetic` usually describe someone who feels negative or unwell? Think about how we use it to describe someone's energy level.
---
@@ -44,7 +43,7 @@ That the person is uncomfortable.
### --feedback--
-`Energetic` is generally used to express how dynamic the person looks, not how comfortable they are.
+Does `energetic` describe someone's comfort level, or does it describe something more related to activity or energy?
---
@@ -52,7 +51,7 @@ That the person is late.
### --feedback--
-The adjective `energetic` does not relate to time or punctuality.
+Does `energetic` have any connection to time or being late? Reflect on its meaning in the description.
## --video-solution--
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/66609feb0374fd5b449eabcf.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/66609feb0374fd5b449eabcf.md
index f9ec35d140..85cd868047 100644
--- a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/66609feb0374fd5b449eabcf.md
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/66609feb0374fd5b449eabcf.md
@@ -1,8 +1,8 @@
---
id: 66609feb0374fd5b449eabcf
-title: "Dialogue 1: I'm Tom"
+title: "Dialogue 1: If It Doesn't Boot"
challengeType: 21
-dashedName: dialogue-1-im-tom
+dashedName: dialogue-1-if-it-doesnt-boot
---
# --description--
@@ -11,48 +11,177 @@ Watch the video below to understand the context of the upcoming lessons.
# --assignment--
-Watch the video
+Watch the video.
# --scene--
```json
{
- "setup": {
- "background": "chaos.png",
- "characters": [
- {
- "character": "David",
- "position": {"x":50,"y":80,"z":8},
- "opacity": 0
- }
- ],
- "audio": {
- "filename": "1.1-1.mp3",
- "startTime": 1,
- "startTimestamp": 5.7,
- "finishTimestamp": 6.48
- }
- },
- "commands": [
+"setup": {
+ "background": "company2-center.png",
+ "characters": [
{
- "character": "David",
- "opacity": 1,
- "startTime": 0
+ "character": "Sarah",
+ "position": { "x": -25, "y": 0, "z": 1 }
},
{
- "character": "David",
- "startTime": 1,
- "finishTime": 0.78,
- "dialogue": {
- "text": "I'm Tom.",
- "align": "center"
- }
- },
- {
- "character": "Tom",
- "opacity": 0,
- "startTime": 1.28
+ "character": "Mark",
+ "position": { "x": 125, "y": 0, "z": 1 }
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1
+ },
+ "alwaysShowDialogue": true
+},
+"commands": [
+ {
+ "character": "Sarah",
+ "position": { "x": 25, "y": 0, "z": 1 },
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "position": { "x": 70, "y": 0, "z": 1 },
+ "startTime": 0.5
+ },
+ {
+ "character": "Sarah",
+ "startTime": 1,
+ "finishTime": 4.26,
+ "dialogue": {
+ "text": "Hey Mark, have you noticed that some computers aren't booting properly?",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 4.7,
+ "finishTime": 10,
+ "dialogue": {
+ "text": "Yes, I have. If the power cable isn't connected securely, the computer won't turn on. Did you check that?",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 10.32,
+ "finishTime": 14.78,
+ "dialogue": {
+ "text": "I did, but the problem seems to be more than just the power connection. Have you seen anything similar?",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 15.32,
+ "finishTime": 19.46,
+ "dialogue": {
+ "text": "Sometimes if the BIOS is corrupted, it prevents the computer from starting.",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 19.76,
+ "finishTime": 22.06,
+ "dialogue": {
+ "text": "If that's the case, it can be tricky to fix.",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 22.84,
+ "finishTime": 27.08,
+ "dialogue": {
+ "text": "Yeah, it can. Speaking of which, another thing we can check is if the hard drive is failing.",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 27.4,
+ "finishTime": 30.36,
+ "dialogue": {
+ "text": "If it's not functioning, the operating system won't load, will it?",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 30.36,
+ "finishTime": 37.4,
+ "dialogue": {
+ "text": "Right, it won't. And if there's a software crash, it can be because of incompatible drivers or outdated software.",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 37.9,
+ "finishTime": 39.64,
+ "dialogue": {
+ "text": "Have you updated the drivers recently?",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 40.16,
+ "finishTime": 42.54,
+ "dialogue": {
+ "text": "Not yet. I was thinking about updating them this week.",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 42.84,
+ "finishTime": 44.6,
+ "dialogue": {
+ "text": "What else could cause software to crash?",
+ "align": "left"
}
- ]
+ },
+ {
+ "character": "Mark",
+ "startTime": 45.1,
+ "finishTime": 47.92,
+ "dialogue": {
+ "text": "If the application has memory leaks, it can lead to crashes.",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 48.5,
+ "finishTime": 51.94,
+ "dialogue": {
+ "text": "If you notice the system slowing down or freezing, that's a sign.",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 52.48,
+ "finishTime": 54.24,
+ "dialogue": {
+ "text": "Absolutely. Thanks for the insights, Mark.",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Mark",
+ "position": { "x": 125, "y": 0, "z": 1 },
+ "startTime": 54.74
+ },
+ {
+ "character": "Sarah",
+ "position": { "x": -25, "y": 0, "z": 1 },
+ "startTime": 55.24
+ }
+]
}
```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f8ead39fe2804c782c8c9.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f8ead39fe2804c782c8c9.md
new file mode 100644
index 0000000000..f0d6e52f26
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f8ead39fe2804c782c8c9.md
@@ -0,0 +1,110 @@
+---
+id: 677f8ead39fe2804c782c8c9
+title: Task 2
+challengeType: 19
+dashedName: task-2
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What does Sarah want to know?
+
+## --answers--
+
+If Mark knows how to fix the computers.
+
+### --feedback--
+
+Sarah is asking if Mark has noticed the issue, not about fixing it.
+
+---
+
+If Mark has turned on all the computers.
+
+### --feedback--
+
+This is not what Sarah is asking. She's referring to something else.
+
+---
+
+If Mark has noticed that some computers aren't starting correctly.
+
+---
+
+If Mark has installed software on the computers.
+
+### --feedback--
+
+Sarah's question is not about installing software.
+
+## --video-solution--
+
+3
+
+# --explanation--
+
+Sarah is asking if Mark has noticed a problem with some computers not `booting properly`.
+
+`Have you noticed` shows Sarah is checking Mark's awareness of the problem, not asking him to fix it or perform any action.
+
+`Booting` means starting a computer by loading its operating system. For example:
+
+- `Have you noticed the network is running slowly?` - This asks if someone has observed an issue.
+
+- `The laptop isn't booting properly; we need to check the operating system.` - This highlights a common problem where a computer fails to start correctly.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Sarah",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 0,
+ "finishTimestamp": 3.32
+ }
+ },
+ "commands": [
+ {
+ "character": "Sarah",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Sarah",
+ "startTime": 1,
+ "finishTime": 4.32,
+ "dialogue": {
+ "text": "Hey Mark, have you noticed that some computers aren't booting properly?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "opacity": 0,
+ "startTime": 4.82
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f90882f640e05f78fa901.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f90882f640e05f78fa901.md
new file mode 100644
index 0000000000..c074b9272a
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f90882f640e05f78fa901.md
@@ -0,0 +1,94 @@
+---
+id: 677f90882f640e05f78fa901
+title: Task 1
+challengeType: 22
+dashedName: task-1
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`Hey Mark, have you noticed that some computers BLANK BLANK?`
+
+## --blanks--
+
+`aren't booting`
+
+### --feedback--
+
+These two words refer to the computers being in the process of not starting up. It is in the `Present Continuous` tense.
+
+---
+
+`properly`
+
+### --feedback--
+
+This means functioning in the correct way. It's an adverb describing how the computers are not starting.
+
+# --explanation--
+
+The `Present Continuous` tense often emphasizes a temporary condition or an issue occurring at the moment of speaking. For example:
+
+- `The server isn't running diagnostics.` - Highlights that the diagnostics process isn't happening right now.
+
+- `Developers aren't debugging the application.` - Shows the developers aren't working on that activity at the moment.
+
+`Properly` means doing something in the correct or expected way.
+
+In this sentence, `aren't booting properly` refers to the computers currently not starting up correctly.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Sarah",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 0,
+ "finishTimestamp": 3.32
+ }
+ },
+ "commands": [
+ {
+ "character": "Sarah",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Sarah",
+ "startTime": 1,
+ "finishTime": 4.32,
+ "dialogue": {
+ "text": "Hey Mark, have you noticed that some computers aren't booting properly?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "opacity": 0,
+ "startTime": 4.82
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f90f45518530670ca5114.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f90f45518530670ca5114.md
new file mode 100644
index 0000000000..d4a71165ff
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f90f45518530670ca5114.md
@@ -0,0 +1,88 @@
+---
+id: 677f90f45518530670ca5114
+title: Task 3
+challengeType: 19
+dashedName: task-3
+---
+
+
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+Mark noticed some issues. Which option is the best response to Sarah's question?
+
+## --answers--
+
+`Yes, I have.`
+
+---
+
+`I haven't checked yet.`
+
+### --feedback--
+
+This is a possible response but doesn't acknowledge whether the issue has been noticed, which is what Sarah is asking.
+
+## --video-solution--
+
+1
+
+# --explanation--
+
+The best response is `Yes, I have`. It directly acknowledges Sarah's concern about the computers not booting properly.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Sarah",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 0,
+ "finishTimestamp": 3.32
+ }
+ },
+ "commands": [
+ {
+ "character": "Sarah",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Sarah",
+ "startTime": 1,
+ "finishTime": 4.32,
+ "dialogue": {
+ "text": "Hey Mark, have you noticed that some computers aren't booting properly?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "opacity": 0,
+ "startTime": 4.82
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f913a9584e206b4d205b9.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f913a9584e206b4d205b9.md
new file mode 100644
index 0000000000..3a8639d85b
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f913a9584e206b4d205b9.md
@@ -0,0 +1,103 @@
+---
+id: 677f913a9584e206b4d205b9
+title: Task 4
+challengeType: 22
+dashedName: task-4
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`Yes, I have. If the power cable BLANK BLANK, the computer won't turn on.`
+
+## --blanks--
+
+`isn't connected`
+
+### --feedback--
+
+These two words indicate that the power cable is not attached properly. It's in the negative form of `Present Simple` tense, showing a state of being.
+
+---
+
+`securely`
+
+### --feedback--
+
+This word describes how the cable should be connected. It's an adverb meaning in a way that is firm and steady, preventing disconnection.
+
+# --explanation--
+
+The `Present Simple` tense often refers to actions or situations that are true all the time, rather than temporary occurrences. For example:
+
+- `The system updates automatically every night.` - Refers to a scheduled routine that happens regularly.
+
+- `The app saves data to the cloud.` - States a general fact about the app's functionality.
+
+`Securely` means something is fastened, positioned, or done in a way that ensures safety or proper functioning.
+
+In this sentence, `isn't connected securely` refers to a state where the power cable is not attached properly, preventing the computer from turning on.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 3.5,
+ "finishTimestamp": 8.08
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 2.18,
+ "dialogue": {
+ "text": "Yes, I have.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 2.38,
+ "finishTime": 5.58,
+ "dialogue": {
+ "text": "If the power cable isn't connected securely, the computer won't turn on.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 6.08
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f91aca4fe09070619755f.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f91aca4fe09070619755f.md
new file mode 100644
index 0000000000..b1e87c5cb8
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f91aca4fe09070619755f.md
@@ -0,0 +1,92 @@
+---
+id: 677f91aca4fe09070619755f
+title: Task 5
+challengeType: 22
+dashedName: task-5
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`If the BLANK BLANK isn't connected securely, the computer won't turn on.`
+
+## --blanks--
+
+`power`
+
+### --feedback--
+
+This word refers to electricity or energy needed to operate the computer. Think of what type of cable provides this.
+
+---
+
+`cable`
+
+### --feedback--
+
+This word refers to the physical wire that connects the computer to a power source. Think of what connects to an outlet or power strip.
+
+# --explanation--
+
+`Power cable` refers to the wire that supplies electricity to the computer:
+
+`Power` means energy or electricity, and `cable` is the wire or cord used to transfer it. For example:
+
+- `The server shut down because the power cable was disconnected.` - The server turned off when the power cord was unplugged.
+
+- `Check if the power cable is properly connected before troubleshooting.` - Ensure the power cord is plugged in before fixing other issues.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 4.88,
+ "finishTimestamp": 8.08
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 4.2,
+ "dialogue": {
+ "text": "If the power cable isn't connected securely, the computer won't turn on.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 4.7
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f91ef11ade10743700257.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f91ef11ade10743700257.md
new file mode 100644
index 0000000000..32572c2c87
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f91ef11ade10743700257.md
@@ -0,0 +1,104 @@
+---
+id: 677f91ef11ade10743700257
+title: Task 6
+challengeType: 19
+dashedName: task-6
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What does Mark explain about the power cable?
+
+## --answers--
+
+If the power cable is too long, the computer might not turn on.
+
+### --feedback--
+
+Mark is talking about the connection, not the length of the cable.
+
+---
+
+The power cable needs to be properly connected for the computer to work.
+
+---
+
+If the power cable is damaged, the computer won't turn on.
+
+### --feedback--
+
+Mark is talking about the connection, not the cable's condition.
+
+---
+
+If the power cable is too old, the computer won't turn on.
+
+### --feedback--
+
+This answer is about the age of the cable, but Mark is discussing whether the cable is securely connected.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+Mark is explaining that if the power cable `isn't connected securely`, the computer won't turn on.
+
+This highlights the importance of a stable, permanent connection for the computer to work, and the `Present Simple` tense emphasizes the ongoing state of the cable needing to be securely attached.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 4.88,
+ "finishTimestamp": 8.08
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 4.2,
+ "dialogue": {
+ "text": "If the power cable isn't connected securely, the computer won't turn on.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 4.7
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f923709a40d07976ad2a0.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f923709a40d07976ad2a0.md
new file mode 100644
index 0000000000..3328680225
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f923709a40d07976ad2a0.md
@@ -0,0 +1,90 @@
+---
+id: 677f923709a40d07976ad2a0
+title: Task 7
+challengeType: 22
+dashedName: task-7
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`BLANK the power cable isn't connected securely, the computer BLANK turn on.`
+
+## --blanks--
+
+`If`
+
+### --feedback--
+
+This word introduces a condition. The first letter is capitalized.
+
+---
+
+`won't`
+
+### --feedback--
+
+This is the contraction for `will not`.
+
+# --explanation--
+
+The `First Conditional` is used to talk about possible situations in the present or future. It is formed with `if` + `Present Simple` (for the condition) and `will` + base verb (for the result). For example:
+
+`If you forget to save your work, you will lose your progress.` - Not saving will cause you to lose what you've done.
+
+In this dialogue, `If the power cable isn't connected securely` is the condition, and `the computer won't turn on` is the result of that condition not being met.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 4.88,
+ "finishTimestamp": 8.08
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 4.2,
+ "dialogue": {
+ "text": "If the power cable isn't connected securely, the computer won't turn on.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 4.7
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f927e948d3d07d594fb56.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f927e948d3d07d594fb56.md
new file mode 100644
index 0000000000..38a3805ee7
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f927e948d3d07d594fb56.md
@@ -0,0 +1,106 @@
+---
+id: 677f927e948d3d07d594fb56
+title: Task 8
+challengeType: 19
+dashedName: task-8
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What can happen if the power cable isn't working correctly?
+
+## --answers--
+
+The computer will turn on normally.
+
+### --feedback--
+
+If the power cable isn't connected something wrong will happen. Listen to the audio again.
+
+---
+
+The computer won't turn on.
+
+---
+
+The computer will start, but it might freeze.
+
+### --feedback--
+
+He doesn't mention the computer freezing.
+
+---
+
+The computer will keep restarting.
+
+### --feedback--
+
+Mark doesn't mention restarting.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+The condition `If the power cable isn't connected securely` leads to the result `the computer won't turn on`.
+
+This structure is used to talk about real and possible future situations.
+
+If the cable isn't properly connected, the computer won't work.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 4.88,
+ "finishTimestamp": 8.08
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 4.2,
+ "dialogue": {
+ "text": "If the power cable isn't connected securely, the computer won't turn on.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 4.7
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f92d0be465d082912f34d.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f92d0be465d082912f34d.md
new file mode 100644
index 0000000000..34a06486ed
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f92d0be465d082912f34d.md
@@ -0,0 +1,117 @@
+---
+id: 677f92d0be465d082912f34d
+title: Task 9
+challengeType: 19
+dashedName: task-9
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What does Mark want to know?
+
+## --answers--
+
+If the power cable was connected by Sarah.
+
+### --feedback--
+
+Mark's question is not about who connected it.
+
+---
+
+If the computer is ready to be turned on.
+
+### --feedback--
+
+Mark is not asking about the computer's readiness.
+
+---
+
+If Sarah checked the connection of the power cable.
+
+---
+
+If the power cable is broken.
+
+### --feedback--
+
+Mark's question doesn't focus on the condition of the cable.
+
+## --video-solution--
+
+3
+
+# --explanation--
+
+The question `Did you check that?` is asking if someone verified or confirmed something.
+
+In this context, Mark wants to know if Sarah checked the connection of the power cable to ensure it's secure. Other examples:
+
+- `Did you check that the windows are closed?` - This means asking if someone ensured the windows are securely shut.
+
+- `Did you check that the light is off?` - This means asking if someone confirmed the light is turned off.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 4.88,
+ "finishTimestamp": 9
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 4.2,
+ "dialogue": {
+ "text": "If the power cable isn't connected securely, the computer won't turn on.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 4.28,
+ "finishTime": 5.12,
+ "dialogue": {
+ "text": "Did you check that?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 5.62
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f93114e9f0c08773806ac.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f93114e9f0c08773806ac.md
new file mode 100644
index 0000000000..804cc0ec86
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f93114e9f0c08773806ac.md
@@ -0,0 +1,97 @@
+---
+id: 677f93114e9f0c08773806ac
+title: Task 10
+challengeType: 19
+dashedName: task-10
+---
+
+
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+Sarah has already checked the connection. What should she answer?
+
+## --answers--
+
+`I am going to.`
+
+### --feedback--
+
+This answer suggests the action will happen in the future, but Sarah has already checked it.
+
+---
+
+`I did.`
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+Mark is asking if Sarah checked the power cable connection. The correct answer, `I did`, uses the `Past Simple` tense to confirm that she already completed the action. It is a direct, short response to acknowledge that the task has been done.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 4.88,
+ "finishTimestamp": 9
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 4.2,
+ "dialogue": {
+ "text": "If the power cable isn't connected securely, the computer won't turn on.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 4.28,
+ "finishTime": 5.12,
+ "dialogue": {
+ "text": "Did you check that?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 5.62
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f952a8fb67309ad8be057.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f952a8fb67309ad8be057.md
new file mode 100644
index 0000000000..b0e5d66e77
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f952a8fb67309ad8be057.md
@@ -0,0 +1,117 @@
+---
+id: 677f952a8fb67309ad8be057
+title: Task 11
+challengeType: 19
+dashedName: task-11
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What is Sarah communicating?
+
+## --answers--
+
+The power connection is the only issue.
+
+### --feedback--
+
+Sarah is saying the problem is more than just the power connection, so there are other issues.
+
+---
+
+There is a problem with the power connection.
+
+### --feedback--
+
+Sarah suggests the power connection is not the only issue. There seems to be something more going on.
+
+---
+
+The power connection is not the issue at all.
+
+### --feedback--
+
+Sarah has already checked the power connection, but she is suggesting that there may be another problem beyond that.
+
+---
+
+The problems seems to be more than just power connection.
+
+## --video-solution--
+
+4
+
+# --explanation--
+
+Sarah indicates that while the power connection might be part of the problem, it isn't the only issue:
+
+`I did` confirms that Sarah has already checked the power connection, meaning she has ruled it out as the sole problem.
+
+`But` introduces a contrast, showing that while the power connection was checked, it isn't the only issue.
+
+`More than just` makes it clear there are other factors involved.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Sarah",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 9.32,
+ "finishTimestamp": 12.48
+ }
+ },
+ "commands": [
+ {
+ "character": "Sarah",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Sarah",
+ "startTime": 1,
+ "finishTime": 2.86,
+ "dialogue": {
+ "text": "I did, but the problem seems to be more",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 2.86,
+ "finishTime": 4.16,
+ "dialogue": {
+ "text": "than just the power connection.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "opacity": 0,
+ "startTime": 4.46
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f95eae1285f0a1e2c8e3b.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f95eae1285f0a1e2c8e3b.md
new file mode 100644
index 0000000000..de16028406
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f95eae1285f0a1e2c8e3b.md
@@ -0,0 +1,122 @@
+---
+id: 677f95eae1285f0a1e2c8e3b
+title: Task 12
+challengeType: 19
+dashedName: task-12
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What does Sarah want to know?
+
+## --answers--
+
+If Mark has experienced a similar problem before.
+
+---
+
+If Mark can fix the computer immediately.
+
+### --feedback--
+
+Sarah is asking about his experience, not whether he can fix the computer.
+
+---
+
+If Mark has seen a power cable issue like this.
+
+### --feedback--
+
+Sarah is referring to the overall problem, not just the power connection.
+
+---
+
+If Mark knows someone who can fix the computer.
+
+### --feedback--
+
+Sarah's question is about Mark's past experiences with similar problems, not about finding someone else to fix it.
+
+## --video-solution--
+
+1
+
+# --explanation--
+
+The question `Have you seen anything similar?` is a way of asking whether someone has encountered a situation or issue like this before.
+
+In the audio, Sarah is asking Mark if he has had experience with a similar problem.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Sarah",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 9.32,
+ "finishTimestamp": 13.98
+ }
+ },
+ "commands": [
+ {
+ "character": "Sarah",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Sarah",
+ "startTime": 1,
+ "finishTime": 2.86,
+ "dialogue": {
+ "text": "I did, but the problem seems to be more",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 2.86,
+ "finishTime": 3.96,
+ "dialogue": {
+ "text": "than just the power connection.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 4.28,
+ "finishTime": 5.66,
+ "dialogue": {
+ "text": "Have you seen anything similar?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "opacity": 0,
+ "startTime": 6.16
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f991400370c0a848a57d6.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f991400370c0a848a57d6.md
new file mode 100644
index 0000000000..299bd620fd
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f991400370c0a848a57d6.md
@@ -0,0 +1,106 @@
+---
+id: 677f991400370c0a848a57d6
+title: Task 13
+challengeType: 19
+dashedName: task-13
+---
+
+
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+Mark has seen something similar. What can he answer?
+
+## --answers--
+
+`Yes, I have.`
+
+---
+
+`I will.`
+
+### --feedback--
+
+This is not the best answer. `I will` implies Mark will see something similar in the future, while Sarah is asking about past experience.
+
+## --video-solution--
+
+1
+
+# --explanation--
+
+Sarah is asking if Mark's seen anything similar before. `Yes, I have`, confirms that he's had a similar experience in the past. If he hasn't, `No, I haven't` would work as well.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Sarah",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 9.32,
+ "finishTimestamp": 13.98
+ }
+ },
+ "commands": [
+ {
+ "character": "Sarah",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Sarah",
+ "startTime": 1,
+ "finishTime": 2.86,
+ "dialogue": {
+ "text": "I did, but the problem seems to be more",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 2.86,
+ "finishTime": 3.96,
+ "dialogue": {
+ "text": "than just the power connection.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 4.28,
+ "finishTime": 5.66,
+ "dialogue": {
+ "text": "Have you seen anything similar?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "opacity": 0,
+ "startTime": 6.16
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f999abaab350ad20314d4.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f999abaab350ad20314d4.md
new file mode 100644
index 0000000000..fd5e47c810
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f999abaab350ad20314d4.md
@@ -0,0 +1,91 @@
+---
+id: 677f999abaab350ad20314d4
+title: Task 14
+challengeType: 22
+dashedName: task-14
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`Sometimes if the BLANK is corrupted, it prevents the computer from starting.`
+
+## --blanks--
+
+`BIOS`
+
+### --feedback--
+
+It's a system component that controls the hardware of the computer. All letters are capitalized.
+
+# --explanation--
+
+`BIOS` stands for `Basic Input/Output System`. It is a crucial system component that helps initialize the hardware during startup and loads the operating system. For example:
+
+- `If the BIOS is outdated, your system may have performance issues.` - An old BIOS can cause your computer to run poorly.
+
+- `Press F2 to enter the BIOS and change system settings.` - Pressing F2 lets you access the BIOS to modify the system's options.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 14.12,
+ "finishTimestamp": 18.46
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 3.44,
+ "dialogue": {
+ "text": "Sometimes if the BIOS is corrupted,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 3.82,
+ "finishTime": 5.34,
+ "dialogue": {
+ "text": "it prevents the computer from starting.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 5.84
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f99d60aabe70b1148f438.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f99d60aabe70b1148f438.md
new file mode 100644
index 0000000000..5d14ef99d6
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f99d60aabe70b1148f438.md
@@ -0,0 +1,99 @@
+---
+id: 677f99d60aabe70b1148f438
+title: Task 15
+challengeType: 22
+dashedName: task-15
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`Sometimes if the BIOS BLANK BLANK, it prevents the computer from starting.`
+
+## --blanks--
+
+`is`
+
+### --feedback--
+
+This is the verb `to be` as an auxiliary verb.
+
+---
+
+`corrupted`
+
+### --feedback--
+
+This is the main verb conjugated in the `Past Participle`. It ends with `-ed`.
+
+# --explanation--
+
+The `Present Simple` tense is often used to describe states, facts, or conditions that are generally true. This tense is used because the corruption of the BIOS is considered a stable or unchanging condition when the computer tries to boot up.
+
+`Is corrupted` means damaged or changed in a way that causes it to stop working properly. For example:
+
+`The file is corrupted and won't open.` - The file is damaged and cannot be accessed.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 14.12,
+ "finishTimestamp": 18.46
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 3.44,
+ "dialogue": {
+ "text": "Sometimes if the BIOS is corrupted,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 3.82,
+ "finishTime": 5.34,
+ "dialogue": {
+ "text": "it prevents the computer from starting.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 5.84
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9a5ccada890b7d7aaf97.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9a5ccada890b7d7aaf97.md
new file mode 100644
index 0000000000..9db12e1060
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9a5ccada890b7d7aaf97.md
@@ -0,0 +1,103 @@
+---
+id: 677f9a5ccada890b7d7aaf97
+title: Task 16
+challengeType: 22
+dashedName: task-16
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`Sometimes BLANK the BIOS is corrupted, BLANK the computer from starting.`
+
+## --blanks--
+
+`if`
+
+### --feedback--
+
+This word introduces a condition.
+
+---
+
+`it prevents`
+
+### --feedback--
+
+The first word is a pronoun and the second is a verb that means to stop something from happening.
+
+# --explanation--
+
+The `Zero Conditional` is used for things that are always true when a condition is met.
+
+It follows the structure `if` + `Present Simple` (for the condition) and `Present Simple` (for the result). For example:
+
+- `If you press the power button, the computer starts.` - Pressing the power button always turns on the computer.
+
+- `If the internet is down, the website doesn't load.` - The website won't open if there's no internet connection.
+
+In this dialogue, `if the BIOS is corrupted` is the condition, and `it prevents the computer from starting` is the result. This is a general truth about how corrupted BIOS affects the computer.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 14.12,
+ "finishTimestamp": 18.46
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 3.44,
+ "dialogue": {
+ "text": "Sometimes if the BIOS is corrupted,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 3.82,
+ "finishTime": 5.34,
+ "dialogue": {
+ "text": "it prevents the computer from starting.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 5.84
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9aa911c1110bc1c41407.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9aa911c1110bc1c41407.md
new file mode 100644
index 0000000000..4989cb16ea
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9aa911c1110bc1c41407.md
@@ -0,0 +1,122 @@
+---
+id: 677f9aa911c1110bc1c41407
+title: Task 18
+challengeType: 19
+dashedName: task-18
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What is Mark talking about in this conversation?
+
+## --answers--
+
+If the BIOS is corrupted, the computer won't turn on and, and fixing it can be difficult.
+
+---
+
+The BIOS always works fine, but sometimes it needs fixes.
+
+### --feedback--
+
+Mark doesn't mention what happens when the BIOS is working fine.
+
+---
+
+If the BIOS is corrupted, the computer will automatically fix itself.
+
+### --feedback--
+
+Mark mentions that fixing can be tricky, implying that it's not automatic.
+
+---
+
+The computer starts perfectly every time, even if the BIOS is corrupted.
+
+### --feedback--
+
+Are you sure the computer starts perfectly? Pay attention to what happens to the computer.
+
+## --video-solution--
+
+1
+
+# --explanation--
+
+Mark says, `Sometimes if the BIOS is corrupted, it prevents the computer from starting`. This indicates that BIOS corruption can stop the computer from booting.
+
+He adds, `If that's the case, it can be a bit tricky to fix`. This means that fixing this issue is not straightforward or automatic.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 14.12,
+ "finishTimestamp": 21.06
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 3.44,
+ "dialogue": {
+ "text": "Sometimes if the BIOS is corrupted,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 3.82,
+ "finishTime": 5.34,
+ "dialogue": {
+ "text": "it prevents the computer from starting.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 5.44,
+ "finishTime": 7.94,
+ "dialogue": {
+ "text": "If that's the case, it can be tricky to fix.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 8.44
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9b142ee15b0c2b8080a9.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9b142ee15b0c2b8080a9.md
new file mode 100644
index 0000000000..13ff548cb2
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9b142ee15b0c2b8080a9.md
@@ -0,0 +1,94 @@
+---
+id: 677f9b142ee15b0c2b8080a9
+title: Task 17
+challengeType: 22
+dashedName: task-17
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`If that's the case, it can be BLANK BLANK to fix.`
+
+## --blanks--
+
+`a bit`
+
+### --feedback--
+
+This phrase of two words means `slightly` or `somewhat`. It is often used to describe something that is small in degree. the first word is an article.
+
+---
+
+`tricky`
+
+### --feedback--
+
+This word means `difficult` or `complicated`. It suggests that fixing the problem requires effort or skill. It ends with `-y`.
+
+# --explanation--
+
+Mark says, `it can be a bit tricky to fix`, which means that fixing the BIOS issue is somewhat difficult.
+
+`A bit` softens the intensity of the statement, indicating that the difficulty is not extreme but still present. For example:
+
+`I'm a bit tired today` means you're slightly tired.
+
+`Tricky` means something is challenging or requires careful effort. For example:
+
+`Solving this puzzle is tricky` suggests that it requires thought and skill.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 18.76,
+ "finishTimestamp": 21.06
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 3.3,
+ "dialogue": {
+ "text": "If that's the case, it can be tricky to fix.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 3.8
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9b506ea2690c6c22ef7e.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9b506ea2690c6c22ef7e.md
new file mode 100644
index 0000000000..5475b8534b
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9b506ea2690c6c22ef7e.md
@@ -0,0 +1,118 @@
+---
+id: 677f9b506ea2690c6c22ef7e
+title: Task 20
+challengeType: 22
+dashedName: task-20
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`Yeah, it can. Speaking of which, another thing we can check is if the hard drive BLANK BLANK.`
+
+## --blanks--
+
+`is`
+
+### --feedback--
+
+This is the verb `to be`, used here as part of the `Present Continuous` tense.
+
+---
+
+`failing`
+
+### --feedback--
+
+This verb means something is starting to stop working properly. It's in the `Present Continuous` tense and ends with `-ing.`
+
+# --explanation--
+
+Let's review the key vocabulary and grammar in this sentence:
+
+`Hard drive` is the part of a computer where all files and programs are stored. For example:
+
+`The hard drive is almost full, so I need to delete some old files.` – This means the hard drive doesn't have much space left.
+
+`Failing` means something is starting to stop working. For example:
+
+`The hard drive is failing, so we need to back up the files.` – This means the hard drive is breaking down and may stop working soon.
+
+`Is failing`is the `Present Continuous` tense, used to describe something happening now or temporarily. For example:
+
+`The hard drive is failing` – This means the hard drive currently has problems, and it is an ongoing issue.
+
+In this sentence, `is failing` describes the hard drive's condition. It shows that the problem is happening now and might cause the computer to stop working soon.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Sarah",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 21.74,
+ "finishTimestamp": 26.18
+ }
+ },
+ "commands": [
+ {
+ "character": "Sarah",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Sarah",
+ "startTime": 1,
+ "finishTime": 2.02,
+ "dialogue": {
+ "text": "Yeah, it can.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 2.34,
+ "finishTime": 3.04,
+ "dialogue": {
+ "text": "Speaking of which,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 3.24,
+ "finishTime": 5.44,
+ "dialogue": {
+ "text": "another thing we can check is if the hard drive is failing.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "opacity": 0,
+ "startTime": 5.94
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9b8ad0f6760cb1d27753.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9b8ad0f6760cb1d27753.md
new file mode 100644
index 0000000000..3e27c4aaa0
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9b8ad0f6760cb1d27753.md
@@ -0,0 +1,124 @@
+---
+id: 677f9b8ad0f6760cb1d27753
+title: Task 21
+challengeType: 19
+dashedName: task-21
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What is Sarah proposing to check?
+
+## --answers--
+
+If the power cable is securely connected.
+
+### --feedback--
+
+Sarah didn't mention the power cable.
+
+---
+
+If the BIOS needs an update.
+
+### --feedback--
+
+Sarah is not proposing anything about the BIOS.
+
+---
+
+If the computer is overheating.
+
+### --feedback--
+
+Sarah didn't mention overheating as an issue to check.
+
+---
+
+If the hard drive is failing.
+
+## --video-solution--
+
+4
+
+# --explanation--
+
+The `hard drive` is a storage device in a computer that saves data like documents, software, and system files. It is essential for the computer to operate and store information permanently. For example:
+
+- `I saved the project files on my hard drive.` - You stored the project files on your computer's storage device.
+
+- `The hard drive crashed, and we lost some data.` - The storage device failed, causing the team to lose information.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Sarah",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 21.74,
+ "finishTimestamp": 26.18
+ }
+ },
+ "commands": [
+ {
+ "character": "Sarah",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Sarah",
+ "startTime": 1,
+ "finishTime": 2.02,
+ "dialogue": {
+ "text": "Yeah, it can.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 2.34,
+ "finishTime": 3.04,
+ "dialogue": {
+ "text": "Speaking of which,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 3.24,
+ "finishTime": 5.44,
+ "dialogue": {
+ "text": "another thing we can check is if the hard drive is failing.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "opacity": 0,
+ "startTime": 5.94
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9d50ede84f0dfa1c300f.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9d50ede84f0dfa1c300f.md
new file mode 100644
index 0000000000..98fc1b15e0
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9d50ede84f0dfa1c300f.md
@@ -0,0 +1,115 @@
+---
+id: 677f9d50ede84f0dfa1c300f
+title: Task 22
+challengeType: 19
+dashedName: task-22
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What does `if the hard drive is failing` mean?
+
+## --answers--
+
+The hard drive is being updated with new data.
+
+### --feedback--
+
+If the hard drive fails, it's not working properly, not being updated.
+
+---
+
+The hard drive is storing new files.
+
+### --feedback--
+
+`Failing` means the hard drive is having trouble functioning, not storing data.
+
+---
+
+The hard drive is starting to work faster.
+
+### --feedback--
+
+`Failing` means the hard drive is not working properly, not speeding up.
+
+---
+
+The hard drive is not working properly or has stopped working.
+
+## --video-solution--
+
+4
+
+# --explanation--
+
+`Fail` means something isn't working as it should. It refers to a problem that affects the normal operation. For example:
+
+- `The server is failing because of high traffic.` - The server is crashing due to too many users at once.
+
+- `The app failed during the beta testing phase.` - The application didn't work properly when tested by users.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Sarah",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 22.78,
+ "finishTimestamp": 26.18
+ }
+ },
+ "commands": [
+ {
+ "character": "Sarah",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Sarah",
+ "startTime": 1,
+ "finishTime": 2.0,
+ "dialogue": {
+ "text": "Speaking of which,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 2.2,
+ "finishTime": 4.4,
+ "dialogue": {
+ "text": "another thing we can check is if the hard drive is failing.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "opacity": 0,
+ "startTime": 4.9
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9de774ab730e54080e0f.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9de774ab730e54080e0f.md
new file mode 100644
index 0000000000..305ea152ed
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9de774ab730e54080e0f.md
@@ -0,0 +1,99 @@
+---
+id: 677f9de774ab730e54080e0f
+title: Task 23
+challengeType: 22
+dashedName: task-23
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`If it's BLANK, the operating system BLANK, will it?`
+
+## --blanks--
+
+`not functioning`
+
+### --feedback--
+
+These two words together mean "not working". The first word is a negative, and the second describes the action.
+
+---
+
+`won't load`
+
+### --feedback--
+
+This means `will not start or operate`. The first word is a contraction, and the second describes an action related to initiating something.
+
+# --explanation--
+
+The sentence uses a `First Conditional` to describe a possible situation in the present or future. For example:
+
+`If you restart the system, the problem will go away.` - Restarting the system will likely resolve the issue.
+
+In the dialogue, `If it's not functioning` refers to the condition, and `the operating system won't load` describes the result of that condition.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Sarah",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 26.4,
+ "finishTimestamp": 29.36
+ }
+ },
+ "commands": [
+ {
+ "character": "Sarah",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Sarah",
+ "startTime": 1,
+ "finishTime": 1.94,
+ "dialogue": {
+ "text": "If it's not functioning,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 2.14,
+ "finishTime": 3.96,
+ "dialogue": {
+ "text": "the operating system won't load, will it?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "opacity": 0,
+ "startTime": 4.46
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9e4bd49de00e92692c94.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9e4bd49de00e92692c94.md
new file mode 100644
index 0000000000..71ff651f93
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9e4bd49de00e92692c94.md
@@ -0,0 +1,99 @@
+---
+id: 677f9e4bd49de00e92692c94
+title: Task 24
+challengeType: 22
+dashedName: task-24
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`If it's not functioning, the BLANK BLANK won't load, will it?`
+
+## --blanks--
+
+`operating`
+
+### --feedback--
+
+This word describes the system that operates or runs the computer's basic functions.
+
+---
+
+`system`
+
+### --feedback--
+
+This word refers to the organized software structure.
+
+# --explanation--
+
+An `operating system` is the main software that allows other programs to run on a computer. It manages the hardware and software resources, ensuring everything works together smoothly. For example:
+
+- `The app is compatible with any operating system.` - The app works on all types of systems like Windows or MacOS.
+
+- `I installed a new operating system on my laptop.` - You set up a different system to run your computer.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Sarah",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 26.4,
+ "finishTimestamp": 29.36
+ }
+ },
+ "commands": [
+ {
+ "character": "Sarah",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Sarah",
+ "startTime": 1,
+ "finishTime": 1.94,
+ "dialogue": {
+ "text": "If it's not functioning,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 2.14,
+ "finishTime": 3.96,
+ "dialogue": {
+ "text": "the operating system won't load, will it?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "opacity": 0,
+ "startTime": 4.46
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9e9e5478850ed27b060a.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9e9e5478850ed27b060a.md
new file mode 100644
index 0000000000..4ebd8a0b58
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9e9e5478850ed27b060a.md
@@ -0,0 +1,133 @@
+---
+id: 677f9e9e5478850ed27b060a
+title: Task 25
+challengeType: 19
+dashedName: task-25
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What would happen to the operating system if the hard drive is failing?
+
+## --answers--
+
+The operating system would function normally.
+
+### --feedback--
+
+Sarah explains that the operating system won't start if the hard drive is not functioning.
+
+---
+
+The operating system would be deleted.
+
+### --feedback--
+
+Sarah mentions that the system won't load, not that it would be deleted.
+
+---
+
+The operating system would not load.
+
+---
+
+The operating system would restart continuously.
+
+### --feedback--
+
+The issue described is that the operating system won't load at all, not that it keeps restarting.
+
+## --video-solution--
+
+3
+
+# --explanation--
+
+The verb `load` refers to the process of starting or initiating something, like software or a system. In this context, Sarah explains that if the hard drive is failing, the operating system won't start or become accessible. For example:
+
+- `The program won't load because there's an error` means the program cannot start.
+
+- `The page took a long time to load` refers to how long it takes for content to appear on a screen.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Sarah",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 22.78,
+ "finishTimestamp": 29.36
+ }
+ },
+ "commands": [
+ {
+ "character": "Sarah",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Sarah",
+ "startTime": 1,
+ "finishTime": 1.9,
+ "dialogue": {
+ "text": "Speaking of which,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 2.1,
+ "finishTime": 4.3,
+ "dialogue": {
+ "text": "another thing we can check is if the hard drive is failing.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 4.62,
+ "finishTime": 5.56,
+ "dialogue": {
+ "text": "If it's not functioning,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 5.76,
+ "finishTime": 7.58,
+ "dialogue": {
+ "text": "the operating system won't load, will it?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "opacity": 0,
+ "startTime": 8.08
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9eee05eb8a0f34c3ba47.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9eee05eb8a0f34c3ba47.md
new file mode 100644
index 0000000000..5a05fbec29
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9eee05eb8a0f34c3ba47.md
@@ -0,0 +1,97 @@
+---
+id: 677f9eee05eb8a0f34c3ba47
+title: Task 26
+challengeType: 19
+dashedName: task-26
+---
+
+
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+How should Mark **confirm** Sarah's statement?
+
+## --answers--
+
+`I'm not sure.`
+
+### --feedback--
+
+Not quite. Mark is certain about his response, showing agreement with Sarah.
+
+---
+
+`Right, it won't.`
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+To confirm or approve information, phrases like `Right, it won't` are commonly used. This shows agreement or acknowledgment of what was said.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Sarah",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 26.4,
+ "finishTimestamp": 29.36
+ }
+ },
+ "commands": [
+ {
+ "character": "Sarah",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Sarah",
+ "startTime": 1,
+ "finishTime": 1.94,
+ "dialogue": {
+ "text": "If it's not functioning,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "startTime": 2.14,
+ "finishTime": 3.96,
+ "dialogue": {
+ "text": "the operating system won't load, will it?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "opacity": 0,
+ "startTime": 4.46
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9f301c904f0f8a145655.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9f301c904f0f8a145655.md
new file mode 100644
index 0000000000..ef38eb94f2
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9f301c904f0f8a145655.md
@@ -0,0 +1,100 @@
+---
+id: 677f9f301c904f0f8a145655
+title: Task 27
+challengeType: 22
+dashedName: task-27
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`Right, it won't. And if there's a BLANK, it can be because of incompatible drivers or outdated software.`
+
+## --blanks--
+
+`software crash`
+
+### --feedback--
+
+These two words together refer to a situation where a program or application stops working unexpectedly. The first word refers to computer programs, and the second describes an abrupt failure.
+
+# --explanation--
+
+A `software crash` happens when a program stops working suddenly, often due to bugs, errors, or incompatibilities. For example:
+
+- `A bug in the code led to the software crash.` - An error in the program caused it to stop functioning.
+
+- `We need to fix the issue that caused the software crash.` - We have to solve the problem that made the program stop working.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 29.36,
+ "finishTimestamp": 36.5
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 2.48,
+ "dialogue": {
+ "text": "Right, it won't.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 2.64,
+ "finishTime": 4,
+ "dialogue": {
+ "text": "And if there's a software crash,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 4.48,
+ "finishTime": 8.14,
+ "dialogue": {
+ "text": "it can be because of incompatible drivers or outdated software.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 8.64
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9f72f14a710fc809c44a.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9f72f14a710fc809c44a.md
new file mode 100644
index 0000000000..7b24481bf6
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9f72f14a710fc809c44a.md
@@ -0,0 +1,127 @@
+---
+id: 677f9f72f14a710fc809c44a
+title: Task 29
+challengeType: 19
+dashedName: task-29
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+According to Mark, what can be the reason of a software crash?
+
+## --answers--
+
+The computer's memory is full.
+
+### --feedback--
+
+Mark doesn't mention the memory as the cause of the crash.
+
+---
+
+The computer has no internet connection.
+
+### --feedback--
+
+Mark is talking about software issues, not internet connection problems.
+
+---
+
+The software is too new.
+
+### --feedback--
+
+Mark mentions outdated software, not newer software, as a potential issue.
+
+---
+
+Incompatible drivers or outdated software.
+
+## --video-solution--
+
+4
+
+# --explanation--
+
+Mark mentions `incompatible drivers` and `outdated software` as causes for a software crash.
+
+`Incompatible drivers` are drivers that do not work correctly with the hardware, while `outdated software` means the software has not been updated to its latest version. Both can cause crashes. For example:
+
+- `The graphics card isn't working because of incompatible drivers.` - The wrong driver is causing the graphics card to malfunction.
+
+- `Outdated software can lead to security vulnerabilities.` - Old programs might not be safe to use due to a lack of updates.
+
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 29.36,
+ "finishTimestamp": 36.5
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 2.48,
+ "dialogue": {
+ "text": "Right, it won't.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 2.64,
+ "finishTime": 4,
+ "dialogue": {
+ "text": "And if there's a software crash,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 4.48,
+ "finishTime": 8.14,
+ "dialogue": {
+ "text": "it can be because of incompatible drivers or outdated software.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 8.64
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9fa9ef07411013cd1554.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9fa9ef07411013cd1554.md
new file mode 100644
index 0000000000..76831f6009
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677f9fa9ef07411013cd1554.md
@@ -0,0 +1,95 @@
+---
+id: 677f9fa9ef07411013cd1554
+title: Task 28
+challengeType: 22
+dashedName: task-28
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`And if there's a software crash, it BLANK because of incompatible drivers or outdated software.`
+
+## --blanks--
+
+`can be`
+
+### --feedback--
+
+Think about how to express that something is possible. The first word suggests ability, and the second connects it to a condition or result.
+
+# --explanation--
+
+This sentence uses the `First Conditional` to describe a cause-and-effect relationship.
+
+The phrase `if there's a software crash` describes the condition. The result, `it can be because of incompatible drivers or outdated software`, suggests a possible explanation for the crash.
+
+Main clauses in conditionals often use modal verbs, like `can`, `could`, `may`, `should`, etc. For example:
+
+- `If the system overheats, it can shut down automatically.` - Overheating always has the possibility of causing the system to turn off.
+
+- `If users don't follow instructions, errors can occur.` - Not following guidelines always creates the possibility of errors.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 30.9,
+ "finishTimestamp": 36.5
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 2.46,
+ "dialogue": {
+ "text": "And if there's a software crash,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 2.94,
+ "finishTime": 6.6,
+ "dialogue": {
+ "text": "it can be because of incompatible drivers or outdated software.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 7.1
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa04029767410649850c3.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa04029767410649850c3.md
new file mode 100644
index 0000000000..c756a09ca9
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa04029767410649850c3.md
@@ -0,0 +1,106 @@
+---
+id: 677fa04029767410649850c3
+title: Task 30
+challengeType: 19
+dashedName: task-30
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What does Mark want to know?
+
+## --answers--
+
+If the computer is working fine.
+
+### --feedback--
+
+Mark's question isn't about the computer's general functioning.
+
+---
+
+If the drivers have been updated recently.
+
+---
+
+If the software is installed correctly.
+
+### --feedback--
+
+The focus is on drivers, not the software installation.
+
+---
+
+If the system is up to date.
+
+### --feedback--
+
+Mark is specifically asking about drivers, not the whole system's status.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+Listen carefully to Mark's question: `Have you updated the drivers recently?` Identify the key words in the question:
+
+`Updated` tells you that Mark is asking about something that was done in the past (recently).
+
+`Drivers` is the most important part. Mark is specifically asking about drivers, not software or the system.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 36.9,
+ "finishTimestamp": 39.04
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 3.14,
+ "dialogue": {
+ "text": "Have you updated the drivers recently?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 3.64
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa099289c8f10bf926f09.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa099289c8f10bf926f09.md
new file mode 100644
index 0000000000..ddca3daf0b
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa099289c8f10bf926f09.md
@@ -0,0 +1,88 @@
+---
+id: 677fa099289c8f10bf926f09
+title: Task 31
+challengeType: 19
+dashedName: task-31
+---
+
+
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+How should Sarah respond if she **hasn't updated** the drivers recently?
+
+## --answers--
+
+`Not yet.`
+
+---
+
+`I already did.`
+
+### --feedback--
+
+This would mean the drivers have already been updated, which doesn't match the situation.
+
+## --video-solution--
+
+1
+
+# --explanation--
+
+`Not yet` is a common way to express that an action hasn't been done but might happen in the future. It's polite and leaves the option open.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 36.9,
+ "finishTimestamp": 39.04
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 3.14,
+ "dialogue": {
+ "text": "Have you updated the drivers recently?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 3.64
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa6108ccfa512294d65f9.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa6108ccfa512294d65f9.md
new file mode 100644
index 0000000000..89a547be08
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa6108ccfa512294d65f9.md
@@ -0,0 +1,132 @@
+---
+id: 677fa6108ccfa512294d65f9
+title: Task 32
+challengeType: 19
+dashedName: task-32
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What does Sarah plan to do?
+
+## --answers--
+
+Fix a hardware issue next week.
+
+### --feedback--
+
+Sarah does not mention working on hardware.
+
+---
+
+Update the drivers this week.
+
+---
+
+Reinstall the operating system this week.
+
+### --feedback--
+
+Sarah does not mention reinstalling the operating system.
+
+---
+
+Check for new software next week.
+
+### --feedback--
+
+Sarah is not talking about checking for new software.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+Sarah says, `I was thinking about updating them this week`.
+
+This shows that Sarah is planning to update the drivers during the week. The key here is the phrase `updating them`, which refers to drivers, and `this week` which indicates when she is planning to do that.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ },
+ {
+ "character": "Sarah",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 36.9,
+ "finishTimestamp": 41.74
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 2.74,
+ "dialogue": {
+ "text": "Have you updated the drivers recently?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 3
+ },
+ {
+ "character": "Sarah",
+ "opacity": 1,
+ "startTime": 3
+ },
+ {
+ "character": "Sarah",
+ "startTime": 3.26,
+ "finishTime": 5.84,
+ "dialogue": {
+ "text": "Not yet. I was thinking about updating them this week.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "opacity": 0,
+ "startTime": 6.34
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa65b8e588b12735be5f2.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa65b8e588b12735be5f2.md
new file mode 100644
index 0000000000..18c616e2eb
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa65b8e588b12735be5f2.md
@@ -0,0 +1,104 @@
+---
+id: 677fa65b8e588b12735be5f2
+title: Task 33
+challengeType: 19
+dashedName: task-33
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What is Sarah curious about regarding software issues?
+
+## --answers--
+
+How to update the drivers.
+
+### --feedback--
+
+Sarah does not ask about updating drivers.
+
+---
+
+Whether the software is outdated.
+
+### --feedback--
+
+While outdated software can cause crashes, Sarah does not specifically ask about this.
+
+---
+
+Other possible reasons for software crashes.
+
+---
+
+If Mark can fix the problem other software chashes.
+
+### --feedback--
+
+Sarah is not requesting Mark to fix anything.
+
+## --video-solution--
+
+3
+
+# --explanation--
+
+Sarah says, `What else could cause software to crash?`
+
+Sarah uses the word `else`, which indicates she's already thinking about some possible causes but wants to know about additional factors that might contribute to the problem.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Sarah",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 41.74,
+ "finishTimestamp": 43.7
+ }
+ },
+ "commands": [
+ {
+ "character": "Sarah",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Sarah",
+ "startTime": 1,
+ "finishTime": 2.96,
+ "dialogue": {
+ "text": "What else could cause software to crash?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "opacity": 0,
+ "startTime": 3.46
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa6a5d3741512bcd56293.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa6a5d3741512bcd56293.md
new file mode 100644
index 0000000000..7766b57001
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa6a5d3741512bcd56293.md
@@ -0,0 +1,96 @@
+---
+id: 677fa6a5d3741512bcd56293
+title: Task 34
+challengeType: 22
+dashedName: task-34
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`If the BLANK BLANK memory leaks, it can lead to crashes.`
+
+## --blanks--
+
+`application`
+
+### --feedback--
+
+This refers to a software program running on a computer. It is the subject of the sentence.
+
+---
+
+`has`
+
+### --feedback--
+
+This verb is in the `Present Simple` and describes the existence of memory leaks.
+
+# --explanation--
+
+The `Present Simple` tense is often used to describe states or facts that are always true or currently valid.
+
+In this sentence, `has` indicates a condition of the application — it currently possesses memory leaks. It is not describing an action but a state of existence. For example:
+
+- `The software has bugs.` - The software is in a state of having bugs.
+
+- `The application has memory leaks.` - The application is currently in a state where memory leaks exist.
+
+An `application` is a software program designed to perform specific tasks or functions on a device. For example:
+
+`I downloaded the application to manage my tasks.` - You installed the app on your device to organize your to-do list.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 43.9,
+ "finishTimestamp": 47.12
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 4.22,
+ "dialogue": {
+ "text": "If the application has memory leaks, it can lead to crashes.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 4.72
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa6e7b1f9bf1301b510cd.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa6e7b1f9bf1301b510cd.md
new file mode 100644
index 0000000000..a2c8459b8f
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa6e7b1f9bf1301b510cd.md
@@ -0,0 +1,110 @@
+---
+id: 677fa6e7b1f9bf1301b510cd
+title: Task 35
+challengeType: 19
+dashedName: task-35
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What happens if the application has memory leaks?
+
+## --answers--
+
+It can cause crashes.
+
+---
+
+It will always run smoothly.
+
+### --feedback--
+
+Memory leaks are described as a cause of crashes, not smooth operation.
+
+---
+
+It can fix itself over time.
+
+### --feedback--
+
+There is no indication in the sentence that the application can resolve the issue on its own.
+
+---
+
+It prevents crashes from happening.
+
+### --feedback--
+
+The conditional explains that memory leaks can cause crashes, not prevent them.
+
+## --video-solution--
+
+1
+
+# --explanation--
+
+This is a `First Conditional` sentence. It describes a real or possible situation:
+
+Condition: `If the application has memory leaks`.
+
+Result: `It can lead to crashes`.
+
+`Can` expresses a possibility, showing that crashes are likely but not guaranteed if memory leaks exist. For example:
+
+`If you install the update, the app can run faster.` - Installing the update will make the app work more efficiently.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 43.9,
+ "finishTimestamp": 47.12
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 4.22,
+ "dialogue": {
+ "text": "If the application has memory leaks, it can lead to crashes.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 4.72
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa72c7c16cf135356bb5b.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa72c7c16cf135356bb5b.md
new file mode 100644
index 0000000000..8e789a49ec
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa72c7c16cf135356bb5b.md
@@ -0,0 +1,108 @@
+---
+id: 677fa72c7c16cf135356bb5b
+title: Task 36
+challengeType: 19
+dashedName: task-36
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What can lead to crashes?
+
+## --answers--
+
+Lack of system updates
+
+### --feedback--
+
+Mark does not mention system updates as the cause of crashes.
+
+---
+
+Memory leaks
+
+---
+
+High CPU usage
+
+### --feedback--
+
+Mark doesn't mention CPU usage as a cause of crashes.
+
+---
+
+Overloaded hard drive
+
+### --feedback--
+
+Mark's focus is not on the hard drive.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+Mark says, `If the application has memory leaks, it can lead to crashes`.
+
+The key term here is `memory leaks`. They occur when a program allocates memory for temporary tasks but fails to release it when the tasks are complete. For example:
+
+- `If the application uses too much memory, it could crash.` - This suggests that memory usage is the problem leading to crashes.
+
+- `Memory leaks can cause performance issues and crashes.` - This shows how memory leaks are a factor in causing crashes.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 43.9,
+ "finishTimestamp": 47.12
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 4.22,
+ "dialogue": {
+ "text": "If the application has memory leaks, it can lead to crashes.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 4.72
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa77172d9fc13a8336a30.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa77172d9fc13a8336a30.md
new file mode 100644
index 0000000000..1afc8e768d
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa77172d9fc13a8336a30.md
@@ -0,0 +1,90 @@
+---
+id: 677fa77172d9fc13a8336a30
+title: Task 37
+challengeType: 22
+dashedName: task-37
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`If you notice the system BLANK or BLANK, that's a sign.`
+
+## --blanks--
+
+`slowing down`
+
+### --feedback--
+
+This phrase refers to the system becoming less responsive or operating at a reduced speed. The first word ends in `-ing`.
+
+---
+
+`freezing`
+
+### --feedback--
+
+This word describes a situation where the system stops responding entirely. It ends in `-ing`.
+
+# --explanation--
+
+The `Present Continuous` tense is used to describe actions or states that are happening at the moment or over a period of time. For example:
+
+- `The system is slowing down` - It means it is becoming less responsive right now.
+
+- `The system is freezing` - It means it is currently unresponsive.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 47.4,
+ "finishTimestamp": 51.04
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 4.64,
+ "dialogue": {
+ "text": "If you notice the system slowing down or freezing, that's a sign.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 5.14
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa7bace7ad913e51a7c45.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa7bace7ad913e51a7c45.md
new file mode 100644
index 0000000000..070504af94
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa7bace7ad913e51a7c45.md
@@ -0,0 +1,80 @@
+---
+id: 677fa7bace7ad913e51a7c45
+title: Task 38
+challengeType: 22
+dashedName: task-38
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`If you notice the system slowing down or freezing, BLANK.`
+
+## --blanks--
+
+`that's a sign`
+
+### --feedback--
+
+This phrase has three words: a contraction, an article, and a noun. It is used to indicate or point out that something might be wrong. Think about a way to express a clue or warning in this context.
+
+# --explanation--
+
+`That's a sign` is used to point out evidence or an indication of something. In this context, it suggests that slowing down or freezing is a clue that the application might have memory leaks. Another example:
+
+`If the computer is overheating, that's a sign the fan isn't working properly.` - This phrase helps identify problems by pointing to observable symptoms.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 47.4,
+ "finishTimestamp": 51.04
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 4.64,
+ "dialogue": {
+ "text": "If you notice the system slowing down or freezing, that's a sign.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 5.14
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa7e75aa0191419f18b0c.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa7e75aa0191419f18b0c.md
new file mode 100644
index 0000000000..10e5464066
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa7e75aa0191419f18b0c.md
@@ -0,0 +1,102 @@
+---
+id: 677fa7e75aa0191419f18b0c
+title: Task 39
+challengeType: 19
+dashedName: task-39
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+How does Sarah feel about Mark's help?
+
+## --answers--
+
+She disagrees with it.
+
+### --feedback--
+
+Sarah's use of `Absolutely` and `Thanks` shows agreement and gratitude, not disagreement.
+
+---
+
+She appreciates it.
+
+---
+
+She is confused by it.
+
+### --feedback--
+
+Sarah doesn't express confusion; instead, she thanks Mark for his insights.
+
+---
+
+She finds it unhelpful.
+
+### --feedback--
+
+Sarah expresses appreciation, which indicates she found the help useful.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+Sarah's statement, `Absolutely. Thanks for the insights, Mark.`, shows she agrees with and values the help provided. Words like `Absolutely` reinforce agreement, and `Thanks` expresses gratitude.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Sarah",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 51.18,
+ "finishTimestamp": 53.34
+ }
+ },
+ "commands": [
+ {
+ "character": "Sarah",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Sarah",
+ "startTime": 1,
+ "finishTime": 3.16,
+ "dialogue": {
+ "text": "Absolutely. Thanks for the insights, Mark.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Sarah",
+ "opacity": 0,
+ "startTime": 3.66
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa8471227de1467898c0a.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa8471227de1467898c0a.md
new file mode 100644
index 0000000000..042b9a4397
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fa8471227de1467898c0a.md
@@ -0,0 +1,96 @@
+---
+id: 677fa8471227de1467898c0a
+title: Task 40
+challengeType: 22
+dashedName: task-40
+---
+
+
+
+# --description--
+
+This is a review of the entire dialogue you just studied.
+
+# --instructions--
+
+Place the following phrases in the correct spot:
+
+`power cable`, `slowing down`, `memory leaks`, `booting`, `software crash`, `operating system`, and `corrupted`.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`Sarah: Hey Mark, have you noticed that some computers aren't BLANK properly?`
+
+`Mark: Yes, I have. If the BLANK isn't connected securely, the computer won't turn on. Did you check that?`
+
+`Sarah: I did, but the problem seems to be more than just the power connection. Have you seen anything similar?`
+
+`Mark: Sometimes if the BIOS is BLANK, it prevents the computer from starting. If that's the case, it can be a bit tricky to fix.`
+
+`Sarah: Yeah, it can. Speaking of which, another thing we can check is if the hard drive is failing. If it's not functioning, the BLANK won't load, will it?`
+
+`Mark: Right, it won't. And if there's a BLANK, it can be because of incompatible drivers or outdated software. Have you updated the drivers recently?`
+
+`Sarah: Not yet. I was thinking about updating them this week. What else could cause software to crash?`
+
+`Mark: If the application has BLANK, it can lead to crashes. If you notice the system BLANK or freezing, that's a sign.`
+
+`Sarah: Absolutely. Thanks for the insights, Mark.`
+
+## --blanks--
+
+`booting`
+
+### --feedback--
+
+This word refers to the process of starting up a system.
+
+---
+
+`power cable`
+
+### --feedback--
+
+It ensures the computer is properly connected to a power source.
+
+---
+
+`corrupted`
+
+### --feedback--
+
+This term is used for something damaged or malfunctioning.
+
+---
+
+`operating system`
+
+### --feedback--
+
+This is the core software that loads when the computer starts.
+
+---
+
+`software crash`
+
+### --feedback--
+
+This phrase describes when a program stops working unexpectedly.
+
+---
+
+`memory leaks`
+
+### --feedback--
+
+It causes issues like poor performance or crashes due to unused memory not being released.
+
+---
+
+`slowing down`
+
+### --feedback--
+
+This phrase describes the computer's performance becoming sluggish.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fabe959e88415f6474313.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fabe959e88415f6474313.md
new file mode 100644
index 0000000000..a2f84796a6
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fabe959e88415f6474313.md
@@ -0,0 +1,76 @@
+---
+id: 677fabe959e88415f6474313
+title: Task 41
+challengeType: 19
+dashedName: task-41
+---
+
+
+
+# --instructions--
+
+Read the text and answer the question below.
+
+# --questions--
+
+## --text--
+
+The support team published a quick guide to troubleshooting boot issues:
+
+`Having boot issues?`
+
+`Troubleshooting computer issues can feel overwhelming, but understanding them can make the process easier. Here's a simple step-by-step checklist for diagnosing and fixing computer boot problems:`
+
+`1. Check the power connection: If the power cable isn't securely connected, the computer won't turn on.`
+
+`2. Inspect the BIOS: If the BIOS is corrupted, the system might fail to boot. You may need to reset or update it.`
+
+`3. Examine the hard drive: If the hard drive is failing, the operating system won't load. Run diagnostic tools to confirm.`
+
+`4. Update drivers: If the software crashes, it could be due to outdated or incompatible drivers. Always keep drivers updated to prevent this.`
+
+`5. Watch out for memory leaks: If the application has memory leaks, it can slow down or crash the system. Look for signs like freezing or lagging.`
+
+`Following these steps can help you identify the root cause and get things running smoothly again.`
+
+What is the purpose of the guide?
+
+## --answers--
+
+To explain how computers work.
+
+### --feedback--
+
+While the guide explains some technical details, its main purpose is to help troubleshoot boot problems.
+
+---
+
+To provide steps for troubleshooting boot problems.
+
+---
+
+To promote diagnostic tools.
+
+### --feedback--
+
+The guide mentions diagnostic tools, but it's not focused on promoting them.
+
+---
+
+To describe operating systems in detail.
+
+### --feedback--
+
+The guide doesn't go into detail about operating systems.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+The guide explicitly describes itself as a `step-by-step checklist` for troubleshooting boot problems. It highlights issues like `power connection`, `BIOS corruption`, and `memory leaks`, offering clear instructions for each.
+
+It aims to `make the process easier` for users by providing practical, actionable solutions, not technical explanations or promotional content.
+
+Focus on the part where the guide lists specific steps like checking the power cable and running diagnostic tools, showing it is designed to help users fix problems efficiently.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fac4406da40165a058179.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fac4406da40165a058179.md
new file mode 100644
index 0000000000..92971dbf4f
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fac4406da40165a058179.md
@@ -0,0 +1,76 @@
+---
+id: 677fac4406da40165a058179
+title: Task 42
+challengeType: 19
+dashedName: task-42
+---
+
+
+
+# --instructions--
+
+Read the text and answer the question below.
+
+# --questions--
+
+## --text--
+
+The support team published a quick guide to troubleshooting boot issues:
+
+`Having boot issues?`
+
+`Troubleshooting computer issues can feel overwhelming, but understanding them can make the process easier. Here's a simple step-by-step checklist for diagnosing and fixing computer boot problems:`
+
+`1. Check the power connection: If the power cable isn't securely connected, the computer won't turn on.`
+
+`2. Inspect the BIOS: If the BIOS is corrupted, the system might fail to boot. You may need to reset or update it.`
+
+`3. Examine the hard drive: If the hard drive is failing, the operating system won't load. Run diagnostic tools to confirm.`
+
+`4. Update drivers: If the software crashes, it could be due to outdated or incompatible drivers. Always keep drivers updated to prevent this.`
+
+`5. Watch out for memory leaks: If the application has memory leaks, it can slow down or crash the system. Look for signs like freezing or lagging.`
+
+`Following these steps can help you identify the root cause and get things running smoothly again.`
+
+What is the first step in troubleshooting a computer that won't turn on?
+
+## --answers--
+
+Check the power connection.
+
+---
+
+Inspect the BIOS.
+
+### --feedback--
+
+Checking the BIOS is the second step after ensuring the power connection is secure.
+
+---
+
+Run diagnostic tools.
+
+### --feedback--
+
+Diagnostic tools are mentioned for hard drives, but the first step is to check the power.
+
+---
+
+Update the drivers.
+
+### --feedback--
+
+Driver updates are suggested later for fixing software crashes, not boot issues.
+
+## --video-solution--
+
+1
+
+# --explanation--
+
+The guide starts by addressing the `power connection`, emphasizing that `if the power cable isn't securely connected, the computer won't turn on`. This foundational step is critical to rule out simple causes before proceeding to more complex diagnostics.
+
+The checklist deliberately begins here because power issues are common and easy to resolve.
+
+Focus on the part where the guide connects the symptom (`computer won't turn on`) to the solution (`check the power connection`), demonstrating the importance of starting with basic troubleshooting.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fac9a74c9b116c4ce68b3.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fac9a74c9b116c4ce68b3.md
new file mode 100644
index 0000000000..6229f234a5
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fac9a74c9b116c4ce68b3.md
@@ -0,0 +1,76 @@
+---
+id: 677fac9a74c9b116c4ce68b3
+title: Task 43
+challengeType: 19
+dashedName: task-43
+---
+
+
+
+# --instructions--
+
+Read the text and answer the question below.
+
+# --questions--
+
+## --text--
+
+The support team published a quick guide to troubleshooting boot issues:
+
+`Having boot issues?`
+
+`Troubleshooting computer issues can feel overwhelming, but understanding them can make the process easier. Here's a simple step-by-step checklist for diagnosing and fixing computer boot problems:`
+
+`1. Check the power connection: If the power cable isn't securely connected, the computer won't turn on.`
+
+`2. Inspect the BIOS: If the BIOS is corrupted, the system might fail to boot. You may need to reset or update it.`
+
+`3. Examine the hard drive: If the hard drive is failing, the operating system won't load. Run diagnostic tools to confirm.`
+
+`4. Update drivers: If the software crashes, it could be due to outdated or incompatible drivers. Always keep drivers updated to prevent this.`
+
+`5. Watch out for memory leaks: If the application has memory leaks, it can slow down or crash the system. Look for signs like freezing or lagging.`
+
+`Following these steps can help you identify the root cause and get things running smoothly again.`
+
+What should you do if you suspect the BIOS is causing issues?
+
+## --answers--
+
+Check the power cable.
+
+### --feedback--
+
+Checking the power cable is the first step and unrelated to BIOS issues.
+
+---
+
+Replace the hard drive.
+
+### --feedback--
+
+A failing hard drive is a separate issue from a corrupted BIOS.
+
+---
+
+Run diagnostic tools on the BIOS.
+
+### --feedback--
+
+The guide suggests resetting or updating the BIOS, not running diagnostic tools on it.
+
+---
+
+Reset or update the BIOS.
+
+## --video-solution--
+
+4
+
+# --explanation--
+
+The guide identifies `BIOS corruption` as a potential cause of boot failure and recommends users `reset or update it` to resolve the issue. Since the BIOS is responsible for hardware initialization, a corrupted BIOS can prevent the system from starting.
+
+This advice is practical, giving users a clear action to address a specific problem.
+
+Focus on the part where the guide links the issue (`the BIOS is corrupted`) with the solution (`you may need to reset or update`), emphasizing the BIOS's role in booting the system.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677face08ffbd71725b0add1.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677face08ffbd71725b0add1.md
new file mode 100644
index 0000000000..2a216fe6e4
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677face08ffbd71725b0add1.md
@@ -0,0 +1,74 @@
+---
+id: 677face08ffbd71725b0add1
+title: Task 44
+challengeType: 19
+dashedName: task-44
+---
+
+
+
+# --instructions--
+
+Read the text and answer the question below.
+
+# --questions--
+
+## --text--
+
+The support team published a quick guide to troubleshooting boot issues:
+
+`Having boot issues?`
+
+`Troubleshooting computer issues can feel overwhelming, but understanding them can make the process easier. Here's a simple step-by-step checklist for diagnosing and fixing computer boot problems:`
+
+`1. Check the power connection: If the power cable isn't securely connected, the computer won't turn on.`
+
+`2. Inspect the BIOS: If the BIOS is corrupted, the system might fail to boot. You may need to reset or update it.`
+
+`3. Examine the hard drive: If the hard drive is failing, the operating system won't load. Run diagnostic tools to confirm.`
+
+`4. Update drivers: If the software crashes, it could be due to outdated or incompatible drivers. Always keep drivers updated to prevent this.`
+
+`5. Watch out for memory leaks: If the application has memory leaks, it can slow down or crash the system. Look for signs like freezing or lagging.`
+
+`Following these steps can help you identify the root cause and get things running smoothly again.`
+
+What should you do if your hard drive is failing?
+
+## --answers--
+
+Update your BIOS.
+
+### --feedback--
+
+Updating the BIOS is recommended for BIOS-related issues, not hard drive failures.
+
+---
+
+Run diagnostic tools to confirm the issue.
+
+---
+
+Check the power connection.
+
+### --feedback--
+
+Power connection issues don't indicate a failing hard drive.
+
+---
+
+Look for memory leaks.
+
+### --feedback--
+
+Memory leaks are unrelated to hard drive problems and have different symptoms.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+The guide explains that `if the hard drive is failing, the operating system won't load`. It advises running `diagnostic tools` to confirm the issue. This step is essential for identifying a failing hard drive as the root cause before considering repairs or replacements.
+
+Focus on the part where the guide connects the symptom (`operating system won't load`) with the tool (`diagnostic tools`), ensuring users understand the importance of confirming the problem before taking further action.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fad49d2b623178319ccc9.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fad49d2b623178319ccc9.md
new file mode 100644
index 0000000000..77ea09aacb
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fad49d2b623178319ccc9.md
@@ -0,0 +1,74 @@
+---
+id: 677fad49d2b623178319ccc9
+title: Task 45
+challengeType: 19
+dashedName: task-45
+---
+
+
+
+# --instructions--
+
+Read the text and answer the question below.
+
+# --questions--
+
+## --text--
+
+The support team published a quick guide to troubleshooting boot issues:
+
+`Having boot issues?`
+
+`Troubleshooting computer issues can feel overwhelming, but understanding them can make the process easier. Here's a simple step-by-step checklist for diagnosing and fixing computer boot problems:`
+
+`1. Check the power connection: If the power cable isn't securely connected, the computer won't turn on.`
+
+`2. Inspect the BIOS: If the BIOS is corrupted, the system might fail to boot. You may need to reset or update it.`
+
+`3. Examine the hard drive: If the hard drive is failing, the operating system won't load. Run diagnostic tools to confirm.`
+
+`4. Update drivers: If the software crashes, it could be due to outdated or incompatible drivers. Always keep drivers updated to prevent this.`
+
+`5. Watch out for memory leaks: If the application has memory leaks, it can slow down or crash the system. Look for signs like freezing or lagging.`
+
+`Following these steps can help you identify the root cause and get things running smoothly again.`
+
+What are signs of memory leaks in a system?
+
+## --answers--
+
+The system shuts down unexpectedly.
+
+### --feedback--
+
+The guide doesn't mention shutdowns as a symptom of memory leaks.
+
+---
+
+The computer fails to boot.
+
+### --feedback--
+
+A failure to boot is associated with other issues, such as power or BIOS problems, not memory leaks.
+
+---
+
+Freezing or lagging.
+
+---
+
+The drivers are outdated.
+
+### --feedback--
+
+Outdated drivers can cause crashes but are not specifically tied to memory leaks.
+
+## --video-solution--
+
+3
+
+# --explanation--
+
+The guide notes that `memory leaks` can cause performance issues, such as `slowing down` or `freezing`. These signs are observable and help users recognize when applications fail to release unused memory.
+
+Focus on the part where the guide links specific symptoms (`freezing`, `lagging`) to the problem (`memory leaks`), giving users clear indicators to diagnose performance issues.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677faf6117b76b18c736b49c.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677faf6117b76b18c736b49c.md
new file mode 100644
index 0000000000..9545650a9e
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677faf6117b76b18c736b49c.md
@@ -0,0 +1,205 @@
+---
+id: 677faf6117b76b18c736b49c
+title: "Dialogue 2: Data Backup"
+challengeType: 21
+dashedName: dialogue-2-data-backup
+---
+
+# --description--
+
+Watch the video below to understand the context of the upcoming lessons.
+
+# --assignment--
+
+Watch the video.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Bob",
+ "position": { "x": -25, "y": 0, "z": 1 }
+ },
+ {
+ "character": "Maria",
+ "position": { "x": 125, "y": 0, "z": 1 }
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1
+ },
+ "alwaysShowDialogue": true
+ },
+ "commands": [
+ {
+ "character": "Bob",
+ "position": { "x": 25, "y": 0, "z": 1 },
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "position": { "x": 70, "y": 0, "z": 1 },
+ "startTime": 0.5
+ },
+ {
+ "character": "Bob",
+ "startTime": 1,
+ "finishTime": 4.56,
+ "dialogue": {
+ "text": "Hi Maria, have you checked our data backup procedures recently?",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Bob",
+ "startTime": 4.96,
+ "finishTime": 9,
+ "dialogue": {
+ "text": "If we don't backup regularly, we could lose important information, right?",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Maria",
+ "startTime": 9.46,
+ "finishTime": 12.58,
+ "dialogue": {
+ "text": "Yes, you're correct. If someone forgets, it could be a disaster.",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Maria",
+ "startTime": 13.02,
+ "finishTime": 14.72,
+ "dialogue": {
+ "text": "But I think we are pretty solid here.",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Maria",
+ "startTime": 15.26,
+ "finishTime": 19.2,
+ "dialogue": {
+ "text": "Brian helped us set up a reminder to backup our work daily along with some other tasks.",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Bob",
+ "startTime": 19.74,
+ "finishTime": 23.18,
+ "dialogue": {
+ "text": "Oh, I see. So you don't need to rely on your memory. That's clever.",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Maria",
+ "startTime": 23.64,
+ "finishTime": 26.36,
+ "dialogue": {
+ "text": "I agree. But why did you ask? Did you notice something wrong?",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Bob",
+ "startTime": 26.84,
+ "finishTime": 32.02,
+ "dialogue": {
+ "text": "No, not really. I was in a meeting where the stakeholders were talking about it, and I just wanted to double check.",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Bob",
+ "startTime": 32.48,
+ "finishTime": 34.92,
+ "dialogue": {
+ "text": "If we lose critical data, it could set us back weeks.",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Bob",
+ "startTime": 35.6,
+ "finishTime": 38.36,
+ "dialogue": {
+ "text": "Is there anything else we could do besides these reminders?",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Maria",
+ "startTime": 39.14,
+ "finishTime": 42.26,
+ "dialogue": {
+ "text": "Besides the daily reminders, we could also set up automatic backups.",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Maria",
+ "startTime": 42.78,
+ "finishTime": 46.22,
+ "dialogue": {
+ "text": "If we automate the process, there's less chance of human error. What do you think?",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Bob",
+ "startTime": 46.54,
+ "finishTime": 47.68,
+ "dialogue": {
+ "text": "I think that's a great idea.",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Bob",
+ "startTime": 47.9,
+ "finishTime": 52.04,
+ "dialogue": {
+ "text": "If we automate it, we don't have to worry about people forgetting. How can we set it up?",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Maria",
+ "startTime": 52.6,
+ "finishTime": 55.8,
+ "dialogue": {
+ "text": "Brian mentioned we can schedule automatic backups at the end of each day.",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Maria",
+ "startTime": 56.04,
+ "finishTime": 58,
+ "dialogue": {
+ "text": "If we do that, it should cover most of our bases.",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Maria",
+ "position": { "x": 125, "y": 0, "z": 1 },
+ "startTime": 58.5
+ },
+ {
+ "character": "Bob",
+ "position": { "x": -25, "y": 0, "z": 1 },
+ "startTime": 59
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fb005be2dc618f664f9e2.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fb005be2dc618f664f9e2.md
new file mode 100644
index 0000000000..29117a0591
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fb005be2dc618f664f9e2.md
@@ -0,0 +1,94 @@
+---
+id: 677fb005be2dc618f664f9e2
+title: Task 46
+challengeType: 22
+dashedName: task-46
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`Hi Maria, have you checked our BLANK BLANK procedures recently?`
+
+## --blanks--
+
+`data`
+
+### --feedback--
+
+This word refers to information that is stored digitally or physically.
+
+---
+
+`backup`
+
+### --feedback--
+
+This word means a copy of the original data to protect it from loss.
+
+# --explanation--
+
+`Data backup` refers to creating copies of important information to ensure it can be recovered in case of system failure, loss, or damage:
+
+- `data` is the digital information stored on devices.
+
+- `backup` is the process of copying this data for safety.
+
+Together, `data backup` is essential for protecting important files and minimizing risks in IT environments. For example:
+
+`The IT team performs a data backup every night.` - The team saves all the data daily to ensure it's secure.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Bob",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 0,
+ "finishTimestamp": 3.56
+ }
+ },
+ "commands": [
+ {
+ "character": "Bob",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Bob",
+ "startTime": 1,
+ "finishTime": 4.56,
+ "dialogue": {
+ "text": "Hi Maria, have you checked our data backup procedures recently?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "opacity": 0,
+ "startTime": 5.06
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fb20891a92f19d2c5e7a4.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fb20891a92f19d2c5e7a4.md
new file mode 100644
index 0000000000..b1d8374cb1
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fb20891a92f19d2c5e7a4.md
@@ -0,0 +1,108 @@
+---
+id: 677fb20891a92f19d2c5e7a4
+title: Task 47
+challengeType: 19
+dashedName: task-47
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What does Bob want to know?
+
+## --answers--
+
+If Maria knows how to create a data backup.
+
+### --feedback--
+
+Bob is not asking about how to create a backup. He wants to know if Maria has already checked the procedures.
+
+---
+
+If Maria can restore the lost data.
+
+### --feedback--
+
+This is not related to Bob's question. He's focused on reviewing the procedures, not restoring data.
+
+---
+
+If Maria has reviewed the data backup procedures recently.
+
+---
+
+If Maria needs help with the data backup process.
+
+### --feedback--
+
+Bob doesn't ask if Maria needs help. His question is about whether the procedures have been reviewed.
+
+## --video-solution--
+
+3
+
+# --explanation--
+
+`Have you checked?` is a question in the `Present Perfect` tense. It is used to ask if someone has done something recently or at some point before now. For example:
+
+- `Have you checked the weather forecast?` - This asks if you've looked at it recently.
+
+- `Have you checked your email?` - This means asking if you've looked at your inbox.
+
+In this dialogue, `have you checked` asks whether Maria has reviewed or verified something. It implies the action may affect the present, such as ensuring the backup procedures are up-to-date.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Bob",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 0,
+ "finishTimestamp": 3.56
+ }
+ },
+ "commands": [
+ {
+ "character": "Bob",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Bob",
+ "startTime": 1,
+ "finishTime": 4.56,
+ "dialogue": {
+ "text": "Hi Maria, have you checked our data backup procedures recently?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "opacity": 0,
+ "startTime": 5.06
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fb3e018bb121af7f62359.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fb3e018bb121af7f62359.md
new file mode 100644
index 0000000000..ab828699ac
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fb3e018bb121af7f62359.md
@@ -0,0 +1,56 @@
+---
+id: 677fb3e018bb121af7f62359
+title: Task 48
+challengeType: 19
+dashedName: task-48
+---
+
+# --instructions--
+
+This task doesn't have audio. Read the question below and select the correct answer.
+
+# --questions--
+
+## --text--
+
+Which sentence is grammatically correct?
+
+## --answers--
+
+`If we don't backed up regularly, we could lose important information, right?`
+
+### --feedback--
+
+This is incorrect because `don't backed up` is not a valid verb form.
+
+---
+
+`If we don't back up regularly, we could lose important information, right?`
+
+---
+
+`If we didn't back up regularly, we could lose important information, right?`
+
+### --feedback--
+
+This is grammatically correct but expresses a different meaning. It's a `Second Conditional` and refers to a hypothetical situation, while Bob is talking about a real possibility.
+
+---
+
+`If we don't back up regularly, we can lost important information, right?`
+
+### --feedback--
+
+This is incorrect because `can lost` is not a valid verb phrase.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+The `First Conditional` is used to describe real and possible situations in the future. It is formed with `if` + `Present Simple` (for the condition) and `will` + base verb (for the result). For example:
+
+`If you debug the code, the app will run smoothly.` - Fixing the code will result in the app working properly.
+
+In the correct sentence, the condition is `If we don't back up regularly`, and the result is `we could lose important information`. This suggests a real possibility.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fb67a87c2551cd6f93933.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fb67a87c2551cd6f93933.md
new file mode 100644
index 0000000000..b537554eb7
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fb67a87c2551cd6f93933.md
@@ -0,0 +1,92 @@
+---
+id: 677fb67a87c2551cd6f93933
+title: Task 49
+challengeType: 22
+dashedName: task-49
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`If we BLANK back up regularly, we BLANK lose important information, right?`
+
+## --blanks--
+
+`don't`
+
+### --feedback--
+
+This is the contraction for `do not`, used to make the sentence negative. It refers to something the team fails to do.
+
+---
+
+`could`
+
+### --feedback--
+
+This modal verb indicates a possibility or potential outcome in the future.
+
+# --explanation--
+
+In this sentence:
+
+- `Don't` is used to form the negative in the `Present Simple`, expressing something that is not done.
+
+- `Could` is a modal verb used to describe a possible outcome or result.
+
+This sentence uses the `First Conditional` structure: `if` + `Present Simple` with `could` + base verb. It expresses a possible consequence of not backing up regularly.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Bob",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 3.96,
+ "finishTimestamp": 8
+ }
+ },
+ "commands": [
+ {
+ "character": "Bob",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Bob",
+ "startTime": 1,
+ "finishTime": 5.04,
+ "dialogue": {
+ "text": "If we don't backup regularly, we could lose important information, right?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "opacity": 0,
+ "startTime": 5.54
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fb90a1fd8951df9eb7761.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fb90a1fd8951df9eb7761.md
new file mode 100644
index 0000000000..0852e6edd1
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fb90a1fd8951df9eb7761.md
@@ -0,0 +1,85 @@
+---
+id: 677fb90a1fd8951df9eb7761
+title: Task 50
+challengeType: 22
+dashedName: task-50
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`If we don't back up BLANK, we could lose important information, right?`
+
+## --blanks--
+
+`regularly`
+
+### --feedback--
+
+This word means doing something consistently or at set intervals, like every day or every week.
+
+# --explanation--
+
+`Regularly` is an adverb used to describe an action done at consistent or repeated intervals. It is often associated with habits or routines. For example:
+
+- `I exercise regularly.` - This means exercising consistently, perhaps every day or a few times a week.
+
+- `She checks her email regularly.` - This means she checks her email often, such as daily.
+
+Doing something regularly ensures good habits and prevents issues, as in backing up data to avoid loss.
+
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Bob",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 3.96,
+ "finishTimestamp": 8
+ }
+ },
+ "commands": [
+ {
+ "character": "Bob",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Bob",
+ "startTime": 1,
+ "finishTime": 5.04,
+ "dialogue": {
+ "text": "If we don't backup regularly, we could lose important information, right?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "opacity": 0,
+ "startTime": 5.54
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fba35d6f3031e9859dbff.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fba35d6f3031e9859dbff.md
new file mode 100644
index 0000000000..9eb33d0fc1
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fba35d6f3031e9859dbff.md
@@ -0,0 +1,108 @@
+---
+id: 677fba35d6f3031e9859dbff
+title: Task 51
+challengeType: 19
+dashedName: task-51
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+Why is Bob using `right` at the end of the sentence?
+
+## --answers--
+
+He is using it to confirm agreement or understanding.
+
+---
+
+He is using it to describe something correct.
+
+### --feedback--
+
+`Right` here is not describing something as correct. Think about how it is used at the end of a question.
+
+---
+
+He is using it to give directions.
+
+### --feedback--
+
+`Right` can mean a direction, like left or right, but that's not how Bob is using it here.
+
+---
+
+He is using it to indicate an action must be done immediately.
+
+### --feedback--
+
+`Right` is not asking for urgency. Listen again to how Bob uses it at the end of his sentence.
+
+## --video-solution--
+
+1
+
+# --explanation--
+
+`Right` at the end of a sentence is a question tag. It's used to confirm agreement or check if the listener understands. For example:
+
+- `It's going to rain today, right?` - The speaker is asking for confirmation about the weather.
+
+- `You finished the project, right?` - The speaker is checking if the listener completed the task.
+
+In this dialogue, Bob is asking Maria to confirm or agree with his statement.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Bob",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 3.96,
+ "finishTimestamp": 8
+ }
+ },
+ "commands": [
+ {
+ "character": "Bob",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Bob",
+ "startTime": 1,
+ "finishTime": 5.04,
+ "dialogue": {
+ "text": "If we don't backup regularly, we could lose important information, right?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "opacity": 0,
+ "startTime": 5.54
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fbb832baa361f969be478.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fbb832baa361f969be478.md
new file mode 100644
index 0000000000..8061748bf3
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fbb832baa361f969be478.md
@@ -0,0 +1,94 @@
+---
+id: 677fbb832baa361f969be478
+title: Task 52
+challengeType: 19
+dashedName: task-52
+---
+
+
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What is the best way to answer Bob?
+
+## --answers--
+
+`Yes, I already backed it up.`
+
+### --feedback--
+
+This is unrelated to confirming Bob's statement about the importance of regular backups.
+
+---
+
+`Yes, you're correct.`
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+When someone ends a question with `right`, they are seeking agreement or confirmation. This is common in everyday conversations to check if the other person agrees or understands.
+
+If you want to confirm someone's statements you can use phrases like:
+
+- `Yes, you're correct.`
+
+- `That's true.`
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Bob",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 3.96,
+ "finishTimestamp": 8
+ }
+ },
+ "commands": [
+ {
+ "character": "Bob",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Bob",
+ "startTime": 1,
+ "finishTime": 5.04,
+ "dialogue": {
+ "text": "If we don't backup regularly, we could lose important information, right?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "opacity": 0,
+ "startTime": 5.54
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fbd0d62536020653318c9.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fbd0d62536020653318c9.md
new file mode 100644
index 0000000000..9f0d52ece1
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fbd0d62536020653318c9.md
@@ -0,0 +1,99 @@
+---
+id: 677fbd0d62536020653318c9
+title: Task 53
+challengeType: 22
+dashedName: task-53
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`Yes, you're correct. If someone BLANK, it BLANK a disaster.`
+
+## --blanks--
+
+`forgets`
+
+### --feedback--
+
+This verb is in the `Present Simple` and describes an action where someone fails to remember something.
+
+---
+
+`could be`
+
+### --feedback--
+
+These two words indicate a possibility, meaning something might happen. The first is a modal verb and the second is the main verb.
+
+# --explanation--
+
+This sentence demonstrates a `First Conditional`, used for real or possible situations in the future:
+
+- `Forgets` is in the `Present Simple`, showing the condition.
+
+- `Could be` indicates a possible result or consequence.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Maria",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.5
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 8.46,
+ "finishTimestamp": 11.78
+ }
+ },
+ "commands": [
+ {
+ "character": "Maria",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "startTime": 1,
+ "finishTime": 1.96,
+ "dialogue": {
+ "text": "Yes, you're correct.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "startTime": 2.18,
+ "finishTime": 4.32,
+ "dialogue": {
+ "text": "If someone forgets, it could be a disaster.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "opacity": 0,
+ "startTime": 4.82
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fdf7b6032a62399fd1adc.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fdf7b6032a62399fd1adc.md
new file mode 100644
index 0000000000..27eaa359ea
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fdf7b6032a62399fd1adc.md
@@ -0,0 +1,117 @@
+---
+id: 677fdf7b6032a62399fd1adc
+title: Task 54
+challengeType: 19
+dashedName: task-54
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What would happen if someone forgot to back up?
+
+## --answers--
+
+It would be fine.
+
+### --feedback--
+
+Maria doesn't describe the potential result as something acceptable.
+
+---
+
+It could be a small issue.
+
+### --feedback--
+
+Maria talks about a serious problem, not a small issue.
+
+---
+
+It would cause some delays.
+
+### --feedback--
+
+Maria doesn't talk about delays. She warns about a serious outcome.
+
+---
+
+It could be a disaster.
+
+## --video-solution--
+
+4
+
+# --explanation--
+
+`Disaster` refers to a very bad event or serious problem. For example:
+
+- `The outdated software created a security disaster for the company.` - Old software led to major security issues for the organization.
+
+- `Ignoring regular maintenance can turn small problems into a disaster.` - Skipping maintenance may escalate minor issues into serious ones.
+
+In this dialogue, it means that forgetting to back up **could** cause significant trouble, such as losing critical data.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Maria",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.5
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 8.46,
+ "finishTimestamp": 11.78
+ }
+ },
+ "commands": [
+ {
+ "character": "Maria",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "startTime": 1,
+ "finishTime": 1.96,
+ "dialogue": {
+ "text": "Yes, you're correct.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "startTime": 2.18,
+ "finishTime": 4.32,
+ "dialogue": {
+ "text": "If someone forgets, it could be a disaster.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "opacity": 0,
+ "startTime": 4.82
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fe14e4f849324a45d5699.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fe14e4f849324a45d5699.md
new file mode 100644
index 0000000000..9fc34def1f
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fe14e4f849324a45d5699.md
@@ -0,0 +1,108 @@
+---
+id: 677fe14e4f849324a45d5699
+title: Task 55
+challengeType: 19
+dashedName: task-55
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What is Maria communicating?
+
+## --answers--
+
+She thinks the system is broken.
+
+### --feedback--
+
+`Solid` means something dependable, not broken.
+
+---
+
+She thinks the system is incomplete.
+
+### --feedback--
+
+In this context `solid` suggests stability, not something unfinished.
+
+---
+
+She thinks the system is strong and reliable.
+
+---
+
+She thinks the system is slow.
+
+### --feedback--
+
+`Solid` doesn't describe speed but shows that something is dependable.
+
+## --video-solution--
+
+3
+
+# --explanation--
+
+The word `solid` means strong, reliable, or stable. For example:
+
+- `The plan is solid.` - The plan is well-prepared and reliable.
+
+- `If your backup system is solid, you don't have to worry about losing data.` - This means the backup system is reliable and trustworthy.
+
+Maria is saying the system is dependable and in good condition. She feels confident about its performance.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Maria",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.5
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 12.02,
+ "finishTimestamp": 13.72
+ }
+ },
+ "commands": [
+ {
+ "character": "Maria",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "startTime": 1,
+ "finishTime": 2.7,
+ "dialogue": {
+ "text": "But I think we are pretty solid here.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "opacity": 0,
+ "startTime": 3.2
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fe3d1994371259f42548b.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fe3d1994371259f42548b.md
new file mode 100644
index 0000000000..627092221e
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fe3d1994371259f42548b.md
@@ -0,0 +1,84 @@
+---
+id: 677fe3d1994371259f42548b
+title: Task 57
+challengeType: 22
+dashedName: task-57
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`Brian helped us set up BLANK to back up our work daily along with some other tasks.`
+
+## --blanks--
+
+`a reminder`
+
+### --feedback--
+
+This phrase means something that helps you remember to do something, like a notification or note. Use an article and a noun.
+
+# --explanation--
+
+`Reminder` refers to something that prompts you not to forget a task or event. For example:
+
+- `I set a reminder on my phone to drink water every hour.` - The reminder helps ensure you stay hydrated.
+
+- `She left a reminder on the fridge to call the client.` - The note is meant to help her remember the task.
+
+In this context, Brian set up a reminder to back up work daily, ensuring that no one forgets this important task.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Maria",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.5
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 13.96,
+ "finishTimestamp": 18.3
+ }
+ },
+ "commands": [
+ {
+ "character": "Maria",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "startTime": 1,
+ "finishTime": 5.34,
+ "dialogue": {
+ "text": "Brian helped us set up a reminder to backup our work daily along with some other tasks.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "opacity": 0,
+ "startTime": 5.84
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fe67ccc6a2726782e274d.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fe67ccc6a2726782e274d.md
new file mode 100644
index 0000000000..8cb3cdbe05
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fe67ccc6a2726782e274d.md
@@ -0,0 +1,112 @@
+---
+id: 677fe67ccc6a2726782e274d
+title: Task 61
+challengeType: 19
+dashedName: task-61
+---
+
+
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What option agrees with Maria?
+
+## --answers--
+
+`I don't think it's solid.`
+
+### --feedback--
+
+This response disagrees, but the speaker confidently stated that the system is reliable.
+
+---
+
+`Oh, I see.`
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+`Oh, I see` shows understanding and agreement with what the speaker explained. It's a polite and neutral way to acknowledge their explanation. Examples of similar responses:
+
+- `Got it.` - Expressing understanding.
+
+- `That makes sense.` - Agreeing with and acknowledging the explanation.
+
+Using such responses helps continue a conversation while showing active listening.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Maria",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.5
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 9.64,
+ "finishTimestamp": 18.2
+ }
+ },
+ "commands": [
+ {
+ "character": "Maria",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "startTime": 1,
+ "finishTime": 2.94,
+ "dialogue": {
+ "text": "If someone forgets, it could be a disaster.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "startTime": 3.38,
+ "finishTime": 5.08,
+ "dialogue": {
+ "text": "But I think we are pretty solid here.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "startTime": 5.62,
+ "finishTime": 9.56,
+ "dialogue": {
+ "text": "Brian helped us set up a reminder to backup our work daily along with some other tasks.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "opacity": 0,
+ "startTime": 10.06
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fe7df617f30274e99a680.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fe7df617f30274e99a680.md
new file mode 100644
index 0000000000..b35ff4d7dd
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fe7df617f30274e99a680.md
@@ -0,0 +1,102 @@
+---
+id: 677fe7df617f30274e99a680
+title: Task 62
+challengeType: 22
+dashedName: task-62
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`Oh, I see. So, you don't need to BLANK your memory. That's clever.`
+
+## --blanks--
+
+`rely on`
+
+### --feedback--
+
+This phrase means to depend on something or someone for support or help.
+
+# --explanation--
+
+`Rely on` means to depend on someone or something for support, help, or trust. For example:
+
+- `I rely on my phone to wake me up in the morning.` - You depend on your phone's alarm.
+
+- `You can always rely on her advice.` - You can trust her advice because it's reliable.
+
+In the audio, Bob is saying you don't need to depend on your memory because the reminder system helps you instead.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Bob",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 18.74,
+ "finishTimestamp": 22.18
+ }
+ },
+ "commands": [
+ {
+ "character": "Bob",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Bob",
+ "startTime": 1,
+ "finishTime": 1.82,
+ "dialogue": {
+ "text": "Oh, I see.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "startTime": 1.98,
+ "finishTime": 3.58,
+ "dialogue": {
+ "text": "So you don't need to rely on your memory.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "startTime": 3.76,
+ "finishTime": 4.44,
+ "dialogue": {
+ "text": "That's clever.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "opacity": 0,
+ "startTime": 4.94
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fe8d2af2bd0280ec7b0aa.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fe8d2af2bd0280ec7b0aa.md
new file mode 100644
index 0000000000..b23b7d40b1
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677fe8d2af2bd0280ec7b0aa.md
@@ -0,0 +1,124 @@
+---
+id: 677fe8d2af2bd0280ec7b0aa
+title: Task 63
+challengeType: 19
+dashedName: task-63
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What does Bob think about not needing to rely on your memory?
+
+## --answers--
+
+He thinks it's unnecessary.
+
+### --feedback--
+
+Bob doesn't find it unnecessary.
+
+---
+
+He thinks it's clever.
+
+---
+
+He thinks it's confusing.
+
+### --feedback--
+
+Bob doesn't find the idea confusing.
+
+---
+
+He thinks it's risky.
+
+### --feedback--
+
+Bob does not suggest that relying on reminders is risky.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+In the sentence, Bob expresses admiration for using reminders instead of depending on memory. `That's clever` shows he finds it a smart and practical solution. For example:
+
+- `Using automation to save time is clever.` - It's a smart idea.
+
+- `Organizing tasks with labels is clever.` - It's an effective solution.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Bob",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 18.74,
+ "finishTimestamp": 22.18
+ }
+ },
+ "commands": [
+ {
+ "character": "Bob",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Bob",
+ "startTime": 1,
+ "finishTime": 1.82,
+ "dialogue": {
+ "text": "Oh, I see.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "startTime": 1.98,
+ "finishTime": 3.58,
+ "dialogue": {
+ "text": "So you don't need to rely on your memory.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "startTime": 3.76,
+ "finishTime": 4.44,
+ "dialogue": {
+ "text": "That's clever.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "opacity": 0,
+ "startTime": 4.94
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677feba621dd1e2924210526.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677feba621dd1e2924210526.md
new file mode 100644
index 0000000000..0cd119fc2f
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677feba621dd1e2924210526.md
@@ -0,0 +1,110 @@
+---
+id: 677feba621dd1e2924210526
+title: Task 64
+challengeType: 19
+dashedName: task-64
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What is Maria concerned about?
+
+## --answers--
+
+Why Bob asked the question and if something is wrong.
+
+---
+
+If Bob has a solution to the problem.
+
+### --feedback--
+
+Maria isn't asking about a solution, but about the reason for Bob's question and whether there's an issue.
+
+---
+
+Why Bob asked the question and if he wants her opinion on backups.
+
+### --feedback--
+
+Maria agrees with Bob but is not asking to give her opinion here.
+
+---
+
+If Bob already fixed the issue.
+
+### --feedback--
+
+Maria is asking if Bob noticed a problem, not if he fixed one.
+
+## --video-solution--
+
+1
+
+# --explanation--
+
+Maria's sentences show her agreement but also curiosity. Let's break them down:
+
+`I agree.` - Maria agrees with Bob's observation, showing she shares his opinion.
+
+`But, why did you ask?` - Maria wants to understand Bob's reason for bringing up the topic.
+
+`Did you notice something wrong?` - Maria is directly asking if Bob has observed any problems.
+
+Maria's curiosity indicates she values clear communication and wants to address any potential issues.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Maria",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.5
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 22.64,
+ "finishTimestamp": 25.46
+ }
+ },
+ "commands": [
+ {
+ "character": "Maria",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "startTime": 1,
+ "finishTime": 3.82,
+ "dialogue": {
+ "text": "I agree. But why did you ask? Did you notice something wrong?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "opacity": 0,
+ "startTime": 4.32
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677feff132d56d2a40d6c4f1.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677feff132d56d2a40d6c4f1.md
new file mode 100644
index 0000000000..67ca0cf848
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677feff132d56d2a40d6c4f1.md
@@ -0,0 +1,96 @@
+---
+id: 677feff132d56d2a40d6c4f1
+title: Task 65
+challengeType: 19
+dashedName: task-65
+---
+
+
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What is the best way to reassure Maria after hearing her concern?
+
+## --answers--
+
+`Yes, it's a big problem.`
+
+### --feedback--
+
+While this might make sense in another context, it doesn't provide reassurance.
+
+---
+
+`No. Not really.`
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+Maria asks, `Did you notice something wrong?` She's asking if there's a specific issue. The phrase `No. Not really` reassures her that there isn't anything serious to worry about. It's polite, casual, and keeps the conversation light. For example:
+
+Question: `Is something wrong with the system?`
+
+Answer: `No. Not really.` – This means there might be minor concerns, but nothing serious enough to cause alarm.
+
+Now, let's think about why the other option doesn't work:
+
+`Yes, it's a big problem.` – This suggests something serious is wrong, which doesn't reassure Maria. Instead, it might make her more concerned.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Maria",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.5
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 22.64,
+ "finishTimestamp": 25.46
+ }
+ },
+ "commands": [
+ {
+ "character": "Maria",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "startTime": 1,
+ "finishTime": 3.82,
+ "dialogue": {
+ "text": "I agree. But why did you ask? Did you notice something wrong?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "opacity": 0,
+ "startTime": 4.32
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677ff1a16e3fa72b444e7461.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677ff1a16e3fa72b444e7461.md
new file mode 100644
index 0000000000..3341c3df20
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677ff1a16e3fa72b444e7461.md
@@ -0,0 +1,123 @@
+---
+id: 677ff1a16e3fa72b444e7461
+title: Task 67
+challengeType: 19
+dashedName: task-67
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+Why did Bob want to double-check?
+
+## --answers--
+
+Because he found a problem with the backup process.
+
+### --feedback--
+
+Bob doesn't mention finding a problem, just that he heard it discussed in a meeting.
+
+---
+
+Because he didn't understand what the stakeholders meant.
+
+### --feedback--
+
+Bob doesn't say he didn't understand; he just wanted to confirm.
+
+---
+
+Because the stakeholders were talking about it in a meeting.
+
+---
+
+Because Maria asked him about the backup process.
+
+### --feedback--
+
+Bob initiated the conversation because of the stakeholders, not because Maria asked him.
+
+## --video-solution--
+
+3
+
+# --explanation--
+
+Bob's motivation to double-check comes from the meeting he attended.
+
+He says, `I was in a meeting where the stakeholders were talking about it`, meaning he heard the stakeholders discussing the topic and wanted to confirm.
+
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Bob",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 25.84,
+ "finishTimestamp": 31.02
+ }
+ },
+ "commands": [
+ {
+ "character": "Bob",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Bob",
+ "startTime": 1,
+ "finishTime": 2.06,
+ "dialogue": {
+ "text": "No, not really.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "startTime": 2.18,
+ "finishTime": 4.94,
+ "dialogue": {
+ "text": "I was in a meeting where the stakeholders were talking about it,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "startTime": 4.94,
+ "finishTime": 6.18,
+ "dialogue": {
+ "text": "and I just wanted to double check.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "opacity": 0,
+ "startTime": 6.68
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677ff5788ac0ab2c3590249d.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677ff5788ac0ab2c3590249d.md
new file mode 100644
index 0000000000..992f5b26e2
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/677ff5788ac0ab2c3590249d.md
@@ -0,0 +1,100 @@
+---
+id: 677ff5788ac0ab2c3590249d
+title: Task 66
+challengeType: 22
+dashedName: task-66
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`No, not really. I was in a meeting where the BLANK were talking about it and I just wanted to double-check.`
+
+## --blanks--
+
+`stakeholders`
+
+### --feedback--
+
+This word refers to people or groups who have an interest or investment in a project, decision, or organization.
+
+# --explanation--
+
+`Stakeholders` refers to individuals or groups who are affected by or have an interest in a specific project, decision, or organization. For example:
+
+- `The stakeholders approved the new policy.` - This means those with an interest in the policy gave their approval.
+
+- `We need to update the stakeholders on our progress.` - This shows the importance of keeping them informed.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Bob",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 25.84,
+ "finishTimestamp": 31.02
+ }
+ },
+ "commands": [
+ {
+ "character": "Bob",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Bob",
+ "startTime": 1,
+ "finishTime": 2.06,
+ "dialogue": {
+ "text": "No, not really.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "startTime": 2.18,
+ "finishTime": 4.94,
+ "dialogue": {
+ "text": "I was in a meeting where the stakeholders were talking about it,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "startTime": 4.94,
+ "finishTime": 6.18,
+ "dialogue": {
+ "text": "and I just wanted to double check.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "opacity": 0,
+ "startTime": 6.68
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780cac5e13b5230d0d090d5.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780cac5e13b5230d0d090d5.md
new file mode 100644
index 0000000000..34fdb97363
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780cac5e13b5230d0d090d5.md
@@ -0,0 +1,59 @@
+---
+id: 6780cac5e13b5230d0d090d5
+title: Task 68
+challengeType: 19
+dashedName: task-68
+---
+
+# --instructions--
+
+This task doesn't have audio. Read the question below and select the correct answer.
+
+# --questions--
+
+## --text--
+
+Which sentence is grammatically correct?
+
+## --answers--
+
+`If we lose critical data, it do set us back weeks.`
+
+### --feedback--
+
+The word `do` is incorrectly used in place of `could` in this sentence.
+
+---
+
+`If we lose critical data, it could set us back weeks.`
+
+---
+
+`If we lose critical data, it could sets us back weeks.`
+
+### --feedback--
+
+The verb `sets` is not in the correct form for this sentence.
+
+---
+
+`If we losing critical data, it could set us back weeks.`
+
+### --feedback--
+
+The word `losing` is incorrectly used in place of `lose` in this sentence.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+The correct sentence uses a `First Conditional` structure, which is formed with:
+
+`if` + `Present Simple`: `If we lose critical data`.
+
+Modal verb (`could`) + base verb: `it could set us back weeks`.
+
+
+The `First Conditional` is used to describe a possible future event and its result.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780ce2579aae4325ae0bf3c.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780ce2579aae4325ae0bf3c.md
new file mode 100644
index 0000000000..04dd1f3f6f
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780ce2579aae4325ae0bf3c.md
@@ -0,0 +1,106 @@
+---
+id: 6780ce2579aae4325ae0bf3c
+title: Task 69
+challengeType: 19
+dashedName: task-69
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What does Bob mean when he says `critical data`?
+
+## --answers--
+
+Data that is easy to replace.
+
+### --feedback--
+
+Bob mentions that losing this data would set them back weeks, which shows it isn't easy to replace.
+
+---
+
+Data that is outdated.
+
+### --feedback--
+
+If the data were outdated, it wouldn't be essential or cause a setback.
+
+---
+
+Important or essential data.
+
+---
+
+Unimportant data.
+
+### --feedback--
+
+If the data were unimportant, losing it would not cause significant delays.
+
+## --video-solution--
+
+3
+
+# --explanation--
+
+`Critical` means something very important or essential, and `critical data` refers to important information that the team relies on to work effectively. Losing it would cause delays or problems. For example:
+
+- `The backup includes all critical data in case of a failure.` - The saved copy contains essential information to recover from a problem.
+
+- `You must encrypt critical data to ensure it's secure.` - Protecting important information with encryption is necessary for security.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Bob",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 31.38,
+ "finishTimestamp": 34.02
+ }
+ },
+ "commands": [
+ {
+ "character": "Bob",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Bob",
+ "startTime": 1,
+ "finishTime": 3.64,
+ "dialogue": {
+ "text": "If we lose critical data, it could set us back weeks.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "opacity": 0,
+ "startTime": 4.14
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780d10bba9c6133455f04c3.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780d10bba9c6133455f04c3.md
new file mode 100644
index 0000000000..25dc30f70b
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780d10bba9c6133455f04c3.md
@@ -0,0 +1,98 @@
+---
+id: 6780d10bba9c6133455f04c3
+title: Task 70
+challengeType: 22
+dashedName: task-70
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`If we lose critical data, it could BLANK BLANK BLANK weeks.`
+
+## --blanks--
+
+`set`
+
+### --feedback--
+
+This word means to cause something to happen or start. It's the first word of the phrase.
+
+---
+
+`us`
+
+### --feedback--
+
+This pronoun refers to the people involved, in this case, Bob and his team.
+
+---
+
+`back`
+
+### --feedback--
+
+This word means to cause a delay or to move something to a previous position.
+
+# --explanation--
+
+`Set us back` means to delay progress or cause a setback. For example:
+
+`The power outage set us back several hours.` - This means the power outage caused a delay in their work.
+
+In the audio, Bob uses `set us back` to explain that losing critical data would delay their progress by weeks.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Bob",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 31.38,
+ "finishTimestamp": 34.02
+ }
+ },
+ "commands": [
+ {
+ "character": "Bob",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Bob",
+ "startTime": 1,
+ "finishTime": 3.64,
+ "dialogue": {
+ "text": "If we lose critical data, it could set us back weeks.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "opacity": 0,
+ "startTime": 4.14
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780d4cab106dd347fc30047.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780d4cab106dd347fc30047.md
new file mode 100644
index 0000000000..75c54ed9fb
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780d4cab106dd347fc30047.md
@@ -0,0 +1,104 @@
+---
+id: 6780d4cab106dd347fc30047
+title: Task 71
+challengeType: 19
+dashedName: task-71
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What is Bob asking about?
+
+## --answers--
+
+If the reminders are effective.
+
+### --feedback--
+
+Bob is not asking about the effectiveness of the reminders but rather about alternatives.
+
+---
+
+If they should stop using reminders.
+
+### --feedback--
+
+Bob doesn't suggest stopping the reminders; he's looking for other options.
+
+---
+
+If the reminders are necessary.
+
+### --feedback--
+
+Bob isn't questioning the necessity of reminders. He's looking for more ideas beyond them.
+
+---
+
+If there are additional actions they can take.
+
+## --video-solution--
+
+4
+
+# --explanation--
+
+Bob's question, `Is there anything else we can do besides these reminders?` suggests he is looking for additional actions or alternatives to the reminders.
+
+`Anything else` indicates he is open to exploring more options, not evaluating the reminders themselves.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Bob",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 34.5,
+ "finishTimestamp": 37.56
+ }
+ },
+ "commands": [
+ {
+ "character": "Bob",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Bob",
+ "startTime": 1,
+ "finishTime": 4.06,
+ "dialogue": {
+ "text": "Is there anything else we could do besides these reminders?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "opacity": 0,
+ "startTime": 4.56
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780d70ddcbe4a352b2c896b.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780d70ddcbe4a352b2c896b.md
new file mode 100644
index 0000000000..57a1fff458
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780d70ddcbe4a352b2c896b.md
@@ -0,0 +1,102 @@
+---
+id: 6780d70ddcbe4a352b2c896b
+title: Task 72
+challengeType: 19
+dashedName: task-72
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What does Maria suggest in addition to daily reminders?
+
+## --answers--
+
+Setting up automatic backups.
+
+---
+
+Sending weekly emails.
+
+### --feedback--
+
+Maria doesn't mention sending emails.
+
+---
+
+Stopping daily reminders.
+
+### --feedback--
+
+Maria is not suggesting stopping the reminders.
+
+---
+
+Using manual backups.
+
+### --feedback--
+
+Maria mentions automatic backups, not manual backups.
+
+## --video-solution--
+
+1
+
+# --explanation--
+
+Maria suggests to `set up automatic backups` as an additional measure to daily reminders. The word `besides` indicates she is proposing this as something extra to improve their workflow or system reliability.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Maria",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.5
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 38.04,
+ "finishTimestamp": 41.56
+ }
+ },
+ "commands": [
+ {
+ "character": "Maria",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "startTime": 1,
+ "finishTime": 4.52,
+ "dialogue": {
+ "text": "Besides the daily reminders, we could also set up automatic backups.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "opacity": 0,
+ "startTime": 5.02
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780d81f2e367f35ebfc2130.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780d81f2e367f35ebfc2130.md
new file mode 100644
index 0000000000..a8cb08d5db
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780d81f2e367f35ebfc2130.md
@@ -0,0 +1,92 @@
+---
+id: 6780d81f2e367f35ebfc2130
+title: Task 73
+challengeType: 22
+dashedName: task-73
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`BLANK the process, BLANK less chance of human error.`
+
+## --blanks--
+
+`If we automate`
+
+### --feedback--
+
+These three words introduce a condition. It means making the process automatic to avoid errors. The first letter is capitalized.
+
+---
+
+`there's`
+
+### --feedback--
+
+This is a contraction for `there is`, used to state that something exists.
+
+# --explanation--
+
+This sentence uses the `Zero Conditional`, which describes general truths or situations that are always true when the condition is met. In this case:
+
+Condition: `If we automate the process`.
+
+Result: `There's less chance of human error`.
+
+`If` introduces the condition, and `there's` expresses the result of that condition.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Maria",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.5
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 41.58,
+ "finishTimestamp": 44.68
+ }
+ },
+ "commands": [
+ {
+ "character": "Maria",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "startTime": 1,
+ "finishTime": 4.1,
+ "dialogue": {
+ "text": "If we automate the process, there's less chance of human error.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "opacity": 0,
+ "startTime": 4.6
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780da8d4fe83a36edf1bee4.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780da8d4fe83a36edf1bee4.md
new file mode 100644
index 0000000000..ebe8c3c11f
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780da8d4fe83a36edf1bee4.md
@@ -0,0 +1,104 @@
+---
+id: 6780da8d4fe83a36edf1bee4
+title: Task 74
+challengeType: 19
+dashedName: task-74
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What does Maria propose to reduce human error?
+
+## --answers--
+
+Asking for more training.
+
+### --feedback--
+
+Maria does not mention training; she suggests using something else.
+
+---
+
+Automating the process.
+
+---
+
+Hiring more people.
+
+### --feedback--
+
+Maria's solution focuses on reducing human involvement, not increasing it.
+
+---
+
+Creating more reminders.
+
+### --feedback--
+
+Maria mentions automation, not increasing reminders, as the solution.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+Maria uses the word `automate` to suggest making the process automatic or handled by machines or systems instead of humans. This helps reduce the chance of human error because machines follow predefined instructions without making mistakes caused by fatigue or oversight. For example:
+
+`We can automate the process of sending email updates.` - You can use a program to automatically send emails instead of doing it manually.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Maria",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.5
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 41.58,
+ "finishTimestamp": 44.68
+ }
+ },
+ "commands": [
+ {
+ "character": "Maria",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "startTime": 1,
+ "finishTime": 4.1,
+ "dialogue": {
+ "text": "If we automate the process, there's less chance of human error.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "opacity": 0,
+ "startTime": 4.6
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780e2447b47203831df9580.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780e2447b47203831df9580.md
new file mode 100644
index 0000000000..c966c0ca40
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6780e2447b47203831df9580.md
@@ -0,0 +1,90 @@
+---
+id: 6780e2447b47203831df9580
+title: Task 75
+challengeType: 22
+dashedName: task-75
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`If we automate the process, there's less chance of BLANK BLANK.`
+
+## --blanks--
+
+`human`
+
+### --feedback--
+
+This noun refers to a person.
+
+---
+
+`error`
+
+### --feedback--
+
+It's a mistake or incorrect action that leads to unintended results.
+
+# --explanation--
+
+`Human error` refers to mistakes made by developers, such as incorrect logic, syntax errors, or overlooking edge cases, which can result in bugs or system malfunctions. For example:
+
+- `Human error is one of the most common causes of data loss.` - Mistakes made by people are a frequent reason for losing important data.
+
+- `We try to minimize human error by automating repetitive tasks.` - Automating tasks helps reduce the chances of mistakes being made.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Maria",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.5
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 41.58,
+ "finishTimestamp": 44.68
+ }
+ },
+ "commands": [
+ {
+ "character": "Maria",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "startTime": 1,
+ "finishTime": 4.1,
+ "dialogue": {
+ "text": "If we automate the process, there's less chance of human error.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "opacity": 0,
+ "startTime": 4.6
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67810e6675bb473b185339cc.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67810e6675bb473b185339cc.md
new file mode 100644
index 0000000000..b1699a4b84
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67810e6675bb473b185339cc.md
@@ -0,0 +1,112 @@
+---
+id: 67810e6675bb473b185339cc
+title: Task 76
+challengeType: 19
+dashedName: task-76
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What answer shows agreement to Maria's suggestion?
+
+## --answers--
+
+`Why should we automate the process?`
+
+### --feedback--
+
+This response asks for clarification, but Maria already explained the benefit of reducing human error.
+
+---
+
+`I think that's a great idea.`
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+Maria finishes her suggestion with the question, `What do you think?` This phrase is commonly used to invite others to share their opinion, encouraging a collaborative discussion.
+
+It shows interest in hearing someone else's perspective or confirming agreement. Other examples of this question include:
+
+- `How do you feel about that?`
+
+- `Do you agree with this approach?`
+
+- `What's your opinion on this idea?`
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Maria",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.5
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 38.04,
+ "finishTimestamp": 45.42
+ }
+ },
+ "commands": [
+ {
+ "character": "Maria",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "startTime": 1,
+ "finishTime": 4.22,
+ "dialogue": {
+ "text": "Besides the daily reminders, we could also set up automatic backups.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "startTime": 4.74,
+ "finishTime": 7.44,
+ "dialogue": {
+ "text": "If we automate the process, there's less chance of human error.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "startTime": 7.94,
+ "finishTime": 8.38,
+ "dialogue": {
+ "text": "What do you think?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "opacity": 0,
+ "startTime": 8.88
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67810fc466ce3e3bc3eaaa8d.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67810fc466ce3e3bc3eaaa8d.md
new file mode 100644
index 0000000000..1a20cffc10
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67810fc466ce3e3bc3eaaa8d.md
@@ -0,0 +1,112 @@
+---
+id: 67810fc466ce3e3bc3eaaa8d
+title: Task 77
+challengeType: 19
+dashedName: task-77
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What does Bob think about Maria's suggestion?
+
+## --answers--
+
+He doesn't think it's necessary.
+
+### --feedback--
+
+Bob supports Maria's suggestion.
+
+---
+
+He is unsure and wants more details.
+
+### --feedback--
+
+Bob expresses confidence and agreement, not uncertainty.
+
+---
+
+He thinks they should focus on reminders instead.
+
+### --feedback--
+
+Bob doesn't suggest focusing only on reminders.
+
+---
+
+He agrees and thinks it's a great idea.
+
+## --video-solution--
+
+4
+
+# --explanation--
+
+Bob uses the phrase, `I think that's a great idea`, to express his positive opinion about Maria's suggestion. This is a common way to agree with and support someone's idea.
+
+Other examples of expressing agreement or positive opinions include:
+
+- `That sounds like a good plan.`
+
+- `I completely agree with you.`
+
+- `I believe that could really help us.`
+
+These expressions show enthusiasm and collaboration, just like Bob's response to Maria.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Bob",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 45.24,
+ "finishTimestamp": 46.78
+ }
+ },
+ "commands": [
+ {
+ "character": "Bob",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Bob",
+ "startTime": 1,
+ "finishTime": 2.54,
+ "dialogue": {
+ "text": "I think that's a great idea.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "opacity": 0,
+ "startTime": 3.04
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678111b015a0413cf5ff5f91.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678111b015a0413cf5ff5f91.md
new file mode 100644
index 0000000000..fe37958b79
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678111b015a0413cf5ff5f91.md
@@ -0,0 +1,94 @@
+---
+id: 678111b015a0413cf5ff5f91
+title: Task 78
+challengeType: 22
+dashedName: task-78
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`If we BLANK it, we BLANK worry about people forgetting.`
+
+## --blanks--
+
+`automate`
+
+### --feedback--
+
+This word means to make something operate automatically. It's the action Bob is suggesting to solve the problem.
+
+---
+
+`don't have to`
+
+### --feedback--
+
+These three words indicate something is unnecessary. Bob is saying that automation removes the need to worry.
+
+# --explanation--
+
+The sentence uses a `First Conditional` structure:
+
+The condition: `If we automate it` - what needs to happen.
+
+The result: `we don't have to worry about people forgetting` - The benefit of automating.
+
+`Automate` means to use machines or systems to handle a task instead of doing it manually.
+
+`Don't have to` means something is not required or necessary.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Bob",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 46.7,
+ "finishTimestamp": 49.78
+ }
+ },
+ "commands": [
+ {
+ "character": "Bob",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Bob",
+ "startTime": 1,
+ "finishTime": 4.08,
+ "dialogue": {
+ "text": "If we automate it, we don't have to worry about people forgetting.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "opacity": 0,
+ "startTime": 4.68
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678115abb22ae13dffd55444.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678115abb22ae13dffd55444.md
new file mode 100644
index 0000000000..198cb6c1b4
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678115abb22ae13dffd55444.md
@@ -0,0 +1,121 @@
+---
+id: 678115abb22ae13dffd55444
+title: Task 79
+challengeType: 19
+dashedName: task-79
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What is Bob asking for?
+
+## --answers--
+
+Reasons why automation is important.
+
+### --feedback--
+
+Bob already knows the importance of automation.
+
+---
+
+Details about how to automate the process.
+
+---
+
+Examples of what happens if they don't automate.
+
+### --feedback--
+
+Bob is not focused on what happens without it.
+
+---
+
+A decision on whether to automate.
+
+### --feedback--
+
+Bob has already decided on automation; he's asking how to proceed.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+Bob's question, `How can we set it up?`, shows he is asking for information or instructions on implementing automation. This kind of question is common when someone seeks guidance or clarification.
+
+Other examples of asking for information include:
+
+- `Can you explain how this works?`
+
+- `What steps should we take?`
+
+- `Do you know how to implement this feature?`
+
+These types of questions help to gather details and understand a process better.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Bob",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 46.7,
+ "finishTimestamp": 51.04
+ }
+ },
+ "commands": [
+ {
+ "character": "Bob",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Bob",
+ "startTime": 1,
+ "finishTime": 3.88,
+ "dialogue": {
+ "text": "If we automate it, we don't have to worry about people forgetting.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "startTime": 4.3,
+ "finishTime": 5.34,
+ "dialogue": {
+ "text": "How can we set it up?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Bob",
+ "opacity": 0,
+ "startTime": 5.84
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6781174efbccb43ebf078536.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6781174efbccb43ebf078536.md
new file mode 100644
index 0000000000..8657b85829
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6781174efbccb43ebf078536.md
@@ -0,0 +1,84 @@
+---
+id: 6781174efbccb43ebf078536
+title: Task 80
+challengeType: 22
+dashedName: task-80
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`Brian mentioned we can BLANK automatic backups at the end of each day.`
+
+## --blanks--
+
+`schedule`
+
+### --feedback--
+
+This verb means to arrange or plan for something to happen at a specific time.
+
+# --explanation--
+
+The verb `schedule` means to plan or arrange an event or task to happen at a specific time. For example:
+
+- `We need to schedule a meeting for next week.` - We need to plan a time for a meeting.
+
+- `Can we schedule the software update during off-hours?` - Asking to arrange the update at a specific time.
+
+In the audio, Maria uses `schedule` to talk about arranging automatic backups at the end of each day.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Maria",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.5
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 51.6,
+ "finishTimestamp": 54.8
+ }
+ },
+ "commands": [
+ {
+ "character": "Maria",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "startTime": 1,
+ "finishTime": 4.2,
+ "dialogue": {
+ "text": "Brian mentioned we can schedule automatic backups at the end of each day.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "opacity": 0,
+ "startTime": 4.7
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67811888485caf3f88c6db0a.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67811888485caf3f88c6db0a.md
new file mode 100644
index 0000000000..cd0ec2029e
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67811888485caf3f88c6db0a.md
@@ -0,0 +1,106 @@
+---
+id: 67811888485caf3f88c6db0a
+title: Task 81
+challengeType: 19
+dashedName: task-81
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+How often can the automatic backups be scheduled?
+
+## --answers--
+
+Once a week.
+
+### --feedback--
+
+Maria specifically mentions scheduling backups daily, not weekly.
+
+---
+
+Every hour.
+
+### --feedback--
+
+Maria refers to backups being scheduled daily, not hourly.
+
+---
+
+At the end of each day.
+
+---
+
+At the end of each month.
+
+### --feedback--
+
+Maria says `at the end of each day`, not `at the end of the month`.
+
+## --video-solution--
+
+3
+
+# --explanation--
+
+Maria says, `at the end of each day`, which clearly indicates that the backups are scheduled daily. This means the task is planned to happen once every day. For example:
+
+- `At the end of each day, the system runs a data backup.` - The system saves all data every evening to prevent loss.
+
+- `We ensure the servers are updated at the end of each day.` - Updates are applied to servers nightly to avoid interruptions during working hours.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Maria",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.5
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 51.6,
+ "finishTimestamp": 54.9
+ }
+ },
+ "commands": [
+ {
+ "character": "Maria",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "startTime": 1,
+ "finishTime": 4.3,
+ "dialogue": {
+ "text": "Brian mentioned we can schedule automatic backups at the end of each day.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "opacity": 0,
+ "startTime": 4.8
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67824be088281c44ea6fd142.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67824be088281c44ea6fd142.md
new file mode 100644
index 0000000000..35f5542e04
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67824be088281c44ea6fd142.md
@@ -0,0 +1,94 @@
+---
+id: 67824be088281c44ea6fd142
+title: Task 82
+challengeType: 22
+dashedName: task-82
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`If we BLANK that, it BLANK most of our bases.`
+
+## --blanks--
+
+`do`
+
+### --feedback--
+
+This verb refers to taking an action or completing a task.
+
+---
+
+`should cover`
+
+### --feedback--
+
+This phrase means that the action will likely address or handle the majority of the concerns or requirements.
+
+# --explanation--
+
+The sentence uses a `First Conditional` structure:
+
+Condition: `If we do that`.
+
+Result: `it should cover most of our bases`.
+
+`Do` means to perform or carry out a task.
+
+`Should cover` implies a high likelihood that the action will handle the necessary aspects or solve the problem.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Maria",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.5
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 55.04,
+ "finishTimestamp": 57.2
+ }
+ },
+ "commands": [
+ {
+ "character": "Maria",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "startTime": 1,
+ "finishTime": 3.16,
+ "dialogue": {
+ "text": "If we do that, it should cover most of our bases.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "opacity": 0,
+ "startTime": 3.66
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67824d4d310ce645e59f19ea.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67824d4d310ce645e59f19ea.md
new file mode 100644
index 0000000000..f0c6444c4f
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67824d4d310ce645e59f19ea.md
@@ -0,0 +1,108 @@
+---
+id: 67824d4d310ce645e59f19ea
+title: Task 83
+challengeType: 19
+dashedName: task-83
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What does Maria mean by `cover most of our bases`?
+
+## --answers--
+
+Focus only on one specific task.
+
+### --feedback--
+
+`Cover most of our bases` means to address multiple areas, not just one task.
+
+---
+
+Avoid doing unnecessary tasks.
+
+### --feedback--
+
+The phrase doesn't mean avoiding tasks but ensuring essential ones are completed.
+
+---
+
+Ensure most aspects or tasks are taken care of.
+
+---
+
+Finish all work immediately.
+
+### --feedback--
+
+The phrase suggests managing most areas, not necessarily completing everything right away.
+
+## --video-solution--
+
+3
+
+# --explanation--
+
+`Cover the bases` means to address all important aspects or prepare for various possibilities. For example:
+
+- `To cover the bases, we included documentation for both users and developers.` - The team provided complete documentation to ensure all needs are met.
+
+- `During the meeting, we covered the bases by discussing security, performance, and design.` - The team addressed all important topics to avoid missing anything.
+
+In the context of the audio, Maria uses it to suggest that scheduling automatic backups will ensure most of their essential needs or tasks are managed.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Maria",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.5
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 55.04,
+ "finishTimestamp": 57.2
+ }
+ },
+ "commands": [
+ {
+ "character": "Maria",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "startTime": 1,
+ "finishTime": 3.16,
+ "dialogue": {
+ "text": "If we do that, it should cover most of our bases.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "opacity": 0,
+ "startTime": 3.66
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67824ee5e84e0d46eee32524.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67824ee5e84e0d46eee32524.md
new file mode 100644
index 0000000000..739681d502
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67824ee5e84e0d46eee32524.md
@@ -0,0 +1,94 @@
+---
+id: 67824ee5e84e0d46eee32524
+title: Task 84
+challengeType: 22
+dashedName: task-84
+---
+
+
+
+# --description--
+
+This is a review of the entire dialogue you just studied.
+
+# --instructions--
+
+Place the following phrases in the correct spot:
+
+`human error`, `regularly`, `schedule`, `critical data`, `rely on`, `a disaster`, and `data backup`.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`Bob: Hi Maria, have you checked our BLANK procedures recently? If we don't back up BLANK, we could lose important information, right?`
+
+`Maria: Yes, you're correct. If someone forgets, it could be BLANK. But I think we are pretty solid here. Brian helped us set up a reminder to back up our work daily along with some other tasks.`
+
+`Bob: Oh, I see. So, you don't need to BLANK your memory. That's clever!`
+
+`Maria: I agree. But, why did you ask? Did you notice something wrong?`
+
+`Bob: No. Not really. I was in a meeting where the stakeholders were talking about it and I just wanted to double-check. If we lose BLANK, it could set us back weeks. Is there anything else we can do besides these reminders?`
+
+`Maria: Besides the daily reminders, we could also set up automatic backups. If we automate the process, there's less chance of BLANK. What do you think?`
+
+`Bob: I think that's a great idea. If we automate it, we don't have to worry about people forgetting. How can we set it up?`
+
+`Maria: Brian mentioned we can BLANK automatic backups at the end of each day. If we do that, it should cover most of our bases.`
+
+## --blanks--
+
+`data backup`
+
+### --feedback--
+
+This is a copy of important information stored securely to prevent loss during a system failure or disaster.
+
+---
+
+`regularly`
+
+### --feedback--
+
+This means something is done often and at consistent intervals.
+
+---
+
+`a disaster`
+
+### --feedback--
+
+This refers to an event causing significant damage or disruption.
+
+---
+
+`rely on`
+
+### --feedback--
+
+This phrase means to depend on something or someone for support or help.
+
+---
+
+`critical data`
+
+### --feedback--
+
+This refers to important or essential information that is vital for operations.
+
+---
+
+`human error`
+
+### --feedback--
+
+This refers to mistakes made by people during a process.
+
+---
+
+`schedule`
+
+### --feedback--
+
+To arrange or plan something to happen at a specific time.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678253507b3b1c487847713d.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678253507b3b1c487847713d.md
new file mode 100644
index 0000000000..e3d254528f
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678253507b3b1c487847713d.md
@@ -0,0 +1,72 @@
+---
+id: 678253507b3b1c487847713d
+title: Task 85
+challengeType: 19
+dashedName: task-85
+---
+
+
+
+# --instructions--
+
+Read the text and answer the question below.
+
+# --questions--
+
+## --text--
+
+Maria decided to email Brian to talk about specific issues the team is experiencing with data backup procedures:
+
+`Hi Brian,`
+
+`I wanted to update you on the current status of our data backup procedures. Bob and I were discussing it, and it seems we're doing well with the daily reminders you helped set up. This ensures that our team backs up their work regularly, which is great!`
+
+`However, Bob raised a point about minimizing human error, and we discussed the possibility of setting up automatic backups. If we automate the process, we can reduce the chances of forgetting, which would be a big win for us.`
+
+`I suggested we could schedule automatic backups at the end of each day, which seems like a solid approach. Could you let us know if that's possible, or if there's anything else we should consider?`
+
+`Thanks for your help!`
+
+`Best,`
+
+`Maria`
+
+Why did Maria decide to email Brian?
+
+## --answers--
+
+To thank Brian for his help with reminders.
+
+### --feedback--
+
+While Maria appreciates Brian's work, the purpose of her email is to discuss specific issues with the backup procedures.
+
+---
+
+To discuss issues with data backup procedures.
+
+---
+
+To report a technical failure.
+
+### --feedback--
+
+Maria's email does not mention any technical failures.
+
+---
+
+To share her schedule for the week.
+
+### --feedback--
+
+The email does not discuss Maria's personal schedule.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+Maria's email is written to address specific concerns about the team's `data backup procedures`. While she acknowledges the success of the `daily reminders` Brian set up, she points out a new issue: minimizing `human error`. The email focuses on updating Brian about these discussions with Bob and asking for feedback on the idea of automating backups.
+
+Focus on how Maria highlights the reminders' effectiveness but shifts to a potential improvement, showing the purpose is to involve Brian in the decision-making process.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6782554cf57c9e4956126827.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6782554cf57c9e4956126827.md
new file mode 100644
index 0000000000..7e8322b25a
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6782554cf57c9e4956126827.md
@@ -0,0 +1,72 @@
+---
+id: 6782554cf57c9e4956126827
+title: Task 86
+challengeType: 19
+dashedName: task-86
+---
+
+
+
+# --instructions--
+
+Read the text and answer the question below.
+
+# --questions--
+
+## --text--
+
+Maria decided to email Brian to talk about specific issues the team is experiencing with data backup procedures:
+
+`Hi Brian,`
+
+`I wanted to update you on the current status of our data backup procedures. Bob and I were discussing it, and it seems we're doing well with the daily reminders you helped set up. This ensures that our team backs up their work regularly, which is great!`
+
+`However, Bob raised a point about minimizing human error, and we discussed the possibility of setting up automatic backups. If we automate the process, we can reduce the chances of forgetting, which would be a big win for us.`
+
+`I suggested we could schedule automatic backups at the end of each day, which seems like a solid approach. Could you let us know if that's possible, or if there's anything else we should consider?`
+
+`Thanks for your help!`
+
+`Best,`
+
+`Maria`
+
+How do the daily reminders help the team?
+
+## --answers--
+
+They ensure the team backs up their work regularly.
+
+---
+
+They teach the team about backup systems.
+
+### --feedback--
+
+The reminders focus on ensuring regular backups, not training.
+
+---
+
+They minimize human error.
+
+### --feedback--
+
+While helpful, the reminders do not directly address human error, which is why Maria suggests automation.
+
+---
+
+They improve the team's technical skills.
+
+### --feedback--
+
+The reminders are practical for regular backups, not skill improvement.
+
+## --video-solution--
+
+1
+
+# --explanation--
+
+The email emphasizes that the `daily reminders` are essential for ensuring the team backs up their work `regularly`. Maria explicitly states that this is working well, thanks to Brian's initial setup. This routine has been effective in maintaining consistent backups.
+
+Pay attention to Maria's tone when she praises the reminders, showing their role in establishing a structured backup process while also hinting at areas for further improvement.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678257d9d12a574a3869314a.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678257d9d12a574a3869314a.md
new file mode 100644
index 0000000000..9d1b325b29
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678257d9d12a574a3869314a.md
@@ -0,0 +1,72 @@
+---
+id: 678257d9d12a574a3869314a
+title: Task 87
+challengeType: 19
+dashedName: task-87
+---
+
+
+
+# --instructions--
+
+Read the text and answer the question below.
+
+# --questions--
+
+## --text--
+
+Maria decided to email Brian to talk about specific issues the team is experiencing with data backup procedures:
+
+`Hi Brian,`
+
+`I wanted to update you on the current status of our data backup procedures. Bob and I were discussing it, and it seems we're doing well with the daily reminders you helped set up. This ensures that our team backs up their work regularly, which is great!`
+
+`However, Bob raised a point about minimizing human error, and we discussed the possibility of setting up automatic backups. If we automate the process, we can reduce the chances of forgetting, which would be a big win for us.`
+
+`I suggested we could schedule automatic backups at the end of each day, which seems like a solid approach. Could you let us know if that's possible, or if there's anything else we should consider?`
+
+`Thanks for your help!`
+
+`Best,`
+
+`Maria`
+
+Who is Maria working with to discuss the data backup procedures?
+
+## --answers--
+
+Brian
+
+### --feedback--
+
+Maria is emailing Brian for support but mentions discussing the procedures with someone else.
+
+---
+
+The entire team
+
+### --feedback--
+
+Maria discussed the backup procedures specifically with someone.
+
+---
+
+No one; Maria is working alone.
+
+### --feedback--
+
+Maria explicitly mentions working with someone in the email.
+
+---
+
+Bob
+
+## --video-solution--
+
+4
+
+# --explanation--
+
+Maria clearly states that she and `Bob` have been discussing the backup procedures. Together, they identify the need to address `human error` and brainstorm potential solutions like automatic backups. This collaboration highlights teamwork in identifying and addressing challenges.
+
+Focus on the fact that Maria specifically mentions Bob as her partner in this discussion, distinguishing him from Brian, who she seeks advice from.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678258a9a2bf814ae74e5418.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678258a9a2bf814ae74e5418.md
new file mode 100644
index 0000000000..b4c7a9339b
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678258a9a2bf814ae74e5418.md
@@ -0,0 +1,72 @@
+---
+id: 678258a9a2bf814ae74e5418
+title: Task 88
+challengeType: 19
+dashedName: task-88
+---
+
+
+
+# --instructions--
+
+Read the text and answer the question below.
+
+# --questions--
+
+## --text--
+
+Maria decided to email Brian to talk about specific issues the team is experiencing with data backup procedures:
+
+`Hi Brian,`
+
+`I wanted to update you on the current status of our data backup procedures. Bob and I were discussing it, and it seems we're doing well with the daily reminders you helped set up. This ensures that our team backs up their work regularly, which is great!`
+
+`However, Bob raised a point about minimizing human error, and we discussed the possibility of setting up automatic backups. If we automate the process, we can reduce the chances of forgetting, which would be a big win for us.`
+
+`I suggested we could schedule automatic backups at the end of each day, which seems like a solid approach. Could you let us know if that's possible, or if there's anything else we should consider?`
+
+`Thanks for your help!`
+
+`Best,`
+
+`Maria`
+
+Why does Maria suggest automatic backups?
+
+## --answers--
+
+To eliminate daily reminders.
+
+### --feedback--
+
+Maria does not suggest eliminating reminders, but she wants to add automation to reduce human error.
+
+---
+
+To minimize human error.
+
+---
+
+To save money for the team.
+
+### --feedback--
+
+The suggestion is not related to financial savings but to reducing human error.
+
+---
+
+To improve the team's technical skills.
+
+### --feedback--
+
+Maria's focus is on minimizing human error, not skill development.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+Maria suggests automation because it minimizes the chances of `human error`. She argues that this would be a significant improvement over relying solely on reminders, as automation ensures backups occur even if someone forgets. This aligns with the team's goal of creating a more reliable backup process.
+
+Highlight Maria's reasoning that automation not only complements the current reminders but also strengthens the system by removing manual dependence.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67825a2b3d567c4b90ae330d.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67825a2b3d567c4b90ae330d.md
new file mode 100644
index 0000000000..17c333af96
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67825a2b3d567c4b90ae330d.md
@@ -0,0 +1,72 @@
+---
+id: 67825a2b3d567c4b90ae330d
+title: Task 89
+challengeType: 19
+dashedName: task-89
+---
+
+
+
+# --instructions--
+
+Read the text and answer the question below.
+
+# --questions--
+
+## --text--
+
+Maria decided to email Brian to talk about specific issues the team is experiencing with data backup procedures:
+
+`Hi Brian,`
+
+`I wanted to update you on the current status of our data backup procedures. Bob and I were discussing it, and it seems we're doing well with the daily reminders you helped set up. This ensures that our team backs up their work regularly, which is great!`
+
+`However, Bob raised a point about minimizing human error, and we discussed the possibility of setting up automatic backups. If we automate the process, we can reduce the chances of forgetting, which would be a big win for us.`
+
+`I suggested we could schedule automatic backups at the end of each day, which seems like a solid approach. Could you let us know if that's possible, or if there's anything else we should consider?`
+
+`Thanks for your help!`
+
+`Best,`
+
+`Maria`
+
+How often does Maria suggest scheduling the automatic backups?
+
+## --answers--
+
+At the end of each day
+
+---
+
+At the end of each week
+
+### --feedback--
+
+Maria specifically mentions scheduling backups daily, not weekly.
+
+---
+
+Every hour
+
+### --feedback--
+
+Maria suggests backups daily, not hourly.
+
+---
+
+At the end of each month
+
+### --feedback--
+
+Maria proposes daily backups, not monthly ones.
+
+## --video-solution--
+
+1
+
+# --explanation--
+
+Maria proposes scheduling backups `at the end of each day`. She explicitly mentions this frequency as a solid approach to ensure all work from the day is securely saved. This daily schedule provides consistency and reduces the risk of data loss.
+
+Pay attention to her phrasing, which reflects a practical solution designed to balance automation with the team's existing workflow.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784c41edae95d51056f51d4.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784c41edae95d51056f51d4.md
new file mode 100644
index 0000000000..32b71163d6
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784c41edae95d51056f51d4.md
@@ -0,0 +1,196 @@
+---
+id: 6784c41edae95d51056f51d4
+title: "Dialogue 3: What If..."
+challengeType: 21
+dashedName: dialogue-3-what-if
+---
+
+# --description--
+
+Watch the video below to understand the context of the upcoming lessons.
+
+# --assignment--
+
+Watch the video.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Lisa",
+ "position": { "x": -25, "y": 0, "z": 1 }
+ },
+ {
+ "character": "Tom",
+ "position": { "x": 125, "y": 0, "z": 1 }
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1
+ },
+ "alwaysShowDialogue": true
+ },
+ "commands": [
+ {
+ "character": "Lisa",
+ "position": { "x": 25, "y": 0, "z": 1 },
+ "startTime": 0
+ },
+ {
+ "character": "Tom",
+ "position": { "x": 70, "y": 0, "z": 1 },
+ "startTime": 0.5
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1,
+ "finishTime": 5.08,
+ "dialogue": {
+ "text": "Hey Tom, have you ever thought about what would happen if TechCorp went out of business?",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Tom",
+ "startTime": 5.86,
+ "finishTime": 8.4,
+ "dialogue": {
+ "text": "If TechCorp went out of business, it would be a big shock.",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Tom",
+ "startTime": 8.76,
+ "finishTime": 11.08,
+ "dialogue": {
+ "text": "They work with so many companies. Why do you ask?",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Lisa",
+ "startTime": 11.62,
+ "finishTime": 13.46,
+ "dialogue": {
+ "text": "I read they might be having money problems.",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Lisa",
+ "startTime": 13.72,
+ "finishTime": 16.5,
+ "dialogue": {
+ "text": "If they closed, it would affect a lot of tech companies, wouldn't it?",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Tom",
+ "startTime": 16.94,
+ "finishTime": 20.68,
+ "dialogue": {
+ "text": "Yes, it would. If they shut down, a lot of people would lose their jobs",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Tom",
+ "startTime": 20.68,
+ "finishTime": 23.5,
+ "dialogue": {
+ "text": "and their current projects would stop, wouldn't they?",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Lisa",
+ "startTime": 23.86,
+ "finishTime": 27.56,
+ "dialogue": {
+ "text": "That's right. If that happened, a lot of smaller companies would be in trouble too.",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Lisa",
+ "startTime": 27.96,
+ "finishTime": 29.86,
+ "dialogue": {
+ "text": "TechCorp helps fund some of their projects.",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Tom",
+ "startTime": 29.86,
+ "finishTime": 33.42,
+ "dialogue": {
+ "text": "True. If that money goes away, those companies might not survive.",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Tom",
+ "startTime": 33.68,
+ "finishTime": 35.26,
+ "dialogue": {
+ "text": "It would be a big change for everyone.",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Lisa",
+ "startTime": 35.88,
+ "finishTime": 37.6,
+ "dialogue": {
+ "text": "Do you think they can fix their money problems?",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Tom",
+ "startTime": 38.22,
+ "finishTime": 43.02,
+ "dialogue": {
+ "text": "Maybe, but it's hard to know. If they get new investors, it might help, but it doesn't look likely.",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Lisa",
+ "startTime": 43.6,
+ "finishTime": 46.28,
+ "dialogue": {
+ "text": "I hope they do. If they go out of business, it would change everything.",
+ "align": "left"
+ }
+ },
+ {
+ "character": "Tom",
+ "startTime": 46.72,
+ "finishTime": 49.5,
+ "dialogue": {
+ "text": "It definitely would. Let's watch the news and see what happens.",
+ "align": "right"
+ }
+ },
+ {
+ "character": "Tom",
+ "position": { "x": 125, "y": 0, "z": 1 },
+ "startTime": 50
+ },
+ {
+ "character": "Lisa",
+ "position": { "x": -25, "y": 0, "z": 1 },
+ "startTime": 50.5
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784c4489e0292512b524f4e.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784c4489e0292512b524f4e.md
new file mode 100644
index 0000000000..dd2564a3a9
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784c4489e0292512b524f4e.md
@@ -0,0 +1,108 @@
+---
+id: 6784c4489e0292512b524f4e
+title: Task 90
+challengeType: 19
+dashedName: task-90
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What is Lisa asking Tom to think about?
+
+## --answers--
+
+A real event where TechCorp is shutting down.
+
+### --feedback--
+
+Lisa is talking about a hypothetical scenario, not a real situation.
+
+---
+
+A hypothetical situation where TechCorp goes out of business.
+
+---
+
+What TechCorp should do to avoid going out of business.
+
+### --feedback--
+
+Lisa isn't asking for advice or solutions; she's talking about an imagined possibility.
+
+---
+
+If TechCorp needs more employees.
+
+### --feedback--
+
+Lisa's question doesn't mention hiring or employee needs; it's about a hypothetical scenario.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+Lisa is using the `Second Conditional` to discuss a hypothetical situation.
+
+The `Second Conditional` is used to talk about unreal or unlikely situations in the present or future. It follows the structure `if` + `Present Simple` or `Past Continuous` (for the condition) and `might / would / could` + base verb (for the result). For example:
+
+- `If I had more time, I would learn a new programming language.` - This describes a hypothetical situation where having more time would lead to learning.
+
+- `If the server were faster, it could handle more users.` - The server is not fast now, but if it were, it could support more users.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Lisa",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 0,
+ "finishTimestamp": 4.28
+ }
+ },
+ "commands": [
+ {
+ "character": "Lisa",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1,
+ "finishTime": 5.28,
+ "dialogue": {
+ "text": "Hey Tom, have you ever thought about what would happen if TechCorp went out of business?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "opacity": 0,
+ "startTime": 5.78
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784c74702a2ac52841677e6.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784c74702a2ac52841677e6.md
new file mode 100644
index 0000000000..79941eff83
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784c74702a2ac52841677e6.md
@@ -0,0 +1,92 @@
+---
+id: 6784c74702a2ac52841677e6
+title: Task 91
+challengeType: 22
+dashedName: task-91
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`Hey Tom, have you ever thought about what BLANK if TechCorp BLANK of business?`
+
+## --blanks--
+
+`would happen`
+
+### --feedback--
+
+This phrase is part of the `Second Conditional` structure. It expresses the result of an unreal or hypothetical situation.
+
+---
+
+`went out`
+
+### --feedback--
+
+This is the `Past Simple` tense of `go out`, used in the `Second Conditional` to describe an imagined situation.
+
+# --explanation--
+
+The sentence uses the `Second Conditional` where:
+
+`If TechCorp went out of business` is the condition (imaginary scenario).
+
+`What would happen` expresses the result of that scenario.
+
+Lisa's question, `What would happen if TechCorp went out of business?`, reflects an imagined possibility.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Lisa",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 0,
+ "finishTimestamp": 4.28
+ }
+ },
+ "commands": [
+ {
+ "character": "Lisa",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1,
+ "finishTime": 5.28,
+ "dialogue": {
+ "text": "Hey Tom, have you ever thought about what would happen if TechCorp went out of business?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "opacity": 0,
+ "startTime": 5.78
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784c9924dda4553c171442e.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784c9924dda4553c171442e.md
new file mode 100644
index 0000000000..b6afcdfce5
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784c9924dda4553c171442e.md
@@ -0,0 +1,108 @@
+---
+id: 6784c9924dda4553c171442e
+title: Task 92
+challengeType: 19
+dashedName: task-92
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What is the possibility Lisa is talking about?
+
+## --answers--
+
+TechCorp changing its name.
+
+### --feedback--
+
+Lisa is discussing the possibility of the company shutting down, not rebranding.
+
+---
+
+TechCorp expanding its operations.
+
+### --feedback--
+
+The phrase `go out of business` means to shut down, not to grow or expand.
+
+---
+
+TechCorp closing permanently.
+
+---
+
+TechCorp hiring new employees.
+
+### --feedback--
+
+`Go out of business` refers to a company shutting down, not hiring more staff.
+
+## --video-solution--
+
+3
+
+# --explanation--
+
+The phrase `go out of business` means that a company closes permanently, often due to financial problems or lack of customers. For example:
+
+- `If the company doesn't innovate, it could go out of business.` - Without introducing new ideas, the company might fail.
+
+- `They nearly went out of business before launching their successful app.` - The company was close to failing until their app became a hit.
+
+Lisa is talking about a hypothetical situation where TechCorp shuts down permanently.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Lisa",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 0,
+ "finishTimestamp": 4.28
+ }
+ },
+ "commands": [
+ {
+ "character": "Lisa",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1,
+ "finishTime": 5.28,
+ "dialogue": {
+ "text": "Hey Tom, have you ever thought about what would happen if TechCorp went out of business?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "opacity": 0,
+ "startTime": 5.78
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784cc760a89e854dc55e4d2.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784cc760a89e854dc55e4d2.md
new file mode 100644
index 0000000000..9cb5a47ce6
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784cc760a89e854dc55e4d2.md
@@ -0,0 +1,94 @@
+---
+id: 6784cc760a89e854dc55e4d2
+title: Task 93
+challengeType: 19
+dashedName: task-93
+---
+
+
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What is the best response to Lisa's question?
+
+## --answers--
+
+`It would be a big shock.`
+
+---
+
+`We should ask the CEO.`
+
+### --feedback--
+
+Lisa is not suggesting taking action; she's exploring a hypothetical situation.
+
+## --video-solution--
+
+1
+
+# --explanation--
+
+The correct answer, `It would be a big shock`, reflects a hypothetical reaction to Lisa's imagined scenario. This matches the `Second Conditional` structure of Lisa's question, which describes an unreal or unlikely possibility. Examples of similar responses:
+
+- `It would cause a lot of problems.`
+
+- `Everyone would need to find new jobs.`
+
+These answers acknowledge the scenario and express imagined outcomes.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Lisa",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 0,
+ "finishTimestamp": 4.28
+ }
+ },
+ "commands": [
+ {
+ "character": "Lisa",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1,
+ "finishTime": 5.28,
+ "dialogue": {
+ "text": "Hey Tom, have you ever thought about what would happen if TechCorp went out of business?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "opacity": 0,
+ "startTime": 5.78
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784cde0b4978d55aa3b69d8.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784cde0b4978d55aa3b69d8.md
new file mode 100644
index 0000000000..5356e8d963
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784cde0b4978d55aa3b69d8.md
@@ -0,0 +1,56 @@
+---
+id: 6784cde0b4978d55aa3b69d8
+title: Task 94
+challengeType: 19
+dashedName: task-94
+---
+
+# --instructions--
+
+This task doesn't have audio. Read the question below and select the correct answer.
+
+# --questions--
+
+## --text--
+
+Which sentence is grammatically correct?
+
+## --answers--
+
+`If TechCorp goes out of business, it would be a big shock.`
+
+### --feedback--
+
+This mixes tenses incorrectly. For a hypothetical scenario, use the `Past Simple` tense in the condition and `would` in the result.
+
+---
+
+`If TechCorp went out of business, it would be a big shock.`
+
+---
+
+`If TechCorp went out of business, it will be a big shock.`
+
+### --feedback--
+
+Using `will` is incorrect for the `Second Conditional`. You should use `would` for imagined or unlikely situations.
+
+---
+
+`If TechCorp goes out of business, it will be a big shock.`
+
+### --feedback--
+
+This sentence uses the `First Conditional`, which is for real possibilities, but Tom and Lisa are talking about a hypothetical situation.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+The correct sentence, `If TechCorp went out of business, it would be a big shock`, follows the `Second Conditional` structure:
+
+`If` + `Past Simple` tense, `would` + base verb.
+
+This structure is used for unreal or unlikely scenarios, like imagining TechCorp going out of business.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784d1500f0a9757484f4c05.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784d1500f0a9757484f4c05.md
new file mode 100644
index 0000000000..a050e38ff1
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784d1500f0a9757484f4c05.md
@@ -0,0 +1,84 @@
+---
+id: 6784d1500f0a9757484f4c05
+title: Task 95
+challengeType: 22
+dashedName: task-95
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`If TechCorp went out of business, it would be a big BLANK.`
+
+## --blanks--
+
+`shock`
+
+### --feedback--
+
+This word means a sudden and often upsetting surprise.
+
+# --explanation--
+
+The word `shock` describes a strong emotional reaction to something surprising or upsetting. For example:
+
+- `The user feedback came as a shock; they found the app too complicated.` - The team didn't expect users to find the app difficult to use.
+
+- `The company's decision to shut down the service was a shock to its users.` - Users were surprised and disappointed when the service was discontinued.
+
+In the audio, Tom uses it to emphasize how unexpected and impactful the closure of TechCorp would be.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Tom",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 4.66,
+ "finishTimestamp": 7.5
+ }
+ },
+ "commands": [
+ {
+ "character": "Tom",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Tom",
+ "startTime": 1,
+ "finishTime": 3.84,
+ "dialogue": {
+ "text": "If TechCorp went out of business, it would be a big shock.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "opacity": 0,
+ "startTime": 4.34
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784d416a96a5858055ed288.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784d416a96a5858055ed288.md
new file mode 100644
index 0000000000..154a7ee52f
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6784d416a96a5858055ed288.md
@@ -0,0 +1,111 @@
+---
+id: 6784d416a96a5858055ed288
+title: Task 96
+challengeType: 19
+dashedName: task-96
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+Why does Tom think it would be a big shock if TechCorp went out of business?
+
+## --answers--
+
+Because they don't have enough clients.
+
+### --feedback--
+
+Tom explains that TechCorp works with many companies, not that they lack clients.
+
+---
+
+Because they don't have enough employees.
+
+### --feedback--
+
+Tom doesn't mention anything about TechCorp's workforce or employee count.
+
+---
+
+Because they are struggling financially.
+
+### --feedback--
+
+Tom does not suggest that TechCorp is facing financial struggles.
+
+---
+
+Because they work with many companies.
+
+## --video-solution--
+
+4
+
+# --explanation--
+
+Tom thinks it would be a big shock because TechCorp works with many companies. Their closure would likely disrupt a wide network of businesses that depend on their services.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Tom",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 4.66,
+ "finishTimestamp": 9.2
+ }
+ },
+ "commands": [
+ {
+ "character": "Tom",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Tom",
+ "startTime": 1,
+ "finishTime": 3.84,
+ "dialogue": {
+ "text": "If TechCorp went out of business, it would be a big shock.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "startTime": 4.2,
+ "finishTime": 5.54,
+ "dialogue": {
+ "text": "They work with so many companies.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "opacity": 0,
+ "startTime": 6.04
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678507620156985b70c81f9f.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678507620156985b70c81f9f.md
new file mode 100644
index 0000000000..fd48acafa8
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678507620156985b70c81f9f.md
@@ -0,0 +1,116 @@
+---
+id: 678507620156985b70c81f9f
+title: Task 97
+challengeType: 19
+dashedName: task-97
+---
+
+
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What is the best response to Tom's question?
+
+## --answers--
+
+`I read they might be having money problems.`
+
+---
+
+`They work with a lot of companies.`
+
+### --feedback--
+
+While true, this doesn't answer Tom's question about why you're asking.
+
+## --video-solution--
+
+1
+
+# --explanation--
+
+The correct response, `I read they might be having money problems`, directly answers Tom's question, `Why do you ask?` It provides a clear reason for bringing up the topic of TechCorp possibly going out of business.
+
+When someone asks `Why do you ask?`, they are looking for a specific explanation or context for your question.
+
+Other examples of responses to `Why do you ask?` could include:
+
+- `I saw something about it in the news.`
+
+- `I heard someone mention it in a meeting.`
+
+These responses provide the necessary context and keep the conversation focused on the original question.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Tom",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 4.86,
+ "finishTimestamp": 10.08
+ }
+ },
+ "commands": [
+ {
+ "character": "Tom",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Tom",
+ "startTime": 1,
+ "finishTime": 3.54,
+ "dialogue": {
+ "text": "If TechCorp went out of business, it would be a big shock.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "startTime": 3.9,
+ "finishTime": 5.24,
+ "dialogue": {
+ "text": "They work with so many companies.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "startTime": 5.38,
+ "finishTime": 6.22,
+ "dialogue": {
+ "text": "Why do you ask?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "opacity": 0,
+ "startTime": 6.72
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678508c63fb94a5c43ad8bd2.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678508c63fb94a5c43ad8bd2.md
new file mode 100644
index 0000000000..6dec96cec3
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678508c63fb94a5c43ad8bd2.md
@@ -0,0 +1,108 @@
+---
+id: 678508c63fb94a5c43ad8bd2
+title: Task 98
+challengeType: 19
+dashedName: task-98
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What did Lisa read about TechCorp?
+
+## --answers--
+
+They are expanding to new markets.
+
+### --feedback--
+
+Lisa mentions financial difficulties, not business expansion.
+
+---
+
+They are hiring more employees.
+
+### --feedback--
+
+Lisa does not talk about hiring; she refers to potential financial issues.
+
+---
+
+They might be having money problems.
+
+---
+
+They are closing their offices.
+
+### --feedback--
+
+Lisa talks about money problems, but she does not specifically mention closing offices.
+
+## --video-solution--
+
+3
+
+# --explanation--
+
+`Money problems` refers to financial difficulties, such as not having enough money to cover expenses or debts. For example:
+
+- `The company is facing money problems after a drop in sales.` - This means the company is struggling financially due to fewer sales.
+
+- `He had money problems and couldn't pay his rent on time.` - This shows personal financial difficulties.
+
+In the audio, Lisa mentions TechCorp might have money problems, suggesting they could be struggling to stay financially stable.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Lisa",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 10.62,
+ "finishTimestamp": 12.46
+ }
+ },
+ "commands": [
+ {
+ "character": "Lisa",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1,
+ "finishTime": 2.84,
+ "dialogue": {
+ "text": "I read they might be having money problems.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "opacity": 0,
+ "startTime": 3.34
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67850aaa7a0e065d089322fb.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67850aaa7a0e065d089322fb.md
new file mode 100644
index 0000000000..ac9b208b7c
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67850aaa7a0e065d089322fb.md
@@ -0,0 +1,103 @@
+---
+id: 67850aaa7a0e065d089322fb
+title: Task 99
+challengeType: 22
+dashedName: task-99
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`If they BLANK, it BLANK a lot of tech companies, wouldn't it?`
+
+## --blanks--
+
+`closed`
+
+### --feedback--
+
+This is the past tense of `close` and is part of the `Second Conditional`. It refers to a hypothetical situation where the company shuts down.
+
+---
+
+`would affect`
+
+### --feedback--
+
+These two words are used in the `Second Conditional` to describe the impact or result of the hypothetical condition.
+
+# --explanation--
+
+The sentence uses the `Second Conditional`, which is structured as:
+
+`If` + `Past Simple` or `Past Continuous` tense, `might / would / could` + base verb. In this example:
+
+`If they closed` is the condition (imagining a shutdown).
+
+`It would affect` is the result (what would happen as a consequence).
+
+This type of conditional is used to talk about unreal or hypothetical situations.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Lisa",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 12.72,
+ "finishTimestamp": 15.5
+ }
+ },
+ "commands": [
+ {
+ "character": "Lisa",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1,
+ "finishTime": 1.7,
+ "dialogue": {
+ "text": "If they closed,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1.7,
+ "finishTime": 3.78,
+ "dialogue": {
+ "text": "it would affect a lot of tech companies, wouldn't it?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "opacity": 0,
+ "startTime": 4.28
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67850d82396cc05e32854374.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67850d82396cc05e32854374.md
new file mode 100644
index 0000000000..2396236845
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67850d82396cc05e32854374.md
@@ -0,0 +1,101 @@
+---
+id: 67850d82396cc05e32854374
+title: Task 100
+challengeType: 22
+dashedName: task-100
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`If they closed, it would affect a lot of tech companies, BLANK?`
+
+## --blanks--
+
+`wouldn't it`
+
+### --feedback--
+
+This is a tag question, used to confirm or check understanding.
+
+# --explanation--
+
+A **tag question** is a short question added to the end of a sentence, used to confirm information or invite agreement. It is formed by:
+
+- Taking the auxiliary verb (e.g., `would`, `is`, `has`, `will`) from the main sentence.
+
+- Using the opposite form: positive to negative or negative to positive.
+
+- Adding the appropriate pronoun.
+
+In Lisa's sentence:
+
+- The main clause is `It would affect a lot of tech companies` (positive).
+
+- The tag is `wouldn't it?` (negative form of `would`).
+
+This confirms the statement and invites agreement or feedback.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Lisa",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 12.72,
+ "finishTimestamp": 15.5
+ }
+ },
+ "commands": [
+ {
+ "character": "Lisa",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1,
+ "finishTime": 1.7,
+ "dialogue": {
+ "text": "If they closed,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1.7,
+ "finishTime": 3.78,
+ "dialogue": {
+ "text": "it would affect a lot of tech companies, wouldn't it?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "opacity": 0,
+ "startTime": 4.28
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67850ffc432b605f3d7d7187.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67850ffc432b605f3d7d7187.md
new file mode 100644
index 0000000000..f0207760ea
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67850ffc432b605f3d7d7187.md
@@ -0,0 +1,97 @@
+---
+id: 67850ffc432b605f3d7d7187
+title: Task 101
+challengeType: 19
+dashedName: task-101
+---
+
+
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What is the best short answer to Lisa's question?
+
+## --answers--
+
+`It depends on the companies.`
+
+### --feedback--
+
+This answer adds complexity but doesn't directly respond to the tag question asking for confirmation.
+
+---
+
+`Yes, it would.`
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+Tag questions like `wouldn't it?` are used to confirm or invite agreement. A positive response such as `Yes, it would` agrees with the hypothetical impact described in Lisa's sentence.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Lisa",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 12.72,
+ "finishTimestamp": 15.5
+ }
+ },
+ "commands": [
+ {
+ "character": "Lisa",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1,
+ "finishTime": 1.7,
+ "dialogue": {
+ "text": "If they closed,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1.7,
+ "finishTime": 3.78,
+ "dialogue": {
+ "text": "it would affect a lot of tech companies, wouldn't it?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "opacity": 0,
+ "startTime": 4.28
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6785120bd970cb5fff50866e.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6785120bd970cb5fff50866e.md
new file mode 100644
index 0000000000..ba846f1a2f
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6785120bd970cb5fff50866e.md
@@ -0,0 +1,99 @@
+---
+id: 6785120bd970cb5fff50866e
+title: Task 102
+challengeType: 22
+dashedName: task-102
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`Yes, it would. If they BLANK, a lot of people BLANK their jobs.`
+
+## --blanks--
+
+`shut down`
+
+### --feedback--
+
+This phrase means to close permanently, often referring to a company or business ceasing operations.
+
+---
+
+`would lose`
+
+### --feedback--
+
+This phrase is part of the `Second Conditional`, used to describe the result of the hypothetical situation (losing jobs if the company closes).
+
+# --explanation--
+
+The sentence uses the `Second Conditional`:
+
+`If they shut down` is the hypothetical condition (imagining the company closing).
+
+`A lot of people would lose their jobs` is the result of this situation.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Tom",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 15.94,
+ "finishTimestamp": 19.68
+ }
+ },
+ "commands": [
+ {
+ "character": "Tom",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Tom",
+ "startTime": 1,
+ "finishTime": 1.92,
+ "dialogue": {
+ "text": "Yes, it would.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "startTime": 2.22,
+ "finishTime": 4.74,
+ "dialogue": {
+ "text": "If they shut down, a lot of people would lose their jobs.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "opacity": 0,
+ "startTime": 5.24
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678512e54c6e2e60c3ee1eff.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678512e54c6e2e60c3ee1eff.md
new file mode 100644
index 0000000000..5357d29bdb
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678512e54c6e2e60c3ee1eff.md
@@ -0,0 +1,80 @@
+---
+id: 678512e54c6e2e60c3ee1eff
+title: Task 103
+challengeType: 22
+dashedName: task-103
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`And their current projects would stop, BLANK?`
+
+## --blanks--
+
+`wouldn't they`
+
+### --feedback--
+
+This is a tag question, used to confirm or seek agreement about the statement.
+
+# --explanation--
+
+The main sentence is `Their current projects would stop` (positive statement).
+
+The tag question is `wouldn't they?` (negative form of `would` with the pronoun `they`).
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Tom",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 19.68,
+ "finishTimestamp": 22.5
+ }
+ },
+ "commands": [
+ {
+ "character": "Tom",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Tom",
+ "startTime": 1,
+ "finishTime": 3.82,
+ "dialogue": {
+ "text": "and their current projects would stop, wouldn't they?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "opacity": 0,
+ "startTime": 4.32
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678514dc7a9a57619631abd8.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678514dc7a9a57619631abd8.md
new file mode 100644
index 0000000000..f5cfc2049c
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678514dc7a9a57619631abd8.md
@@ -0,0 +1,116 @@
+---
+id: 678514dc7a9a57619631abd8
+title: Task 104
+challengeType: 19
+dashedName: task-104
+---
+
+
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What Tom is saying is true. What should Lisa answer?
+
+## --answers--
+
+`I don't think so.`
+
+### --feedback--
+
+This response disagrees with Tom.
+
+---
+
+`That's right.`
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+In tag questions like `wouldn't they?`, the speaker typically seeks confirmation or agreement. A response like `That's right` provides clear affirmation and keeps the conversation aligned.
+
+Other examples of confirming responses:
+
+- `Yes, exactly.`
+
+- `Absolutely, you're correct.`
+
+- `I agree completely.`
+
+These responses acknowledge and validate the speaker's statement.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Tom",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 15.94,
+ "finishTimestamp": 22.5
+ }
+ },
+ "commands": [
+ {
+ "character": "Tom",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Tom",
+ "startTime": 1,
+ "finishTime": 1.92,
+ "dialogue": {
+ "text": "Yes, it would.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "startTime": 2.22,
+ "finishTime": 4.74,
+ "dialogue": {
+ "text": "If they shut down, a lot of people would lose their jobs",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "startTime": 4.74,
+ "finishTime": 7.56,
+ "dialogue": {
+ "text": "and their current projects would stop, wouldn't they?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "opacity": 0,
+ "startTime": 8.06
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6785175ebbf89262b90a8a49.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6785175ebbf89262b90a8a49.md
new file mode 100644
index 0000000000..b3725a7c3b
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6785175ebbf89262b90a8a49.md
@@ -0,0 +1,56 @@
+---
+id: 6785175ebbf89262b90a8a49
+title: Task 105
+challengeType: 19
+dashedName: task-105
+---
+
+# --instructions--
+
+This task doesn't have audio. Read the question below and select the correct answer.
+
+# --questions--
+
+## --text--
+
+Which sentence is grammatically correct?
+
+## --answers--
+
+`If that happened, a lot of smaller companies were be in trouble, too.`
+
+### --feedback--
+
+For the conditional, if the condition is in the `Past Simple` tense (hypothetical), the result should use `would`.
+
+---
+
+`If that happened, a lot of smaller companies would be in trouble, too.`
+
+---
+
+`If that happened, a lot of smaller companies will be in trouble, too.`
+
+### --feedback--
+
+Using `will` is incorrect in a `Second Conditional`. The result of a hypothetical condition should use `would`.
+
+---
+
+`If that happens, a lot of smaller companies will be in trouble, too.`
+
+### --feedback--
+
+This sentence uses the `First Conditional`, which is for real possibilities. However, the sentence given is a hypothetical scenario, making it a `Second Conditional`.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+The correct sentence, `If that happened, a lot of smaller companies would be in trouble, too`, is a `Second Conditional`, used for hypothetical or unreal situations in the present or future. In this sentence:
+
+- `If that happened` is the hypothetical condition.
+
+- `A lot of smaller companies would be in trouble, too` is the imagined result.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678519c0009c0864277dbfcc.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678519c0009c0864277dbfcc.md
new file mode 100644
index 0000000000..da128fd836
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678519c0009c0864277dbfcc.md
@@ -0,0 +1,117 @@
+---
+id: 678519c0009c0864277dbfcc
+title: Task 106
+challengeType: 19
+dashedName: task-106
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What does `smaller companies` mean in this context?
+
+## --answers--
+
+Companies that operate internationally.
+
+### --feedback--
+
+`Smaller companies` typically refers to the size of the business, not their location or reach.
+
+---
+
+Businesses that only sell products online.
+
+### --feedback--
+
+`Smaller companies` is not limited to online businesses; it refers to size and resources.
+
+---
+
+Businesses that are not as large or well-established as bigger companies.
+
+---
+
+Large corporations with many employees.
+
+### --feedback--
+
+`Smaller companies` refers to businesses that are smaller in size and scale, not large corporations.
+
+## --video-solution--
+
+3
+
+# --explanation--
+
+`Smaller companies` refers to businesses that have fewer employees, lower revenue, or smaller market influence compared to large corporations. For example:
+
+- `Local bakeries are examples of smaller companies competing with large chains.` - Small businesses compared to well-known corporations.
+
+- `Smaller companies often rely on personal customer relationships to succeed.` - They operate on a smaller scale, often focusing on niche markets.
+
+In the audio, `smaller companies` are mentioned as potentially facing challenges due to their limited resources if the hypothetical situation occurs.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Lisa",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 22.86,
+ "finishTimestamp": 26.56
+ }
+ },
+ "commands": [
+ {
+ "character": "Lisa",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1,
+ "finishTime": 1.62,
+ "dialogue": {
+ "text": "That's right.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1.78,
+ "finishTime": 4.7,
+ "dialogue": {
+ "text": "If that happened, a lot of smaller companies would be in trouble too.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "opacity": 0,
+ "startTime": 5.2
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678550a60e946b666aaa6de9.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678550a60e946b666aaa6de9.md
new file mode 100644
index 0000000000..9794adb549
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678550a60e946b666aaa6de9.md
@@ -0,0 +1,118 @@
+---
+id: 678550a60e946b666aaa6de9
+title: Task 107
+challengeType: 19
+dashedName: task-107
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What would happen to small companies if TechCorp closed?
+
+## --answers--
+
+They would grow quickly.
+
+### --feedback--
+
+The audio discusses small companies facing problems, not growth.
+
+---
+
+They would remain unaffected.
+
+### --feedback--
+
+The audio suggests the opposite: small companies would face difficulties if the condition occurs.
+
+---
+
+They would be in trouble.
+
+---
+
+They would shut down immediately.
+
+### --feedback--
+
+While they may face challenges, the audio does not specify that they would shut down immediately.
+
+## --video-solution--
+
+3
+
+# --explanation--
+
+The phrase `be in trouble` means to face difficulties or problems. For example:
+
+- `He's in trouble with his clients for missing the deadline.` - Facing problems because of a missed deadline.
+
+- `If the funding stops, the project will be in trouble.` - The project would face difficulties due to a lack of funding.
+
+In this context, small companies would encounter serious challenges if the hypothetical condition were met.
+
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Lisa",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 22.86,
+ "finishTimestamp": 26.56
+ }
+ },
+ "commands": [
+ {
+ "character": "Lisa",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1,
+ "finishTime": 1.62,
+ "dialogue": {
+ "text": "That's right.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1.78,
+ "finishTime": 4.7,
+ "dialogue": {
+ "text": "If that happened, a lot of smaller companies would be in trouble too.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "opacity": 0,
+ "startTime": 5.2
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6785520139b856671a3ca311.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6785520139b856671a3ca311.md
new file mode 100644
index 0000000000..bbc2869306
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6785520139b856671a3ca311.md
@@ -0,0 +1,108 @@
+---
+id: 6785520139b856671a3ca311
+title: Task 108
+challengeType: 19
+dashedName: task-108
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+Why would smaller companies be in trouble?
+
+## --answers--
+
+Because they don't have any funding.
+
+### --feedback--
+
+Lisa says TechCorp helps fund some projects, not that smaller companies lack funding entirely.
+
+---
+
+Because they rely only on TechCorp.
+
+### --feedback--
+
+Smaller companies depend on TechCorp for some funding, but not necessarily all of their operations.
+
+---
+
+Because they have too many employees.
+
+### --feedback--
+
+Lisa doesn't mention anything about the number of employees in smaller companies.
+
+---
+
+Because TechCorp helps fund some of their projects.
+
+## --video-solution--
+
+4
+
+# --explanation--
+
+The word `some` means `a part of` or `not all`. For example:
+
+- `Some of the team members are working remotely.` - Not all team members, just a part of them.
+
+- `She bought some new books to prepare for the exam.` - A few books, not all the books available.
+
+Using `some` highlights that while TechCorp is important to smaller companies, it doesn't fund all their projects, just a portion of them. This is why losing TechCorp would still have a significant impact.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Lisa",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 26.56,
+ "finishTimestamp": 28.86
+ }
+ },
+ "commands": [
+ {
+ "character": "Lisa",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1,
+ "finishTime": 3.1,
+ "dialogue": {
+ "text": "TechCorp helps fund some of their projects.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "opacity": 0,
+ "startTime": 3.6
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678553a759feaa680cf381ab.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678553a759feaa680cf381ab.md
new file mode 100644
index 0000000000..779c828751
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678553a759feaa680cf381ab.md
@@ -0,0 +1,114 @@
+---
+id: 678553a759feaa680cf381ab
+title: Task 109
+challengeType: 19
+dashedName: task-109
+---
+
+
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What answer agrees to what Lisa is saying?
+
+## --answers--
+
+`They'll be fine.`
+
+### --feedback--
+
+This dismisses Lisa's point, which emphasizes the trouble smaller companies could face.
+
+---
+
+`True.`
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+The correct response, `True`, shows agreement with Lisa's statement about the impact on smaller companies and TechCorp's role in funding some of their projects. Examples of agreeing responses:
+
+- `Absolutely.`
+
+- `Yes, that's correct.`
+
+- `Exactly.`
+
+These responses confirm and align with the speaker's point.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Lisa",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 22.86,
+ "finishTimestamp": 28.86
+ }
+ },
+ "commands": [
+ {
+ "character": "Lisa",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1,
+ "finishTime": 1.62,
+ "dialogue": {
+ "text": "That's right.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1.78,
+ "finishTime": 4.7,
+ "dialogue": {
+ "text": "If that happened, a lot of smaller companies would be in trouble too.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "startTime": 5.1,
+ "finishTime": 7,
+ "dialogue": {
+ "text": "TechCorp helps fund some of their projects.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "opacity": 0,
+ "startTime": 7.5
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678554d17334f068f48856da.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678554d17334f068f48856da.md
new file mode 100644
index 0000000000..997ee5177b
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678554d17334f068f48856da.md
@@ -0,0 +1,84 @@
+---
+id: 678554d17334f068f48856da
+title: Task 110
+challengeType: 22
+dashedName: task-110
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`True. If that money goes away, those companies BLANK not survive.`
+
+## --blanks--
+
+`might`
+
+### --feedback--
+
+This modal verb is used to express possibility.
+
+# --explanation--
+
+The word `might` is a modal verb used to express possibility or a chance of something happening. It is less certain than `will` and suggests that something could happen, but it's not guaranteed. For example:
+
+- `It might rain tomorrow.` - There is a chance of rain, but it's not certain.
+
+- `She might join the meeting later.` - It's possible she will attend, but it's not definite.
+
+In the dialogue, `might` shows the possibility that some companies could fail, depending on the condition.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Tom",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 28.86,
+ "finishTimestamp": 32.42
+ }
+ },
+ "commands": [
+ {
+ "character": "Tom",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Tom",
+ "startTime": 1,
+ "finishTime": 4.56,
+ "dialogue": {
+ "text": "True. If that money goes away, those companies might not survive.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "opacity": 0,
+ "startTime": 5.06
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6785562a8d1e2469f0e4adfd.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6785562a8d1e2469f0e4adfd.md
new file mode 100644
index 0000000000..805b3891fb
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6785562a8d1e2469f0e4adfd.md
@@ -0,0 +1,109 @@
+---
+id: 6785562a8d1e2469f0e4adfd
+title: Task 111
+challengeType: 19
+dashedName: task-111
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What does the sentence imply about the companies' survival?
+
+## --answers--
+
+Their survival depends on the money.
+
+---
+
+They will survive no matter what.
+
+### --feedback--
+
+The sentence uses a conditional to express that their survival is uncertain and depends on whether the money goes away.
+
+---
+
+They are guaranteed to fail.
+
+### --feedback--
+
+The word `might` shows a possibility, not a certainty, of failure.
+
+---
+
+The money doesn't affect their survival.
+
+### --feedback--
+
+The sentence makes it clear that the companies' survival is tied to the availability of the money.
+
+## --video-solution--
+
+1
+
+# --explanation--
+
+The sentence uses a `First Conditional` structure:
+
+- `If that money goes away` (condition).
+
+- `Those companies might not survive` (result).
+
+This indicates that the companies' survival is uncertain and depends on whether the money is available. The word `might` adds a sense of possibility, meaning the outcome is not guaranteed.
+
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Tom",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 28.86,
+ "finishTimestamp": 32.42
+ }
+ },
+ "commands": [
+ {
+ "character": "Tom",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Tom",
+ "startTime": 1,
+ "finishTime": 4.56,
+ "dialogue": {
+ "text": "True. If that money goes away, those companies might not survive.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "opacity": 0,
+ "startTime": 5.06
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6785570d52b6016ae90cac76.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6785570d52b6016ae90cac76.md
new file mode 100644
index 0000000000..8dd320b89c
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6785570d52b6016ae90cac76.md
@@ -0,0 +1,84 @@
+---
+id: 6785570d52b6016ae90cac76
+title: Task 112
+challengeType: 22
+dashedName: task-112
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`It would be a BLANK for everyone.`
+
+## --blanks--
+
+`big change`
+
+### --feedback--
+
+These two words together mean a significant difference or shift from the current situation.
+
+# --explanation--
+
+The phrase `big change` refers to a significant or impactful difference in a situation, often affecting people's lives, routines, or environments. For example:
+
+- `Getting a new job was a big change for her.` - It significantly altered her daily life and responsibilities.
+
+- `Switching to remote work was a big change for the company.` - This change impacted how everyone worked and communicated.
+
+In the audio, Tom uses `big change` to describe how the hypothetical situation would affect everyone. It highlights that the impact would be substantial and noticeable.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Tom",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 32.68,
+ "finishTimestamp": 34.26
+ }
+ },
+ "commands": [
+ {
+ "character": "Tom",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Tom",
+ "startTime": 1,
+ "finishTime": 2.58,
+ "dialogue": {
+ "text": "It would be a big change for everyone.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "opacity": 0,
+ "startTime": 3.08
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678558730bb1c36b924b8b4c.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678558730bb1c36b924b8b4c.md
new file mode 100644
index 0000000000..3f00e9fdcb
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678558730bb1c36b924b8b4c.md
@@ -0,0 +1,84 @@
+---
+id: 678558730bb1c36b924b8b4c
+title: Task 113
+challengeType: 22
+dashedName: task-113
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`Do you think they can BLANK their money problems?`
+
+## --blanks--
+
+`fix`
+
+### --feedback--
+
+This verb means to repair or resolve an issue.
+
+# --explanation--
+
+`Fix` means to repair, solve, or make something right. It is commonly used to refer to resolving problems or making improvements. For example:
+
+- `The IT team fixed the software bug.` - They resolved the issue to ensure the software worked correctly.
+
+- `He fixed the misunderstanding with his colleague.` - He resolved the conflict or confusion.
+
+In the audio, Lisa uses `fix` to refer to resolving money problems, asking if they can solve their financial difficulties.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Lisa",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 34.88,
+ "finishTimestamp": 36.6
+ }
+ },
+ "commands": [
+ {
+ "character": "Lisa",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1,
+ "finishTime": 2.72,
+ "dialogue": {
+ "text": "Do you think they can fix their money problems?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "opacity": 0,
+ "startTime": 3.22
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678559c204808d6c6706556c.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678559c204808d6c6706556c.md
new file mode 100644
index 0000000000..8536516925
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678559c204808d6c6706556c.md
@@ -0,0 +1,92 @@
+---
+id: 678559c204808d6c6706556c
+title: Task 114
+challengeType: 19
+dashedName: task-114
+---
+
+
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+Tom is not sure. What should he reply?
+
+## --answers--
+
+`Yes, they definitely can.`
+
+### --feedback--
+
+This response assumes certainty, but the situation is uncertain, as Lisa's question suggests.
+
+---
+
+`Maybe, but it's hard to know.`
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+`Maybe` means `possibly` or `there's a chance`. It's used to express uncertainty or lack of full confidence.
+
+`Hard to know` means it's difficult to determine or make a judgment due to lack of information or clarity.
+
+`Maybe, but it's hard to know`, combines these ideas to indicate that fixing money problems is possible, but the outcome is uncertain.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Lisa",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 34.88,
+ "finishTimestamp": 36.6
+ }
+ },
+ "commands": [
+ {
+ "character": "Lisa",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1,
+ "finishTime": 2.72,
+ "dialogue": {
+ "text": "Do you think they can fix their money problems?",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "opacity": 0,
+ "startTime": 3.22
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678617cb0ad89b6f9bfe601e.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678617cb0ad89b6f9bfe601e.md
new file mode 100644
index 0000000000..b14bbe0698
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678617cb0ad89b6f9bfe601e.md
@@ -0,0 +1,103 @@
+---
+id: 678617cb0ad89b6f9bfe601e
+title: Task 115
+challengeType: 22
+dashedName: task-115
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`Maybe, but it's hard to know. If they BLANK new investors, it BLANK, but it doesn't look likely.`
+
+## --blanks--
+
+`get`
+
+### --feedback--
+
+This verb means to obtain or acquire something.
+
+---
+
+`might help`
+
+### --feedback--
+
+This phrase expresses a possibility of being useful or beneficial.
+
+# --explanation--
+
+The sentence uses the `First Conditional`, structured as:
+
+`If` + `Present Simple` tense, `might` + base verb.
+
+In this context:
+
+`If they get new investors` is the condition (a possible action).
+
+`It might help` is the result (a possible benefit from the action).
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Tom",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 37.02,
+ "finishTimestamp": 42.02
+ }
+ },
+ "commands": [
+ {
+ "character": "Tom",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Tom",
+ "startTime": 1,
+ "finishTime": 2.48,
+ "dialogue": {
+ "text": "Maybe, but it's hard to know.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "startTime": 2.68,
+ "finishTime": 6.0,
+ "dialogue": {
+ "text": "If they get new investors, it might help, but it doesn't look likely.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "opacity": 0,
+ "startTime": 6.5
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678619d1854f1a705b0fd76e.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678619d1854f1a705b0fd76e.md
new file mode 100644
index 0000000000..8bdcb969fc
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678619d1854f1a705b0fd76e.md
@@ -0,0 +1,117 @@
+---
+id: 678619d1854f1a705b0fd76e
+title: Task 116
+challengeType: 19
+dashedName: task-116
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What might help with money problems?
+
+## --answers--
+
+Selling their assets.
+
+### --feedback--
+
+Tom doesn't mention selling assets.
+
+---
+
+Getting new investors.
+
+---
+
+Cutting their workforce.
+
+### --feedback--
+
+Tom doesn't talk about making internal changes like reducing staff.
+
+---
+
+Taking out a loan.
+
+### --feedback--
+
+Tom doesn't suggest borrowing money.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+An `investor` is someone who provides money to a business or project in the hope of earning a return, often through profits or shares. Investors play a crucial role in funding and supporting companies, especially during financial difficulties. For example:
+
+- `The startup secured an investor to help fund their new product line.` - An individual or organization provided money to develop the product.
+
+- `TechCorp is looking for investors to expand internationally.` - The company is seeking financial support for their growth plans.
+
+In the audio, Tom explains that getting new investors might improve the financial situation by providing the necessary funds, though it's not guaranteed to happen.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Tom",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 37.02,
+ "finishTimestamp": 42.02
+ }
+ },
+ "commands": [
+ {
+ "character": "Tom",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Tom",
+ "startTime": 1,
+ "finishTime": 2.48,
+ "dialogue": {
+ "text": "Maybe, but it's hard to know.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "startTime": 2.68,
+ "finishTime": 6.0,
+ "dialogue": {
+ "text": "If they get new investors, it might help, but it doesn't look likely.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "opacity": 0,
+ "startTime": 6.5
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67861d7d58b8a871619c146a.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67861d7d58b8a871619c146a.md
new file mode 100644
index 0000000000..63f0d0fe2b
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67861d7d58b8a871619c146a.md
@@ -0,0 +1,118 @@
+---
+id: 67861d7d58b8a871619c146a
+title: Task 117
+challengeType: 19
+dashedName: task-117
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What does Tom think about getting new investors?
+
+## --answers--
+
+It doesn't seem possible or probable.
+
+---
+
+It is guaranteed to happen.
+
+### --feedback--
+
+`Doesn't look likely` suggests the opposite — it means something is improbable, not certain.
+
+---
+
+It will definitely fail.
+
+### --feedback--
+
+`Doesn't look likely` means it's improbable, but not a guaranteed failure.
+
+---
+
+It seems highly probable.
+
+### --feedback--
+
+Tom's phrase means the opposite — he believes it is not very probable.
+
+## --video-solution--
+
+1
+
+# --explanation--
+
+The phrase `doesn't look likely` means that something seems improbable or unlikely to happen. For example:
+
+- `It doesn't look likely that we'll finish the project on time.` - It seems improbable that the deadline will be met.
+
+- `With this weather, it doesn't look likely that we'll have a picnic today.` - The rain or bad weather makes a picnic seem improbable.
+
+Tom uses this phrase to emphasize the low probability of securing new investors, even though it might help if it did happen.
+
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Tom",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 37.02,
+ "finishTimestamp": 42.02
+ }
+ },
+ "commands": [
+ {
+ "character": "Tom",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Tom",
+ "startTime": 1,
+ "finishTime": 2.48,
+ "dialogue": {
+ "text": "Maybe, but it's hard to know.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "startTime": 2.68,
+ "finishTime": 6.0,
+ "dialogue": {
+ "text": "If they get new investors, it might help, but it doesn't look likely.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "opacity": 0,
+ "startTime": 6.5
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67861f274572b9727bc11ee6.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67861f274572b9727bc11ee6.md
new file mode 100644
index 0000000000..26dd84eb4e
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67861f274572b9727bc11ee6.md
@@ -0,0 +1,106 @@
+---
+id: 67861f274572b9727bc11ee6
+title: Task 118
+challengeType: 19
+dashedName: task-118
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What does Lisa think about TechCorp going out of business?
+
+## --answers--
+
+She is certain they will get new investors.
+
+### --feedback--
+
+Lisa uses `hope`, which expresses a desire or wish, not certainty.
+
+---
+
+She doesn't care if they get new investors.
+
+### --feedback--
+
+Saying `I hope they do` shows she cares about the outcome.
+
+---
+
+She wants them to succeed in getting new investors.
+
+---
+
+She believes they won't get new investors.
+
+### --feedback--
+
+Lisa's statement expresses positivity and desire for success, not disbelief.
+
+## --video-solution--
+
+3
+
+# --explanation--
+
+Lisa's phrase, `I hope they do`, expresses a desire or wish for a positive outcome — in this case, that TechCorp succeed in getting new investors. Examples of expressing hope:
+
+- `I hope she gets the job she applied for.` - Wishing for her success in job hunting.
+
+- `I hope we can finish the project on time.` - Expressing a wish to meet the deadline.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Lisa",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 42.6,
+ "finishTimestamp": 43.28
+ }
+ },
+ "commands": [
+ {
+ "character": "Lisa",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1,
+ "finishTime": 1.68,
+ "dialogue": {
+ "text": "I hope they do.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "opacity": 0,
+ "startTime": 2.18
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67862358aa138073c5e91b9c.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67862358aa138073c5e91b9c.md
new file mode 100644
index 0000000000..b69d1251e6
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67862358aa138073c5e91b9c.md
@@ -0,0 +1,96 @@
+---
+id: 67862358aa138073c5e91b9c
+title: Task 119
+challengeType: 22
+dashedName: task-119
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`If they BLANK out of business, it BLANK everything.`
+
+## --blanks--
+
+`go`
+
+### --feedback--
+
+This is the base verb used in the condition. It refers to the company ceasing operations.
+
+---
+
+`would change`
+
+### --feedback--
+
+This phrase expresses the result of the condition. `Would` shows the hypothetical outcome of the company going out of business.
+
+# --explanation--
+
+This sentence uses a `Mixed Conditional`, combining elements of the `First Conditional` (real possibility) and the `Second Conditional` (hypothetical result). Here's the structure:
+
+`If` + `Present Simple` tense (real possibility): `If they go out of business` assumes the event is possible in the future.
+
+`Would` + base verb (hypothetical result): `It would change everything` imagines the impact of this event.
+
+Normally, the `First Conditional` uses `will` in the result (e.g., `If they go out of business, it will change everything`), focusing on real, probable outcomes. Here, `would` is used instead, blending the certainty of the condition with a hypothetical tone in the result. For example:
+
+- `If she studies harder, she would pass the exam.` - The condition is realistic, but the result imagines what could happen.
+
+- `If we leave now, we would avoid traffic.` - Real possibility of leaving now and hypothetical benefit in the result.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Lisa",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 43.32,
+ "finishTimestamp": 45.28
+ }
+ },
+ "commands": [
+ {
+ "character": "Lisa",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1,
+ "finishTime": 2.96,
+ "dialogue": {
+ "text": "If they go out of business, it would change everything.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "opacity": 0,
+ "startTime": 3.46
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67862a06733c0575a524cc02.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67862a06733c0575a524cc02.md
new file mode 100644
index 0000000000..ebdba97860
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67862a06733c0575a524cc02.md
@@ -0,0 +1,136 @@
+---
+id: 67862a06733c0575a524cc02
+title: Task 120
+challengeType: 19
+dashedName: task-120
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+Does Tom agree with Lisa?
+
+## --answers--
+
+No, he doesn't agree with her.
+
+### --feedback--
+
+Tom says he fully agrees with Lisa.
+
+---
+
+He is unsure about her statement.
+
+### --feedback--
+
+The word `definitely` shows complete certainty, not hesitation or doubt.
+
+---
+
+He partially agrees with her.
+
+### --feedback--
+
+`Definitely` expresses strong agreement, not partial or conditional agreement.
+
+---
+
+Yes, he definitely does.
+
+## --video-solution--
+
+4
+
+# --explanation--
+
+`Definitely` is used to express strong agreement or certainty. It means `without a doubt` or `absolutely`. For example:
+
+- `This plan is definitely the best option.` - Shows complete certainty about the plan being the best choice.
+
+- `I'll definitely be at the meeting tomorrow.` - Expresses confidence that the speaker will attend the meeting.
+
+In this context, Tom uses it to fully agree with Lisa's statement about the significant impact of the company going out of business.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Lisa",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ },
+ {
+ "character": "Tom",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 43.42,
+ "finishTimestamp": 46.52
+ }
+ },
+ "commands": [
+ {
+ "character": "Lisa",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Lisa",
+ "startTime": 1,
+ "finishTime": 2.86,
+ "dialogue": {
+ "text": "If they go out of business, it would change everything.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Lisa",
+ "opacity": 0,
+ "startTime": 3.08
+ },
+ {
+ "character": "Tom",
+ "opacity": 1,
+ "startTime": 3.08
+ },
+ {
+ "character": "Tom",
+ "startTime": 3.3,
+ "finishTime": 4.1,
+ "dialogue": {
+ "text": "It definitely would.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "opacity": 0,
+ "startTime": 4.6
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67862bdc2cbf3276d7599515.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67862bdc2cbf3276d7599515.md
new file mode 100644
index 0000000000..2793de6974
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67862bdc2cbf3276d7599515.md
@@ -0,0 +1,108 @@
+---
+id: 67862bdc2cbf3276d7599515
+title: Task 121
+challengeType: 19
+dashedName: task-121
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What does Tom suggest?
+
+## --answers--
+
+Discussing their opinions about the situation.
+
+### --feedback--
+
+Tom doesn't suggest having a discussion.
+
+---
+
+Watching the news to find out more.
+
+---
+
+Calling someone to get more information.
+
+### --feedback--
+
+Tom doesn't suggest contacting someone.
+
+---
+
+Ignoring the situation and moving on.
+
+### --feedback--
+
+Tom's suggestion shows he is interested in staying informed, not ignoring the situation.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+Tom suggests watching the news to stay updated and learn more about the situation. This indicates that he is curious and wants to follow the developments. Examples of similar suggestions:
+
+- `Let's check the website to see if there are updates.` - Proposes a way to get more information.
+
+- `Let's listen to the announcement and find out what's going on.` - Encourages paying attention to a source for details.
+
+In each case, the goal is to gather information and understand the situation better, just like Tom's suggestion.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-breakroom.png",
+ "characters": [
+ {
+ "character": "Tom",
+ "position": {
+ "x": 50,
+ "y": 15,
+ "z": 1.2
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-3.mp3",
+ "startTime": 1,
+ "startTimestamp": 46.62,
+ "finishTimestamp": 48.6
+ }
+ },
+ "commands": [
+ {
+ "character": "Tom",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Tom",
+ "startTime": 1,
+ "finishTime": 2.98,
+ "dialogue": {
+ "text": "Let's watch the news and see what happens.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Tom",
+ "opacity": 0,
+ "startTime": 3.48
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67862d7c5a3e1877d43bdd50.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67862d7c5a3e1877d43bdd50.md
new file mode 100644
index 0000000000..7ddf9d3075
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67862d7c5a3e1877d43bdd50.md
@@ -0,0 +1,98 @@
+---
+id: 67862d7c5a3e1877d43bdd50
+title: Task 122
+challengeType: 22
+dashedName: task-122
+---
+
+
+
+# --description--
+
+This is a review of the entire dialogue you just studied.
+
+# --instructions--
+
+Place the following phrases in the correct spot:
+
+`hard to know`, `big change`, `shut down`, `shock`, `investors`, `money problems`, and `in trouble`.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`Lisa: Hey Tom, have you ever thought about what would happen if TechCorp went out of business?`
+
+`Tom: If TechCorp went out of business, it would be a big BLANK. They work with so many companies. Why do you ask?`
+
+`Lisa: I read they might be having BLANK. If they closed, it would affect a lot of tech companies, wouldn't it?`
+
+`Tom: Yes, it would. If they BLANK, a lot of people would lose their jobs. And their current projects would stop, wouldn't they?`
+
+`Lisa: That's right. If that happened, a lot of smaller companies would be BLANK, too. TechCorp helps fund some of their projects.`
+
+`Tom: True. If that money goes away, those companies might not survive. It would be a BLANK for everyone.`
+
+`Lisa: Do you think they can fix their money problems?`
+
+`Tom: Maybe, but it's BLANK. If they get new BLANK, it might help, but it doesn't look likely.`
+
+`Lisa: I hope they do. If they go out of business, it would change everything.`
+
+`Tom: It definitely would. Let's watch the news and see what happens.`
+
+## --blanks--
+
+`shock`
+
+### --feedback--
+
+This word refers to a sudden and often upsetting surprise that causes strong emotional reactions.
+
+---
+
+`money problems`
+
+### --feedback--
+
+This phrase describes financial difficulties, such as struggling to pay debts, cover expenses, or manage finances effectively.
+
+---
+
+`shut down`
+
+### --feedback--
+
+This phrase means to close a business or stop operations permanently, often due to financial or operational challenges.
+
+---
+
+`in trouble`
+
+### --feedback--
+
+This means facing difficulties or problems, often requiring urgent attention or help to resolve.
+
+---
+
+`big change`
+
+### --feedback--
+
+This refers to a significant or impactful difference in a situation, often affecting people's routines, lives, or environments.
+
+---
+
+`hard to know`
+
+### --feedback--
+
+This phrase means it is difficult to determine or predict something because there isn't enough information or clarity.
+
+---
+
+`investors`
+
+### --feedback--
+
+These are people or organizations that provide money to a business or project in exchange for a potential profit or return.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67863e4b91b5617a6a7dedb1.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67863e4b91b5617a6a7dedb1.md
new file mode 100644
index 0000000000..2bca565d61
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67863e4b91b5617a6a7dedb1.md
@@ -0,0 +1,67 @@
+---
+id: 67863e4b91b5617a6a7dedb1
+title: Task 123
+challengeType: 19
+dashedName: task-123
+---
+
+
+
+# --instructions--
+
+Read the text and answer the question below.
+
+# --questions--
+
+## --text--
+
+A magazine decided to write an article on the potential impact of TechCorp's financial troubles.
+
+`TechCorp on the Brink: A Collapse That Could Shake the Industry`
+
+`The possible collapse of TechCorp, a big company in the tech industry, has caused serious worries. If the company goes out of business, it could cause big problems for the whole sector. TechCorp partners with numerous firms, and its closure would stop key projects and lead to many job losses.`
+
+`Smaller companies that depend on TechCorp's funding would be particularly vulnerable. Without that support, many could struggle to survive. While new investments could help, it doesn't seem very likely.`
+
+`For now, the industry waits anxiously, hoping for a change that could stop more problems from spreading.`
+
+Why is TechCorp's potential collapse a concern for the tech industry?
+
+## --answers--
+
+Because it is no longer relevant in the industry.
+
+### --feedback--
+
+The text describes TechCorp as a major player, not irrelevant.
+
+---
+
+Because it doesn't have any partnerships.
+
+### --feedback--
+
+The text emphasizes that TechCorp has numerous partnerships, making its collapse significant.
+
+---
+
+Because it could cause big problems through the sector.
+
+---
+
+Because it only works with smaller companies.
+
+### --feedback--
+
+The text mentions that TechCorp works with many firms, not just smaller ones.
+
+## --video-solution--
+
+3
+
+# --explanation--
+
+
+The article describes TechCorp as a `big company` in the tech industry. Its potential collapse could cause `big problems for the whole sector`, disrupting numerous partnerships and leading to job losses. This highlights the critical role TechCorp plays in the industry, and its downfall would have far-reaching consequences.
+
+Focus on how the article emphasizes TechCorp's partnerships and its central position in the tech industry as reasons for concern.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678640bb149d137b27346d9e.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678640bb149d137b27346d9e.md
new file mode 100644
index 0000000000..0523d1d928
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678640bb149d137b27346d9e.md
@@ -0,0 +1,66 @@
+---
+id: 678640bb149d137b27346d9e
+title: Task 124
+challengeType: 19
+dashedName: task-124
+---
+
+
+
+# --instructions--
+
+Read the text and answer the question below.
+
+# --questions--
+
+## --text--
+
+A magazine decided to write an article on the potential impact of TechCorp's financial troubles.
+
+`TechCorp on the Brink: A Collapse That Could Shake the Industry`
+
+`The possible collapse of TechCorp, a big company in the tech industry, has caused serious worries. If the company goes out of business, it could cause big problems for the whole sector. TechCorp partners with numerous firms, and its closure would stop key projects and lead to many job losses.`
+
+`Smaller companies that depend on TechCorp's funding would be particularly vulnerable. Without that support, many could struggle to survive. While new investments could help, it doesn't seem very likely.`
+
+`For now, the industry waits anxiously, hoping for a change that could stop more problems from spreading.`
+
+How might TechCorp's closure affect its partners?
+
+## --answers--
+
+It would help them grow.
+
+### --feedback--
+
+The text states that TechCorp's closure would negatively affect its partners, not benefit them.
+
+---
+
+It would stop key projects and lead to many job losses.
+
+---
+
+It would have no impact.
+
+### --feedback--
+
+The text highlights significant consequences for TechCorp's partners.
+
+---
+
+It would bring new investors to its partners.
+
+### --feedback--
+
+The text does not suggest that TechCorp's partners would gain new investors.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+The article states that TechCorp's closure would `stop key projects` and lead to `lead to many job losses` among its partners. This demonstrates how connected TechCorp is with other firms in the tech industry, and how its collapse would disrupt ongoing work and affect employees.
+
+Focus on how the article links TechCorp's role to its partners' stability and operations.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678641e4a1acd27bba24cd24.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678641e4a1acd27bba24cd24.md
new file mode 100644
index 0000000000..fd99de454f
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/678641e4a1acd27bba24cd24.md
@@ -0,0 +1,66 @@
+---
+id: 678641e4a1acd27bba24cd24
+title: Task 125
+challengeType: 19
+dashedName: task-125
+---
+
+
+
+# --instructions--
+
+Read the text and answer the question below.
+
+# --questions--
+
+## --text--
+
+A magazine decided to write an article on the potential impact of TechCorp's financial troubles.
+
+`TechCorp on the Brink: A Collapse That Could Shake the Industry`
+
+`The possible collapse of TechCorp, a big company in the tech industry, has caused serious worries. If the company goes out of business, it could cause big problems for the whole sector. TechCorp partners with numerous firms, and its closure would stop key projects and lead to many job losses.`
+
+`Smaller companies that depend on TechCorp's funding would be particularly vulnerable. Without that support, many could struggle to survive. While new investments could help, it doesn't seem very likely.`
+
+`For now, the industry waits anxiously, hoping for a change that could stop more problems from spreading.`
+
+What could happen to smaller companies if TechCorp closes?
+
+## --answers--
+
+They would become industry leaders.
+
+### --feedback--
+
+The text suggests smaller companies would be vulnerable, not grow stronger.
+
+---
+
+They would be more vulnerable.
+
+---
+
+They would gain new funding.
+
+### --feedback--
+
+The text highlights that funding would be lost, not gained.
+
+---
+
+They would remain unaffected.
+
+### --feedback--
+
+The text specifically mentions smaller companies being particularly vulnerable.
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+The article explains that `Smaller companies that depend on TechCorp's funding would be particularly vulnerable`. Without TechCorp's financial support, these companies could face significant challenges, potentially leading to their closure.
+
+Focus on how the article highlights the dependency of smaller companies on TechCorp for survival.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67864288ddcab97c35fa8955.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67864288ddcab97c35fa8955.md
new file mode 100644
index 0000000000..58e224fb57
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67864288ddcab97c35fa8955.md
@@ -0,0 +1,66 @@
+---
+id: 67864288ddcab97c35fa8955
+title: Task 126
+challengeType: 19
+dashedName: task-126
+---
+
+
+
+# --instructions--
+
+Read the text and answer the question below.
+
+# --questions--
+
+## --text--
+
+A magazine decided to write an article on the potential impact of TechCorp's financial troubles.
+
+`TechCorp on the Brink: A Collapse That Could Shake the Industry`
+
+`The possible collapse of TechCorp, a big company in the tech industry, has caused serious worries. If the company goes out of business, it could cause big problems for the whole sector. TechCorp partners with numerous firms, and its closure would stop key projects and lead to many job losses.`
+
+`Smaller companies that depend on TechCorp's funding would be particularly vulnerable. Without that support, many could struggle to survive. While new investments could help, it doesn't seem very likely.`
+
+`For now, the industry waits anxiously, hoping for a change that could stop more problems from spreading.`
+
+What solution does the article mention for saving TechCorp?
+
+## --answers--
+
+New investments
+
+---
+
+Government intervention
+
+### --feedback--
+
+The article does not mention government intervention as a solution.
+
+---
+
+Cutting its partnerships
+
+### --feedback--
+
+The article does not suggest that cutting partnerships would save TechCorp.
+
+---
+
+Layoffs
+
+### --feedback--
+
+While the article mentions layoffs as a potential consequence, it does not present them as a solution.
+
+## --video-solution--
+
+1
+
+# --explanation--
+
+The article mentions `new investments` as a potential solution to save TechCorp. However, it also states that it doesn't seem very likely, reflecting the uncertain future of the company.
+
+Focus on how the article presents new investments as a potential lifeline while emphasizing the low probability of securing them.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6786435171664b7cb1724644.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6786435171664b7cb1724644.md
new file mode 100644
index 0000000000..2271a8bbd5
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6786435171664b7cb1724644.md
@@ -0,0 +1,66 @@
+---
+id: 6786435171664b7cb1724644
+title: Task 127
+challengeType: 19
+dashedName: task-127
+---
+
+
+
+# --instructions--
+
+Read the text and answer the question below.
+
+# --questions--
+
+## --text--
+
+A magazine decided to write an article on the potential impact of TechCorp's financial troubles.
+
+`TechCorp on the Brink: A Collapse That Could Shake the Industry`
+
+`The possible collapse of TechCorp, a big company in the tech industry, has caused serious worries. If the company goes out of business, it could cause big problems for the whole sector. TechCorp partners with numerous firms, and its closure would stop key projects and lead to many job losses.`
+
+`Smaller companies that depend on TechCorp's funding would be particularly vulnerable. Without that support, many could struggle to survive. While new investments could help, it doesn't seem very likely.`
+
+`For now, the industry waits anxiously, hoping for a change that could stop more problems from spreading.`
+
+What mood does the article convey about the situation?
+
+## --answers--
+
+Hopeful and optimistic
+
+### --feedback--
+
+The text mentions slim chances for new investments, creating a mood of anxiety rather than optimism.
+
+---
+
+Calm and unconcerned
+
+### --feedback--
+
+The article describes serious concerns and disruption, not calmness.
+
+---
+
+Excited and opportunistic
+
+### --feedback--
+
+The tone of the article is serious, not excited or opportunistic.
+
+---
+
+Anxious and uncertain
+
+## --video-solution--
+
+4
+
+# --explanation--
+
+The article conveys a mood of anxious uncertainty. It describes serious concerns about TechCorp's financial troubles and the potential consequences if the company collapses. The mention of small chances for new investments and the industry waiting anxiously for a change supports this mood.
+
+Focus on how the article's language, like `serious worries` and `hoping for a change`, reflects the industry's unease about the situation.
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67900eeff58f3aba1b5267b0.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67900eeff58f3aba1b5267b0.md
new file mode 100644
index 0000000000..f59a200842
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/67900eeff58f3aba1b5267b0.md
@@ -0,0 +1,116 @@
+---
+id: 67900eeff58f3aba1b5267b0
+title: Task 19
+challengeType: 19
+dashedName: task-19
+---
+
+
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+Sarah agrees with Mark. What would be the best reply what Mark is saying?
+
+## --answers--
+
+`Yeah, it is.`
+
+### --feedback--
+
+This answer doesn't match what Mark is saying. `It is` doesn't make sense when talking about whether the BIOS can stop the computer from starting.
+
+---
+
+`Yeah, it can.`
+
+## --video-solution--
+
+2
+
+# --explanation--
+
+Let's break it down:
+
+What did Mark say? He said the BIOS `prevents the computer from starting.` That means he's talking about what the BIOS **can do** when it's corrupted.
+
+If Sarah agrees, would she talk about what the BIOS **is** or what the BIOS **can do**? The second one, right? That's why `Yeah, it can` is the right choice.
+
+Why is `yeah, it is` wrong? Because `it is` talks about the state of the BIOS, not what it can do. Here's an example:
+
+**Correct**: `Yeah, it can.` – This agrees with Mark's point about what the BIOS can do.
+
+**Incorrect**: `Yeah, it is.` – This doesn't fit because Mark isn't describing what the BIOS `is,` he's talking about its effects.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-center.png",
+ "characters": [
+ {
+ "character": "Mark",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.4
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-1.mp3",
+ "startTime": 1,
+ "startTimestamp": 14.12,
+ "finishTimestamp": 21.06
+ }
+ },
+ "commands": [
+ {
+ "character": "Mark",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Mark",
+ "startTime": 1,
+ "finishTime": 3.44,
+ "dialogue": {
+ "text": "Sometimes if the BIOS is corrupted,",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 3.82,
+ "finishTime": 5.34,
+ "dialogue": {
+ "text": "it prevents the computer from starting.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "startTime": 5.44,
+ "finishTime": 7.94,
+ "dialogue": {
+ "text": "If that's the case, it can be tricky to fix.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Mark",
+ "opacity": 0,
+ "startTime": 8.44
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6794acd2567757780af6a69d.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6794acd2567757780af6a69d.md
new file mode 100644
index 0000000000..34a425205c
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6794acd2567757780af6a69d.md
@@ -0,0 +1,96 @@
+---
+id: 6794acd2567757780af6a69d
+title: Task 56
+challengeType: 22
+dashedName: task-56
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`But I think we are BLANK BLANK here.`
+
+## --blanks--
+
+`pretty`
+
+### --feedback--
+
+This word is often used to mean `fairly` or `quite` in this context. It describes the degree of the condition being discussed.
+
+---
+
+`solid`
+
+### --feedback--
+
+This word means `strong`, `reliable`, or `stable`. It shows that something is in good condition.
+
+# --explanation--
+
+Let's break down the phrase `pretty solid`:
+
+`Pretty` in this context, means `fairly` or `quite`, and it is used to describe the strength or reliability of something. For example:
+
+`The project is pretty successful.` - This means the project is fairly or quite successful.
+
+`Solid`means `strong`, `reliable`, or `stable`. It is often used to talk about something that is dependable or in good condition. For example:
+
+`The team has a solid plan.` - This means the plan is strong and well-prepared.
+
+In Maria's sentence, `pretty solid` means she thinks the system is quite reliable and in good shape.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Maria",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.5
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 12.02,
+ "finishTimestamp": 13.72
+ }
+ },
+ "commands": [
+ {
+ "character": "Maria",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "startTime": 1,
+ "finishTime": 2.7,
+ "dialogue": {
+ "text": "But I think we are pretty solid here.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "opacity": 0,
+ "startTime": 3.2
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6794aeb63a22827b8b29fb52.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6794aeb63a22827b8b29fb52.md
new file mode 100644
index 0000000000..30aed89079
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6794aeb63a22827b8b29fb52.md
@@ -0,0 +1,92 @@
+---
+id: 6794aeb63a22827b8b29fb52
+title: Task 58
+challengeType: 22
+dashedName: task-58
+---
+
+
+
+# --instructions--
+
+Listen to the audio and complete the sentence below.
+
+# --fillInTheBlank--
+
+## --sentence--
+
+`Brian helped us set up a reminder to back up our work daily BLANK BLANK some other tasks.`
+
+## --blanks--
+
+`along`
+
+### --feedback--
+
+This word connects things together. It is often used to show that one thing happens or exists with another.
+
+---
+
+`with`
+
+### --feedback--
+
+This word is used to show that two or more things are connected or done together.
+
+# --explanation--
+
+`Along with` is a phrase used to connect two or more actions, items, or ideas. It means `together with` or `in addition to`.
+
+You use `along with` to add extra information about something that is happening or being done. It shows that one thing is included or combined with another. For Example:
+
+- `She sent an email along with the report.` – This means the email and report were sent together.
+
+- `The event includes lunch along with some fun activities.` – This means lunch and activities are both part of the event.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Maria",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.5
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 13.96,
+ "finishTimestamp": 18.3
+ }
+ },
+ "commands": [
+ {
+ "character": "Maria",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "startTime": 1,
+ "finishTime": 5.34,
+ "dialogue": {
+ "text": "Brian helped us set up a reminder to backup our work daily along with some other tasks.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "opacity": 0,
+ "startTime": 5.84
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6794b0a616662d7d514a689f.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6794b0a616662d7d514a689f.md
new file mode 100644
index 0000000000..6db3623169
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6794b0a616662d7d514a689f.md
@@ -0,0 +1,108 @@
+---
+id: 6794b0a616662d7d514a689f
+title: Task 59
+challengeType: 19
+dashedName: task-59
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What role did Brian play in this situation?
+
+## --answers--
+
+He provided training for daily backups.
+
+### --feedback--
+
+There is no mention of Brian training the team, only that he helped set up reminders.
+
+---
+
+He completed all the tasks by himself.
+
+### --feedback--
+
+Brian supported the team, but Maria did not say he completed all the tasks on his own.
+
+---
+
+He tested the team's system for errors.
+
+### --feedback--
+
+Maria didn't mention anything about Brian testing the system for errors.
+
+---
+
+He assisted the team by setting up helpful reminders.
+
+## --video-solution--
+
+4
+
+# --explanation--
+
+Let's look at how the audio gives you clues to answer the question:
+
+In `Brian helped us`, `helped us` is key to understand Brian's role because it shows that he supported the team. Listen for the word `helped` to understand his role.
+
+`Set up a reminder` tells you exactly what Brian did. He didn't train, test, or complete tasks alone. He focused on organizing tools like reminders to help the team stay on track.
+
+In the audio, focus on words like `helped` and `set up a reminder.` These words give you the best clues about Brian's role.
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Maria",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.5
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 13.96,
+ "finishTimestamp": 18.3
+ }
+ },
+ "commands": [
+ {
+ "character": "Maria",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "startTime": 1,
+ "finishTime": 5.34,
+ "dialogue": {
+ "text": "Brian helped us set up a reminder to backup our work daily along with some other tasks.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "opacity": 0,
+ "startTime": 5.84
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6794b2b7175c5380161ba8c5.md b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6794b2b7175c5380161ba8c5.md
new file mode 100644
index 0000000000..c86d07769b
--- /dev/null
+++ b/curriculum/challenges/italian/24-b1-english-for-developers/learn-how-to-use-conditionals/6794b2b7175c5380161ba8c5.md
@@ -0,0 +1,109 @@
+---
+id: 6794b2b7175c5380161ba8c5
+title: Task 60
+challengeType: 19
+dashedName: task-60
+---
+
+
+
+# --instructions--
+
+Listen to the audio and answer the question below.
+
+# --questions--
+
+## --text--
+
+What can you infer about the tasks mentioned?
+
+## --answers--
+
+They are important and need to be done regularly.
+
+---
+
+They are optional and can be skipped.
+
+### --feedback--
+
+The audio doesn't suggest the tasks are optional. Listen carefully to how Maria emphasizes setting up reminders.
+
+---
+
+They are already completed.
+
+### --feedback--
+
+Maria didn't say the tasks were completed—she mentioned setting up reminders to help manage them.
+
+---
+
+They are related to coding only.
+
+### --feedback--
+
+Maria doesn't specify that the tasks are related to coding. The tasks could involve other types of work.
+
+## --video-solution--
+
+1
+
+# --explanation--
+
+Let's look at how the audio gives you clues to answer the question:
+
+In `set up a reminder`, the word `reminder` tells you the tasks are important. If they weren't, there wouldn't be a need to remember them.
+
+The word `daily` shows that at least one task, backing up work, needs to be done regularly.
+
+These words help you understand that the tasks Maria is talking about are important and need to be done regularly. They're not optional or already completed. They are ongoing and require attention.
+
+
+# --scene--
+
+```json
+{
+ "setup": {
+ "background": "company2-boardroom.png",
+ "characters": [
+ {
+ "character": "Maria",
+ "position": {
+ "x": 50,
+ "y": 0,
+ "z": 1.5
+ },
+ "opacity": 0
+ }
+ ],
+ "audio": {
+ "filename": "B1_7-2.mp3",
+ "startTime": 1,
+ "startTimestamp": 13.96,
+ "finishTimestamp": 18.3
+ }
+ },
+ "commands": [
+ {
+ "character": "Maria",
+ "opacity": 1,
+ "startTime": 0
+ },
+ {
+ "character": "Maria",
+ "startTime": 1,
+ "finishTime": 5.34,
+ "dialogue": {
+ "text": "Brian helped us set up a reminder to backup our work daily along with some other tasks.",
+ "align": "center"
+ }
+ },
+ {
+ "character": "Maria",
+ "opacity": 0,
+ "startTime": 5.84
+ }
+ ]
+}
+```
diff --git a/curriculum/challenges/italian/25-front-end-development/lab-fortune-teller/66c06d618d075c7f7f1b890a.md b/curriculum/challenges/italian/25-front-end-development/lab-fortune-teller/66c06d618d075c7f7f1b890a.md
index 50c8615065..35c3e76122 100644
--- a/curriculum/challenges/italian/25-front-end-development/lab-fortune-teller/66c06d618d075c7f7f1b890a.md
+++ b/curriculum/challenges/italian/25-front-end-development/lab-fortune-teller/66c06d618d075c7f7f1b890a.md
@@ -42,7 +42,7 @@ assert.isNotNull(fortune1);
assert.isString(fortune1);
```
-You should initialize `fortune2` with the a string value.
+You should initialize `fortune2` with a string value.
```js
assert.isNotNull(fortune2);
diff --git a/curriculum/challenges/italian/25-front-end-development/lab-magazine-layout/6735a7370e0ae93a4577c689.md b/curriculum/challenges/italian/25-front-end-development/lab-magazine-layout/6735a7370e0ae93a4577c689.md
index 76e6b39645..039c28cd86 100644
--- a/curriculum/challenges/italian/25-front-end-development/lab-magazine-layout/6735a7370e0ae93a4577c689.md
+++ b/curriculum/challenges/italian/25-front-end-development/lab-magazine-layout/6735a7370e0ae93a4577c689.md
@@ -107,10 +107,13 @@ const magazineCoverStyle = getComputedStyle(document.querySelector('.magazine-co
assert.match(magazineCoverStyle.gridTemplateAreas, /("|')small-article1 small-article2 cover-image\1$/);
```
-Your `.magazine-cover` class should have a `grid-template-columns` property set to `1fr 1fr 1fr`.
+Your `.magazine-cover` selector should use the `grid-template-columns` property to divide the space into three equal parts. Remember you can use either the `repeat` function or manually define each fractional unit.
```js
-assert.equal(new __helpers.CSSHelp(document).getStyle('.magazine-cover')?.gridTemplateColumns, '1fr 1fr 1fr');
+assert.oneOf(
+ new __helpers.CSSHelp(document).getStyle('.magazine-cover')?.gridTemplateColumns,
+ ['1fr 1fr 1fr', 'repeat(3, 1fr)']
+);
```
Your `.magazine-cover` class should have a `grid-template-rows` property set to `auto 1fr 1fr`.
diff --git a/curriculum/challenges/italian/25-front-end-development/lab-reusable-footer/673b02b03134b04637bf7055.md b/curriculum/challenges/italian/25-front-end-development/lab-reusable-footer/673b02b03134b04637bf7055.md
index d7f946044f..b1e76f9a15 100644
--- a/curriculum/challenges/italian/25-front-end-development/lab-reusable-footer/673b02b03134b04637bf7055.md
+++ b/curriculum/challenges/italian/25-front-end-development/lab-reusable-footer/673b02b03134b04637bf7055.md
@@ -25,92 +25,73 @@ demoType: onClick
You should export a `Footer` component.
```js
-const mockedComponent = Enzyme.mount(React.createElement(window.index.Footer));
-assert.lengthOf(mockedComponent.find('Footer'), 1);
+assert.isFunction(window.index.Footer);
```
Your `Footer` component should return a `footer` element.
```js
-assert.equal(
- Enzyme.shallow(React.createElement(window.index.Footer)).type(),
- 'footer'
-);
+const footer = document.getElementById('root').firstElementChild;
+assert.equal(footer.tagName, 'FOOTER');
```
-Your `footer` should have at least three unordered lists.
+Your `Footer` component should only contain a single `footer` element.
```js
-const mockedComponent = Enzyme.shallow(
- React.createElement(window.index.Footer)
-);
-assert.isAtLeast(mockedComponent.find('ul').length, 3);
+assert.lengthOf(document.querySelectorAll('footer'), 1);
+```
+
+Your `footer` element should not have any siblings.
+
+```js
+assert.lengthOf(document.getElementById('root').children, 1);
+```
+
+Your `footer` element should contain at least three unordered lists.
+
+```js
+assert.isAtLeast(document.querySelectorAll('ul').length, 3);
```
Each of your unordered lists should have at least two list items.
```js
-const mockedComponent = Enzyme.shallow(
- React.createElement(window.index.Footer)
-);
-const uls = mockedComponent.find('ul');
+const uls = [...document.querySelectorAll('ul')];
uls.forEach(ul => {
- assert.isAtLeast(ul.find('li').length, 2);
-});
-
-assert.isAtLeast(uls.length, 1);
+ assert.isAtLeast(ul.querySelectorAll('li').length, 2);
+ }
+);
```
Your `footer` should have at least one paragraph element.
```js
-const mockedComponent = Enzyme.shallow(
- React.createElement(window.index.Footer)
-);
-assert.isAtLeast(mockedComponent.find('p').length, 1);
+assert.isAtLeast(document.querySelectorAll('p').length, 1);
```
You should have a copyright (`©`) symbol within one of your paragraphs.
```js
-const mockedComponent = Enzyme.shallow(
- React.createElement(window.index.Footer)
-);
-let hasCopyright = false;
-mockedComponent.find('p').forEach(p => {
- if (p.text().includes('©')) {
- hasCopyright = true;
- }
-});
+const texts = [...document.querySelectorAll('p')].map(p => p.textContent);
+const hasCopyright = texts.some(text => text.includes('©'));
assert.isTrue(hasCopyright);
```
Your `footer` should have at least three links with the `href` value set to `#`.
```js
-const mockedComponent = Enzyme.shallow(
- React.createElement(window.index.Footer)
-);
-assert.isAtLeast(mockedComponent.find('a[href="#"]').length, 3);
+const links = document.querySelectorAll('a[href="#"]');
+assert.isAtLeast(links.length, 3);
```
None of your links should be empty.
```js
-const mockedComponent = Enzyme.shallow(
- React.createElement(window.index.Footer)
+const links = [...document.querySelectorAll('a[href="#"]')];
+links.forEach(link => {
+ assert.isNotEmpty(link.textContent);
+ }
);
-mockedComponent.find('a').forEach(a => {
- assert.isAtLeast(a.text().length, 1);
-});
-assert.isAtLeast(mockedComponent.find('a').length, 1);
-```
-
-Your `Footer` component should be rendered to the page's `#root` element.
-
-```js
-const mockedComponent = Enzyme.mount(React.createElement(window.index.Footer));
-assert.equal(mockedComponent.html(), document.getElementById('root').innerHTML);
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/lab-travel-agency-page/669e2f60e83c011754f711f9.md b/curriculum/challenges/italian/25-front-end-development/lab-travel-agency-page/669e2f60e83c011754f711f9.md
index eebb8c2293..8848133243 100644
--- a/curriculum/challenges/italian/25-front-end-development/lab-travel-agency-page/669e2f60e83c011754f711f9.md
+++ b/curriculum/challenges/italian/25-front-end-development/lab-travel-agency-page/669e2f60e83c011754f711f9.md
@@ -247,7 +247,7 @@ for (let image of images) {
}
```
-Each `a` element should have an `href` attribute with the value of `https://www.freecodecamp.org/learn`.
+Each `a` element should have an `href` attribute with the value of `https://www.freecodecamp.org/learn`. Don't forget the links in the list items.
```js
const anchors = document.querySelectorAll('a');
@@ -257,7 +257,7 @@ for (let anchor of anchors) {
}
```
-Each `a` element should have a `target` attribute with the value of `_blank`.
+Each `a` element should have a `target` attribute with the value of `_blank`. Don't forget the links in the list items.
```js
const anchors = document.querySelectorAll('a');
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-browsing-the-web-effectively/672aa5bd69657d56ab49ec8a.md b/curriculum/challenges/italian/25-front-end-development/lecture-browsing-the-web-effectively/672aa5bd69657d56ab49ec8a.md
index 09f33cd89f..14577bdaa5 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-browsing-the-web-effectively/672aa5bd69657d56ab49ec8a.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-browsing-the-web-effectively/672aa5bd69657d56ab49ec8a.md
@@ -10,6 +10,36 @@ dashedName: what-are-some-of-the-common-web-browsers-available-today
Watch the video lecture and answer the questions below.
+# --transcript--
+
+What are some of the common web browsers available today, and how do you install one?
+
+Web browsers are applications you use to visit pages on the internet. If you are going through the freeCodeCamp curriculum, there is a very good chance you are using a web browser right now!
+
+As of 2024, the most popular browsers are Microsoft Edge, Firefox, Google Chrome, and Safari. There are quite a few other options, and market shares are always changing, but these four are the most common at this time.
+
+Your operating system most likely comes with a browser installed by default. For Windows, you'd have Microsoft Edge. For Mac, you'd have Safari. For Linux, you'll probably have Firefox.
+
+But what if you want to use a different browser?
+
+The good news is you already have a default browser. So you can navigate to the web page for the browser you want, and download the appropriate installer for your operating system.
+
+When choosing a browser, consider factors like speed, security features, and compatibility with websites you frequently visit.
+
+Some browsers offer unique features. For example, Opera has a built-in VPN, while Brave focuses on privacy and ad-blocking.
+
+Installation is usually straightforward. After downloading the installer, simply run it and follow the on-screen instructions.
+
+Most browsers will offer to import your bookmarks and settings from your current default browser, making the transition easier.
+
+Alternatively, you can install a browser through your operating system's package manager, such as `brew install --cask google-chrome` on macOS with Homebrew, or `yay -S brave-bin` on Arch Linux.
+
+The package manager and package names available to you will vary depending on your operating system.
+
+Remember, you're not limited to just one browser. Many people use different browsers for different purposes – perhaps one for work and another for personal browsing.
+
+Feel free to experiment with different browsers to find what works best for you.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-browsing-the-web-effectively/672ac96491845f43ea9a26d7.md b/curriculum/challenges/italian/25-front-end-development/lecture-browsing-the-web-effectively/672ac96491845f43ea9a26d7.md
index 1a0f454faa..5142d178b7 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-browsing-the-web-effectively/672ac96491845f43ea9a26d7.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-browsing-the-web-effectively/672ac96491845f43ea9a26d7.md
@@ -10,6 +10,44 @@ dashedName: what-is-the-difference-between-a-web-browser-a-website-and-a-search-
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What is the difference between a web browser, a website, and a search engine?
+
+Web browsers are software applications that allow users to access and navigate the World Wide Web. They interpret and display web content, including text, images, videos, and interactive elements.
+
+Key features of web browsers include the address bar, where you enter URLs or search queries, and the rendering engine, which translates HTML, CSS, and JavaScript into visual web pages.
+
+Browsers also offer bookmarks to save and organize favorite websites, extensions to enhance functionality, and various privacy and security features such as pop-up blockers and private browsing modes.
+
+Popular web browsers include Google Chrome, Mozilla Firefox, Microsoft Edge, Safari, and Opera.
+
+Websites, on the other hand, are collections of web pages and related content that are identified by a common domain name and published on at least one web server. They are the destinations you visit using your web browser.
+
+Components of websites include the domain name, which is the unique address of the website (like freecodecamp.org), and web pages, which are individual documents that make up a website.
+
+Websites also often include multimedia content like images, videos, and audio files that enhance the user experience, as well as interactive elements such as forms and buttons that allow user interaction.
+
+Websites can be static, where content rarely changes, or dynamic, where content updates frequently or is personalized for users.
+
+Search engines are web-based tools designed to help users find information on the internet. They use complex algorithms to index and rank web pages based on relevance to user queries.
+
+Key aspects of search engines include web crawlers, also known as spiders or bots, which are programs that systematically browse the web to discover and index new content.
+
+The indexing process involves organising and storing information about web pages in massive databases.
+
+Search engines also employ ranking algorithms, which are complex systems that determine the order of search results based on factors like relevance, authority, and user experience. Popular search engines include Google, Bing, Yahoo, and DuckDuckGo.
+
+The relationship between browsers, websites, and search engines is interconnected.
+
+Web browsers are the tools used to access both websites and search engines.
+
+Websites are the destinations that users visit through browsers or find via search engines.
+
+Search engines help users discover websites by providing organized access to the vast amount of information on the web.
+
+Understanding these distinctions and relationships is crucial for effective internet use and basic web literacy.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-browsing-the-web-effectively/672ac9705b07a64439b73b59.md b/curriculum/challenges/italian/25-front-end-development/lecture-browsing-the-web-effectively/672ac9705b07a64439b73b59.md
index 135ed5b519..963664de49 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-browsing-the-web-effectively/672ac9705b07a64439b73b59.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-browsing-the-web-effectively/672ac9705b07a64439b73b59.md
@@ -10,6 +10,42 @@ dashedName: how-to-use-a-search-engine-effectively-to-achieve-optimal-results
Watch the lecture video and answer the questions below.
+# --transcript--
+
+How to use a search engine effectively to achieve optimal results?
+
+Searching for information on the Internet can be a daunting task. There are so many websites out there, with so much data, that it may seem impossible to get the results you want.
+
+But thanks to things like boolean search syntax, you can narrow down your search to exactly what you need.
+
+Boolean search syntax is a way to use special words to help you find exactly what you're looking for when searching online.
+
+Here is an example of a basic search query for `freecodecamp curriculum`.
+
+When you search for `freecodecamp curriculum`, the search engine will return results that match *any* of these keywords – typically sorted by relevance (how likely they are to match, or be related to, more of your query).
+
+But what if you only wanted results that matched both keywords? Well, you might have heard that you can wrap a query in quotation marks, like `"freecodecamp curriculum"`.
+
+However, this query specifically matches the *phrase* `freecodecamp curriculum`. This means that the results you will see will be limited to sites that say `freecodecamp curriculum` together, not sites that say `freecodecamp` AND `curriculum`.
+
+If you want to match sites that include both of those terms, but not necessarily next to each other as a phrase, you can prefix each term with a plus symbol like this: `+freecodecamp +curriculum`
+
+Alternatively, maybe you're interested in freeCodeCamp's initiatives outside of the curriculum. In this case, you can prefix the term `curriculum` with a minus symbol like this: `+freecodecamp -curriculum`.
+
+This will return results that mention `freecodecamp`, but exclude results that also mention `curriculum`.
+
+Or maybe you have a specific site you want to search, like our news platform? You can use `site:` followed by the URL of the site you want to search: `site:freecodecamp.org/news curriculum`.
+
+This query returns all results from `freecodecamp.org/news` that contain the word `curriculum`.
+
+By combining these tools, you can come up with very specific queries to get the exact information you need.
+
+For example, the query `site:freecodecamp.org/news +python -curriculum` would search for Python articles on our news site, excluding articles that might talk about our curriculum.
+
+Search operators may vary, so it is always important to check the documentation for your preferred search engine.
+
+But you should now be empowered to get the exact results you want from your web searches.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-html-fundamentals/6708396caa00e11b597b3365.md b/curriculum/challenges/italian/25-front-end-development/lecture-html-fundamentals/6708396caa00e11b597b3365.md
index 37a474eeaf..1154df0acb 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-html-fundamentals/6708396caa00e11b597b3365.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-html-fundamentals/6708396caa00e11b597b3365.md
@@ -2,7 +2,7 @@
id: 6708396caa00e11b597b3365
title: What Is the Role of Open Graph Tags, and How Do They Affect SEO?
challengeType: 11
-videoId: 94IAhyEfO8I
+videoId: Bat8HyGzkU8
dashedName: what-is-the-role-of-open-graph-tags
---
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672aa578a2129554d4675049.md b/curriculum/challenges/italian/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672aa578a2129554d4675049.md
index 96d642737c..ec7e5a02d0 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672aa578a2129554d4675049.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672aa578a2129554d4675049.md
@@ -10,6 +10,44 @@ dashedName: what-are-the-basic-parts-of-a-computer
Watch the video lecture and answer the questions below.
+# --transcript--
+
+What are the basic parts of a computer?
+
+Computers are very powerful machines that perform a variety of tasks like writing documents, playing games, and browsing the internet.
+
+As a developer, it is important to understand the basic inner workings of a computer.
+
+The first major component of a computer would be the motherboard. The motherboard holds all of the memory, connectors, and hard drives that are needed to run the computer. It serves as the main circuit board for the computer.
+
+Inside the computer case of the motherboard, you will find the CPU which stands for Central Processing Unit. The CPU is a processor that is responsible for executing instructions and performing calculations. It is often referred to as the brain of the computer.
+
+The CPU is a small square with a chip that goes into the motherboard's CPU socket. A socket is a place where the CPU is inserted. The CPU processor speed is measured in gigahertz (GHz) and mega-hertz (MHz). Gigahertz is a billion cycles per second and mega-hertz is a million cycles per second.
+
+The next critical component of a computer would be the system's short term memory. This is known as RAM or Random Access Memory. RAM is a temporary storage location for the computer's CPU. Anytime the computer needs to access data quickly, it will use RAM.
+
+The more RAM you have on your computer, the faster it will run and the more programs you can run at the same time. If you are running low on RAM, your computer will run slower and you will notice the difference in performance.
+
+It is important to note that RAM is volatile memory. This means that it is lost when the computer is turned off. This is why it is important to save your work on your computer.
+
+When you do save your files, they are stored on the hard drive. The hard disk drive, or HDD, is a permanent storage location that is used to store data even when the computer is turned off. This is where all of your files and software are stored.
+
+The hard drive is made up of a spinning platter and an arm. The platter is where the data is stored and the arm is used to read and write data to the platter. When you have a faster hard drive, your computer will boot up faster and your programs will run faster.
+
+Another type of data storage would be the Solid State Drive, or SSD for short. SSD is non volatile flash memory and can be used in place of a hard drive. SSDs are faster and smaller than hard drives but hard drives are cheaper and have more storage capacity.
+
+Another key component of a computer is the power supply unit, or PSU. The PSU is responsible for converting the electricity from the wall outlet into a form that the computer can use. It sends the power from the outlet to the motherboard, CPU, and other components of the computer.
+
+Another key component would be the expansion cards. These are cards that are inserted into the motherboard to add additional functionality to the computer. Examples of expansion cards would be the video card, sound card, and network card.
+
+The video card, also known as the Graphics Processing Unit or GPU, is responsible for rendering visuals on the computer screen.
+
+The sound card is responsible for playing sound on the computer speakers.
+
+The network card is responsible for connecting the computer to the internet.
+
+Even though there are many more parts to the computer, these are some basic parts that you should familiarize yourself with.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab82c1a9bbd0e3aabc39d.md b/curriculum/challenges/italian/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab82c1a9bbd0e3aabc39d.md
index 91a1e84380..d70561820e 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab82c1a9bbd0e3aabc39d.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab82c1a9bbd0e3aabc39d.md
@@ -10,6 +10,30 @@ dashedName: how-to-effectively-work-with-your-keyboard-mouse-and-other-pointing-
Watch the lecture video and answer the questions below.
+# --transcript--
+
+How can you effectively work with your keyboard, mouse, and other pointing devices?
+
+Many of you have been used to working with your keyboard and mouse for years on end for a variety of activities like gaming, performing tasks for work, or surfing the web.
+
+But prolonged misuse of these devices can lead to serious health problems down the road.
+
+In this lecture video, we will cover ways to work with your computer’s keyboard and mouse in healthy ways.
+
+The first tip is to be mindful of the mouse grip. When working on serious tasks for work or during intense gaming moments, you may tend to grip the mouse too hard. However, this can lead to serious hand and wrist issues. To prevent this, you want to make sure to hold the mouse gently and keep your fingers nice and relaxed.
+
+The second tip is to consider using an ergonomic keyboard and mouse. These tools are designed to reduce wrist strain by keeping your hands in a more natural position.
+
+While prices for these devices can vary and may be a costly purchase for your current budget, they can be a good investment in your overall long-term health. So, you might consider starting to research an ergonomic keyboard and mouse to use.
+
+Another tip is to keep your mouse the same height as your keyboard. You don't want to have to reach up or down to use the mouse, as this can strain your wrist and arm muscles over time.
+
+You also want to be mindful of your overall posture when sitting at the computer for hours on end. Being slouched over your computer and putting your wrist in an unnatural position at the keyboard will lead to long-term health issues. So, you want to make sure to sit up straight when working at your computer and maintain a healthy and natural wrist position.
+
+The last tip would be to use keyboard shortcuts whenever possible to help minimize typing. There are dozens of shortcuts available for tasks such as navigating the web, navigating around your operating system, working within a code editor, and more. So, it’s best to research some of these keyboard shortcuts and and start incorporating them into your daily computer usage.
+
+As you continue using your mouse and keyboard for upcoming coding projects and other activities, remember to keep these health tips in mind.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab83c4297910eade53c2e.md b/curriculum/challenges/italian/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab83c4297910eade53c2e.md
index 515d189cc8..5efd6cf9a7 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab83c4297910eade53c2e.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab83c4297910eade53c2e.md
@@ -10,6 +10,32 @@ dashedName: what-are-the-different-types-of-internet-service-providers
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What are the different types of internet service providers?
+
+First, what is an internet service provider, or ISP? It’s a company that sells access to the global internet network, essentially. And they come in three different tiers.
+
+The first tier are the giant conglomerate companies, which have the infrastructure to handle most (if not all) of their network traffic independently.
+
+The second tier are the country-wide providers, which sometimes rent access to tier 1 networks but can stand fairly well on their own.
+
+The third tier are the small companies that primarily focus on providing internet to local markets, and rely on larger ISPs to provide their infrastructure.
+
+These providers will offer different types of connections as well.
+
+Fibre optic connections rely on glass or plastic fibres to transmit data via light, resulting in very high connection speeds and data exchange.
+
+Cable connections use the same infrastructure as a cable television provider, which often makes them readily available in many regions.
+
+DSL connections use the infrastructure that landline phone services use. Because of the prevalence of this infrastructure, DSL is available in areas where cable might not be. But it is also frequently a slower option.
+
+Dial-up also uses the phone lines, but requires exclusive connection (disabling the use of the line for phone purposes when connected to the internet). This is a much older technology that has fallen into disuse.
+
+Satellite connections use an array of satellites orbiting the earth to connect various devices across the world. And finally, similar to that, a 5G home internet provider uses the cell tower infrastructure to keep you online.
+
+And that should give you a basic rundown of what types of internet service providers and internet connections are out there!
+
# --questions--
## --text--
@@ -22,7 +48,7 @@ Giant conglomerate companies with independent infrastructure.
### --feedback--
-Oversight organisations may regulate ISPs, but are rarely ISPs themselves.
+Oversight organizations may regulate ISPs, but are rarely ISPs themselves.
---
@@ -30,7 +56,7 @@ Country-wide providers that may rent access to larger networks.
### --feedback--
-Oversight organisations may regulate ISPs, but are rarely ISPs themselves.
+Oversight organizations may regulate ISPs, but are rarely ISPs themselves.
---
@@ -38,11 +64,11 @@ Small companies focusing on local markets.
### --feedback--
-Oversight organisations may regulate ISPs, but are rarely ISPs themselves.
+Oversight organizations may regulate ISPs, but are rarely ISPs themselves.
---
-International organisations overseeing global internet access.
+International organizations overseeing global internet access.
## --video-solution--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab849aa1ef70eefd29364.md b/curriculum/challenges/italian/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab849aa1ef70eefd29364.md
index 8e1b267afd..085ff16bd6 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab849aa1ef70eefd29364.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab849aa1ef70eefd29364.md
@@ -10,6 +10,36 @@ dashedName: what-are-safe-ways-to-sign-into-your-computer
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What are safe ways to sign into your computer?
+
+Many of you have being using computers for a while. But you might not have thought about the safest or most secure ways to sign into your computer.
+
+Whether you are using a Mac or PC, there are many ways to safely sign into your computer.
+
+The first thing you should do is to make sure that your computer is password protected.
+
+For Windows users, start by opening the Start menu and selecting Settings. From there, go to Accounts and then Sign-in options. You can then set up a password for your computer.
+
+*Note: If you encounter any difficulties or are using a different version of Windows, refer to the official Microsoft documentation or support resources for detailed instructions tailored to your specific version.*
+
+When creating your password, make sure it is a long and complex password. You can use a combination of letters, numbers and special characters to make it more secure.
+
+Choosing an easy password like `12345` or `password` is not a good idea. These are easy to guess and can be easily hacked.
+
+Also, do not use passwords based on personal information like your name, birthday, or address. Those are also easy for hackers to guess.
+
+When you create your password, it is also a good idea to setup two-factor authentication (2FA). 2FA serves as an extra layer of security and requires a second form of verification to ensure that the person trying to access the account is indeed the authorized user.
+
+If you are a Mac user, you can click on the Apple menu and then go to system settings. From there you can go to Users & Groups and set up a password for your computer.
+
+Some Mac computers come with a touch ID feature, which is often considered more secure than regular passwords. This feature allows you to sign into your computer using your fingerprint.
+
+For Windows users, the Windows Hello feature offers a more secure way to sign in. It uses biometric methods such as facial recognition or fingerprints for authentication, providing an alternative to traditional passwords.
+
+After you finish watching these set of lecture videos, I urge you to look into these additional security features and set them up on your computer so that you can keep your computer safe and secure.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab8573f32480f192aaae1.md b/curriculum/challenges/italian/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab8573f32480f192aaae1.md
index 0aba68160a..22988e04c5 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab8573f32480f192aaae1.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-understanding-computer-internet-and-tooling-basics/672ab8573f32480f192aaae1.md
@@ -10,6 +10,54 @@ dashedName: what-are-the-different-types-of-tools-professional-developers-use
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What are the different types of tools professional developers use?
+
+Professional developers rely on a variety of tools to increase productivity and code quality. Let's learn about those tools, including the ones that seem very obvious.
+
+The first among the tools is computers. A computer is the primary development environment. It could be a heavy desktop or a portable laptop with either Windows, macOS, or Linux as the operating system.
+
+Professional developers often go for computers with fast processing power and plenty of RAM to handle resource-intensive tasks.
+
+After the computer is a program for writing and editing code right on that computer. That's a code editor or integrated development environment (IDE).
+
+IDEs like Visual Studio, IntelliJ IDEA, JetBrains, and PyCharm provide powerful features like code completion, debugging, and integrated terminal support.
+
+Visual Studio Code (VS Code) is essentially a code editor, but it also provides these functionalities with its rich extension library.
+
+Other code editors are Sublime Text, Atom, Notepad++, and Brackets.
+
+When you write code with code editors and IDEs, you need to track the changes you make to them. The tool that lets you track those changes is a version control system.
+
+Git is the most widely used version control system in the development community.
+
+Platforms like GitHub, GitLab, and Bitbucket provide cloud-based hosting services for your Git repositories. These platforms enable collaboration with other developers, allow you to work on multiple branches, and facilitate the merging of code changes.
+
+Package managers are another critical tool. They help developers simplify the process of adding, updating, and removing libraries and project dependencies.
+
+Examples of popular package managers are:
+
+* NPM, Yarn, and PNPM for JavaScript
+* PIP for Python
+* Composer for PHP
+* Maven for Java
+
+After writing code with different tools, developers test that code to make sure it's working as expected.
+
+For this, developers use testing frameworks like Cypress, Playwright, Selenium, and others. There are also language-specific testing frameworks. Examples are:
+
+* Jest for JavaScript
+* pytest for Python
+* JUnit for Java
+* PHPUnit for PHP
+
+You don't only need to test the code to make sure it's working as expected. You also need to test what the code looks like visually to the end users. Developers use web browsers for this.
+
+Modern browsers like Chrome, Firefox, Edge, and Safari offer developer tools for inspecting HTML, CSS, and JavaScript code. There are also tools for debugging and performance profiling.
+
+These tools help developers test and optimize their web applications across different browsers for the end users.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672aa6c9e379285acca5a2aa.md b/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672aa6c9e379285acca5a2aa.md
index 906f1f1cb1..6a70a954f8 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672aa6c9e379285acca5a2aa.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672aa6c9e379285acca5a2aa.md
@@ -10,6 +10,34 @@ dashedName: what-are-common-design-terms-to-help-you-communicate-with-designers
Watch the video lecture and answer the questions below.
+# --transcript--
+
+What are common design terms to help you communicate with designers?
+
+As a developer, you may need to work closely with designers. If you understand basic design terminology, you'll have a shared vocabulary and you'll be able to participate in the design process more actively. This can make your workflow more efficient and result in a better user experience.
+
+So let's dive in. We'll start with the term layout. Layout is how the visual elements are arranged on a page or screen to communicate a message. These elements may include text, images, and white space. The layout is like the blueprint of a design. Designers must consider the placement, size, and hierarchy of each element.
+
+The term that is closely related to layout is alignment. Alignment is how the elements are placed in relation to one another. Using alignment correctly is helpful for making the design look clean and organized. Designers create visual order by aligning elements along imaginary lines, edges, or a central point.
+
+Great. Now let's talk about composition. Composition is the art of arranging elements to create a harmonious design. It determines how elements like images, text, and shapes relate to each other and contribute to the design in an artistic way. While layout mostly focuses on the placement of the elements, composition also considers the artistic impact that this placement will have in the overall design.
+
+Composition is closely related to concepts of balance. Balance is how the visual weight is distributed within a composition. Designers aim to create an equilibrium through symmetrical or asymmetrical arrangements. A balanced design feels harmonious.
+
+Hierarchy is another important concept that you should know. Hierarchy establishes the order of importance of the elements in a design. It's about making sure the most important information is noticed first. You can implement a visual hierarchy with size, color, contrast, alignment, white space, and even typography.
+
+To create clear distinctions between the elements, you can use contrast. Contrast is helpful for guiding user attention to what you want to emphasize. You can do this through variations in color, size, shape, texture, or any other visual characteristic. Strong contrast is also helpful for improving readability.
+
+Another helpful term is white space. White Space, also known as "negative space", is the empty space in a design. It's the area surrounding the elements. You might be surprised to know that white space is not necessarily white. Actually, it can be space in any color or texture. Its purpose is to improve the readability and enhance the visual hierarchy of a design.
+
+These are general design concepts that you will find very often, but you may also find design terms that are more closely related to software development.
+
+The user interface, also known as UI, is how humans interact with computers. A user interface includes the visual and interactive elements that users can see on their screens, like icons, images, text, menus, links, and buttons.
+
+The user experience, also known as UX, is about how users feel when using a product or service. An application with a well-designed user experience is intuitive, easy to use, efficient, accessible, and enjoyable. The user interface plays a key role in making the user experience as easy and enjoyable as possible, so they are very closely related.
+
+These are some of the common terms that you should know to communicate with designers. With this knowledge, now you can take a more active role in the design process.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baa97f2990e6631d522e7.md b/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baa97f2990e6631d522e7.md
index edb9ff819c..8c2a153704 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baa97f2990e6631d522e7.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baa97f2990e6631d522e7.md
@@ -10,6 +10,38 @@ dashedName: how-do-you-create-good-background-and-foreground-contrast-in-your-de
Watch the lecture video and answer the questions below.
+# --transcript--
+
+How do you create good background and foreground contrast in your designs?
+
+First, you may need to familiarize yourself with contrast. Contrast is the difference between two colors - or how easy it is to tell them apart.
+
+Colors with a higher contrast will be more visually distinct, whereas colors with a lower contrast will be more visually similar. For example, black and white have a very high contrast ratio. Whereas light blue and light purple have less of a contrast.
+
+Of course, in these examples the distinction might be made clearer because of the layout. But what about applying these colors to text? You can have the high contrast black text on a white background. And the low contrast purple text on a blue background.
+
+But how do you determine what is a "good enough" contrast? You can't base it solely on how the text looks to you, as every user will have a different experience. Thankfully, the Web Content Accessibility Guidelines, or WCAG, provide a standard for this.
+
+Text with a contrast ratio of 4.5:1 is considered the AA standard, which is the bare minimum you should follow to be accessible to most users. Text with a contrast ratio of 7:1 is considered the AAA standard, and ensures the best level of accessibility.
+
+There are a number of websites that can check the contrast ratio between two colors, but most browsers will allow you to do this directly in the developer tools on your website.
+
+Let's open the developer tools and inspect the text elements of the example site.
+
+The black text on a white background has a contrast ratio of 21:1, which more than meets the AAA standard. The purple text on a blue background, however, has a contrast ratio of 1.48:1, which does not even meet the AA standard.
+
+How can you fix this? Well, there are three aspects that impact the contrast ratio.
+
+The first is the hue, which represents the general color type, like red, blue, orange. Let's shift to a hue that is further away from blue. In this case, let's use red.
+
+Unfortunately, this change only brought the contrast ratio to 1.49:1, which means you need to change the saturation, or the "amount" of color present. Let's increase the amount of red in the text. That brings us much closer to the goal, with a 3.54:1 contrast ratio.
+
+However, you can potentially get even closer by changing the last value, which is lightness. Lightness represents how much white is present in the color.
+
+Let's decrease the lightness of the red. Now there is a much darker red against the light blue background, which brings the contrast ratio to 10.34:1.
+
+You could continue to adjust the colors to find the balance between the visual effect you want and an accessible contrast ratio. But it is important to remember that accessibility should always take precedence.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baaa62d4b46667a8ac869.md b/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baaa62d4b46667a8ac869.md
index 9f54e1fa1a..c8573e5c85 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baaa62d4b46667a8ac869.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baaa62d4b46667a8ac869.md
@@ -10,6 +10,28 @@ dashedName: what-is-the-importance-of-good-visual-hierarchy-in-design
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What is the importance of good visual hierarchy in design?
+
+Visual hierarchy refers to the way you layout and display the content of your page to guide the viewer's attention.
+
+A strong hierarchy can provide a clear path for the eye to follow, ensuring that the information you convey is consumed in the order that you intended.
+
+Let's consider a basic page layout in which the HTML for the page is semantically correct, but the styling applied does not create a strong visual hierarchy.
+
+If the font size isn't distinct, there is no visible indication of the document flow, although things are separated by headings.
+
+To create a visual hierarchy, you should apply different font sizes to the heading tiers. You could also use something like a "callout box" to highlight a specific section.
+
+Visual hierarchy can also help increase your user conversion. For example, you can take advantage of the callout box to further draw attention to a Call to Action (CTA) button.
+
+With the CTA button being visually tied to the work history section, it guides the user to the vital information and the action you want them to take based on that information.
+
+Finally, your visual hierarchy can be important for conveying other components, like a navigation bar or a footer.
+
+This makes it easier for your users to find the essential information that they may be looking for.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baab2a0c3df66ad987b94.md b/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baab2a0c3df66ad987b94.md
index 4aa66228a4..740be31be1 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baab2a0c3df66ad987b94.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baab2a0c3df66ad987b94.md
@@ -10,6 +10,28 @@ dashedName: how-does-scale-work-in-design
Watch the lecture video and answer the questions below.
+# --transcript--
+
+How does scale work in design?
+
+The "scale" of something refers to its size.
+
+When you're looking at scaling in your web design, you're looking at the size relationships between different elements, and how these elements might adapt to different screen sizes.
+
+Using the correct scale for your elements plays an important role in visual hierarchy. Larger elements will draw more attention, which can guide your users through the content in the way that you want.
+
+For example, the visual separation between a heading and a paragraph draws your reader’s attention, but the scale should be appropriate to get an eye-catching text that pulls your reader to that section.
+
+Scale doesn't apply just to text, though. It's also important for images. And while the scale of a banner image might make sense for a desktop layout, it might be too large on a mobile layout.
+
+By scaling an image down to a more appropriate ratio, you can keep the visual impact while ensuring the information on the site is visible.
+
+Scale is also important for interactivity, and the ability to actually use your website. If the text in a navigation bar is not at an appropriate scale, mobile phone users will have a hard time tapping on the links.
+
+And if you scale it appropriately, you end up with links that are not only easier to read, but easier to click on for your mobile users.
+
+There are many ways that scale is important in your designs. We've covered the basics, so you should now have a fundamental understanding of its importance.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baabf16290b66e6b79a39.md b/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baabf16290b66e6b79a39.md
index 0a966fe5ac..0bbe32cf6f 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baabf16290b66e6b79a39.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baabf16290b66e6b79a39.md
@@ -10,6 +10,44 @@ dashedName: how-does-alignment-work-in-design
Watch the lecture video and answer the questions below.
+# --transcript--
+
+How does alignment work in design?
+
+When you are designing web pages, it is important to create cohesive and visually appealing designs. One way to achieve this is through the use of alignment.
+
+Alignment is the process of arranging text and images in a way that creates a visual connection between elements.
+
+It helps to create a sense of order and organization on the page, making it easier for users to navigate and understand the content.
+
+There are several types of alignment you can use, but the basic ones are:
+
+- left alignment
+- center alignment
+- right alignment
+- justified alignment
+- vertical alignment
+
+Left, right, and center alignments are all subtypes of horizontal alignment, while vertical alignment is used to align elements along a vertical axis.
+
+Let's take a closer look at each type of alignment and how you can use them in your designs.
+
+Left alignment is commonly used with text where each element is aligned to the left margin. Aligning all of the headings and paragraphs on a web page to the left margin makes it easier for the user to read and follow the content.
+
+The opposite of left alignment is right alignment, where each element is aligned to the right margin. This is often used on websites to display additional content like promotional banners or advertisements.
+
+For example, an ad that is aligned to the right margin makes it stand out from the rest of the content on the page but doesn't distract the user from the main content.
+
+Center alignment is where elements are centered on the page. This is often used for headings, logos, and other important elements that you want to draw attention to.
+
+Justified alignment is when text is aligned to both the left and right margins. This is typically used for descriptive passages or articles, and creates a clean and professional look.
+
+The last type of alignment is vertical alignment, which is used to align elements along a vertical axis.
+
+Vertical alignment can be used, for example, for a contact form on a website. Aligning all of the form inputs like the name, email, and message fields along a vertical axis makes it easier for the user to fill out the form.
+
+By using different types of alignment, you can create a sense of order and organization on the page that makes it easier for users to navigate and understand the content.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baacb7f2f446728e77efe.md b/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baacb7f2f446728e77efe.md
index 86b23b4ca3..0eefe09390 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baacb7f2f446728e77efe.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baacb7f2f446728e77efe.md
@@ -10,6 +10,34 @@ dashedName: what-is-the-importance-of-whitespace-in-design
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What is the important of whitespace in design?
+
+White space refers to any type of space around elements like images, text, and buttons. White space is important in design because it helps to create a balance between the elements on the page.
+
+Let's take a look at some examples of how white space can be used effectively in design.
+
+For example, let's consider a call-to-action (CTA) button. CTAs are used to encourage users to take a specific action like signing up for a newsletter or making a purchase.
+
+By using white space effectively, we can help to make a CTA button more prominent and encourage users to click on it.
+
+Now let's take a closer look at the different types of white space.
+
+This first example uses both macro and active white space. Macro white space is the space between larger elements like images, text blocks, and buttons.
+
+Active white space is the space that is intentionally created to help guide the user's eye and draw attention to certain elements on the page.
+
+In contrast to active white space, there is also passive white space. Passive white space is the space that is left over after all the elements on a page have been placed.
+
+Another type of whitespace would be micro white space. This is the space between individual characters in a line of text.
+
+Micro white space is important because it helps to improve readability and legibility, making it easier for users to scan and understand the content.
+
+When designing your web pages, you always want to be mindful of the law of proximity. This law states that elements that are close together are perceived as being related, while elements that are far apart are perceived as being unrelated.
+
+You can use white space to help group related elements together and help navigate users through the content on your page.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baad7bbc4f86762ca173e.md b/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baad7bbc4f86762ca173e.md
index 6e3678f0a1..9c4ea2e5b5 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baad7bbc4f86762ca173e.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baad7bbc4f86762ca173e.md
@@ -10,6 +10,34 @@ dashedName: what-are-best-practices-for-working-with-images-in-your-designs
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What are best practices for working with images in your designs?
+
+Adding images to your websites is a great way to engage your users and increase the visual appeal of your site. But there are a few things to consider when working with images in your designs.
+
+The first thing to consider is creating responsive images. Responsive images are images that scale to fit the size of the screen they are being viewed on. This is important because it ensures that your images look good on all devices, from desktops to mobile phones.
+
+Another thing to consider is the resolution for images. Higher quality images with better resolution have more pixels per inch. Pixels are small squares that make up an image.
+
+Pixels per inch, or PPI, is the number of pixels in one inch of an image. The higher the PPI, the better the image quality.
+
+You want to make sure that your images are high quality and look good on all devices. This means that you should use high resolution images that are optimized for the web.
+
+Another thing to consider is the size of your images and how they fit within the spaces in the layout. You want to make sure that your images are the right size and are not too large or too small.
+
+Using large images that are meant to fit in smaller spaces in the design can slow down your website and make it harder for users to load your site. You want to make sure that your images are the right size and are optimized for the web.
+
+When it comes to image placement, you want to think about balance, hierarchy, and alignment to help ensure your images are optimized for the web.
+
+Balance is the distribution of visual weight in a design. You want to make sure there is a good balance between text and images on the site so it creates a harmonious design.
+
+Hierarchy is the order in which elements are viewed on a page. You want to make sure that images that align with important content are placed higher than images that are less important.
+
+Alignment is the placement of elements in relation to each other. You want to make sure that your images are aligned with the text and other elements on your site so that it creates a cohesive design.
+
+The last thing to consider is accessibility for images. You want to make sure that your images are accessible to all users, including those with visual impairments. This means that you should use alt text for your images so that screen readers can read the text to users who are visually impaired.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baae11d06c867a16f64e1.md b/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baae11d06c867a16f64e1.md
index 868b9face5..0237f75b0a 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baae11d06c867a16f64e1.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-user-interface-design-fundamentals/672baae11d06c867a16f64e1.md
@@ -10,6 +10,33 @@ dashedName: what-is-progressive-enhancement
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What is progressive enhancement?
+
+Progressive enhancement is a design approach that ensures all users, regardless of browser or device, can access the essential content and functionality of an application.
+
+It focuses on delivering a core experience that works for everyone, while offering extra features and improvements to users with more advanced browsers or better internet connections.
+
+The progressive enhancement approach lives by these core principles:
+
+- All core content and basic functionality should be accessible on all browsers
+- All advanced layouts should be provided through external CSS stylesheets
+- All advanced functionality should be provided through external JavaScript files
+- A user's browser preferences should be respected
+
+Using a progressive enhancement approach makes your applications more accessible because all core content and functionality should not be blocked in unsupported environments.
+
+In terms of speed, a progressive enhancement approach can also help improve the performance of your applications.
+
+Those users that are working with slower internet connection speeds will still be able to access the content because the browser will download the necessary resources first.
+
+When it comes to SEO, progressive enhancement can also help improve the visibility of your applications.
+
+Search engines will be able to crawl the content of your applications because the core content is available in the initial HTML response.
+
+While some have criticized this approach deeming that it is not always realistic for applications that rely heavily on JavaScript for their functionality, it is still a good practice to follow when building applications.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672aa58c389eb9565978495d.md b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672aa58c389eb9565978495d.md
index 5e118ee608..ccbb2240dc 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672aa58c389eb9565978495d.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672aa58c389eb9565978495d.md
@@ -10,6 +10,32 @@ dashedName: how-can-you-use-file-management-applications-on-your-computer
Watch the video lecture and answer the questions below.
+# --transcript--
+
+How to use file management applications?
+
+A file management application is a way to easily store, organize, and edit your files on your computer. Whether you use a Mac or Windows computer, there are built-in applications you can use to organize your files.
+
+If you have a Windows computer, the default file manager is the File Explorer. This is used to browse, search, and manage files and folders, as well as perform file operations like copying, moving, and deleting.
+
+To find the File Explorer, you can go to the Start menu or press the Windows logo key on your keyboard.
+
+To pin a folder, you can right click with your mouse and select "Pin". To move a file or folder, you first need to select it, then select "Cut" and then navigate to the new location to paste it.
+
+If you have a Mac computer, the default file manager is the Finder. This provides access to local and remote files, supports file previews, and offers a variety of organizational features like tags and Smart Folders.
+
+To access the Finder on your Mac, go to the Dock at the bottom and click on the Finder icon.
+
+You will notice a sidebar on the left-hand side where your favorite folders are located.
+
+One way to organize your files, is to use tags. To tag a file or folder, you can select the item in the Finder and then right click with your mouse. You will see the "Tags..." option in the dropdown and you can apply a custom colored tag.
+
+To search for tagged items, you can scroll to the bottom of the sidebar and click on the corresponding colored tag, or you can search for the tag by color name in the search field.
+
+Another way to organize your files is to use smart folders. Smart folders are collections of files that are automatically organized based on criteria you set, such as file type, date, or keywords.
+
+Whether you're using File Explorer on Windows or Finder on Mac, these applications provide flexibility to manage your files with features like tags, search, and Smart Folders.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672ac37104dc2530a769e6a4.md b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672ac37104dc2530a769e6a4.md
index 683f59ec45..eff43a863d 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672ac37104dc2530a769e6a4.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672ac37104dc2530a769e6a4.md
@@ -10,6 +10,58 @@ dashedName: what-are-best-practices-for-naming-files-for-web-applications
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What are best practices for naming files for web applications?
+
+As you start to build out your own web applications, you will need to be mindful of what you name your files.
+
+You will want to name your files in a way that is easy to understand and maintain.
+
+Let's take a look at some examples of good and bad file names for HTML files. Note that the `.html` extension in these examples tells us that this is an HTML file.
+
+Here is an example of a bad file name:
+
+```md
+index1234.html
+```
+
+By the name alone, it is not clear what the file is about. This file could be for a products page, blog page, or any other type of page but we don't know that from the file name.
+
+Here is an example of a better file name for an HTML file:
+
+```md
+about-us.html
+```
+
+By using a more descriptive name like `about-us.html`, it is clear what the file is about.
+
+You will also notice in this file name that there are no spaces. Instead, you use a hyphen, `-`, to separate the words.
+
+Sometimes you might see a file name called `index.html`. This is a special file name that is used to represent the main page of a website. When you visit a website, the `index.html` file is the first file that is loaded.
+
+Another important consideration when naming files is the use of special characters.
+
+Using a mixture of special characters, numbers, and letters can make it difficult to understand what the file is about.
+
+Here is an example of a bad file name:
+
+```md
+file-1!@.html
+```
+
+This name looks unnecessarily complicated and does not give us any information about what the file is about.
+
+So it is best to stick with only using letters and dashes in your file names.
+
+As you start to learn more languages, you will see that there are common conventions for naming files in those languages as well.
+
+In these situations, it is always best to consult with official documentation or other resources to understand the best practices for naming files in that language.
+
+Also you will be in situations where you are working on a team and you will need to follow the conventions that the team has established for naming files.
+
+Always consult with the team's style guide to make sure your file names are consistent with the rest of the team.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672ac39a22b0cc30eb8fd65e.md b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672ac39a22b0cc30eb8fd65e.md
index 9f46d28c0f..d918513227 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672ac39a22b0cc30eb8fd65e.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672ac39a22b0cc30eb8fd65e.md
@@ -10,6 +10,54 @@ dashedName: what-are-best-practices-for-file-folder-organization-in-web-applicat
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What are best practices for file and folder organization in web applications?
+
+When building out web applications, it is important to think about the organization of your files and folders. This will help keep your code organized and easier to maintain.
+
+Let's take a look at an example folder structure for an HTML and CSS project:
+
+```bash
+.
+├── /assets
+│ ├── /images
+│ │ ├── logo.png
+│ │ ├── banner.jpg
+│ │ └── icons.svg
+│ ├── /fonts
+│ │ ├── custom-font.woff
+│ │ └── custom-font.woff2
+├── /css
+│ ├── main.css
+│ ├── about.css
+│ └── contact.css
+├── index.html
+├── about.html
+├── contact.html
+└── README.md
+```
+
+At the top of the example, there is a single dot, which represents the root directory.
+
+The root directory is the top-level directory in a file system, serving as the starting point for all file paths and containing all other directories and files. A directory is another name for a folder.
+
+Inside the root directory, the first directory shown is the `assets` directory. The term `assets` refers to any files that are used in the project, such as images, fonts, or other resources.
+
+In this example, there are two directories inside the `assets` directory called `images` and `fonts`.
+
+The next directory would be the `css` directory. Sometimes this is also referred to as a stylesheets directory. This is where you would store all of your CSS files.
+
+Below the `css` directory are the HTML files. The `index.html` file represents the homepage, while `about.html` and `contact.html` represent the About and Contact pages, respectively.
+
+Lastly, there is a `README.md` file. `README` files are commonly used to provide useful information about the project, such as what it does, how to use it, and any other relevant details.
+
+The `.md` extension stands for Markdown, which is a lightweight markup language that is often used to write documentation.
+
+By organizing your project into assets, CSS, and HTML files, it makes it easy to find what you are looking for. This also makes it easy for other developers to contribute to your project.
+
+It is important to note that this is just one example of how you can organize your files and folders. There are many different ways to structure a project.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672ac3c5d0e9fd31835ff772.md b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672ac3c5d0e9fd31835ff772.md
index a06c421fc9..881b1f0662 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672ac3c5d0e9fd31835ff772.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672ac3c5d0e9fd31835ff772.md
@@ -10,6 +10,74 @@ dashedName: how-to-create-move-and-delete-files-and-folders-using-explorer-finde
Watch the lecture video and answer the questions below.
+# --transcript--
+
+How to create, move, and delete files and folders using the Explorer or Finder?
+
+To create a file on Windows using the Explorer, you can click on the "New" option at the top right. This will show you a list of the different types of files that you can create.
+
+You can also create files in their corresponding applications. Let's create a text file to show you the process.
+
+When you click on "New" and select the file type, you will see a new text file in your current folder with a default name. You can rename it if you'd like.
+
+The process of creating folders is exactly the same. Click the "New" button at the top right and then select the "Folder" option or right-click on an empty spot and go to "New." Then, select the "Folder" option. You'll see a new empty folder in your current location.
+
+You can rename files and folders by selecting them and clicking on the "Rename" option at the top. When current name of the file is highlighted, you can start writing the new name of the file. Press Enter to confirm the changes.
+
+Alternatively, you can right-click on the file or folder and select the "Rename" option or use the F2 keyboard shortcut. Write the new name and press Enter to confirm the changes.
+
+You can move a file or folder to another folder by dragging and dropping it into the destination folder, if you have it opened it as a tab.
+
+You can also select the file or folder and select the "Cut" option at the top.
+
+Then, go to the destination folder and paste it by clicking the "Paste" button at the top. If you copied or cut the file previously, this button will be enabled.
+
+You can also do this by right-clicking on an empty spot and then clicking on the paste icon. This will remove the file or folder from its original location.
+
+To delete a file or folder, click on it and then click on the Trash icon at the top. You will also find a "Delete" option if you right-click on it.
+
+Great. Now let's see how you can do this on macOS using Finder.
+
+Finder is the default file manager on macOS.
+
+To create a file on macOS, you need to open an application that lets you create the type of document that you need to create. Currently, there isn't a built-in way to create a file directly on Finder.
+
+For example, to create a simple plain text file, you can open TextEdit and save your file. The process works exactly the same for any type of file.
+
+There are many ways to open TextEdit. One of them is to go to Launchpad. Then, search for an app where you can create the type of file that you're interested in. In this case, that would be "TextEdit." Click on the icon to open the app.
+
+Once you are inside the app, you should see an option to save your file in the App menu. This menu is located at the top-right, next to the Apple menu icon.
+
+In one of the App menu options, you should see a command to save the file. This is usually under the File menu.
+
+Next to it, you will see the keyboard shortcut for saving your file. This is usually `Command + S` on macOS.
+
+When you are saving the file for the first time, you should see a dialog window, where you can write the name of the file and choose a location.
+
+Usually, the file extension is added by the application automatically but you can change it before saving the file.
+
+After saving the file, you can open Finder by clicking on the Finder icon in the Dock. You should see your new file in the folder where you saved it.
+
+To create a new folder, you should go to the location where you want to create that new folder and rick-click on an empty spot. You will see a list of options. The first option is "New Folder."
+
+If you click on it, you can assign a name to your new folder. Write the name and press Enter to confirm.
+
+There are multiple ways to move files and folders in Finder. If you need to move them to a folder listed in your Finder "Favorites" section, you can just drag and drop it.
+
+If you need to move it to a different folder, you have two options.
+
+You can either open the destination folder as a tab and drag and drop the file or folder into the tab.
+
+Or you can use keyboard shortcuts. First, copy the file with `Command + C`, go to the new folder, and then use `Command + Option + V` to paste the file or folder in that location. This will also remove it from the original folder.
+
+To delete a file or folder, you can right-click on it and select "Move to trash."
+
+You can also drag and drop them into the trash icon on the Dock. This is equivalent.
+
+When the file or folder is in the trash can, you can right-click on it to delete it immediately or you can empty the trash to remove all the deleted files and folders permanently.
+
+Knowing how to create, move, and delete files and folders on Windows and macOS is very important. By mastering these skills, you can organize your files, locate them quickly, and free up storage on your computer by deleting unnecessary files.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672ac3f129efbf327742eb33.md b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672ac3f129efbf327742eb33.md
index edb1dbb4b7..effaff66d2 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672ac3f129efbf327742eb33.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672ac3f129efbf327742eb33.md
@@ -10,6 +10,42 @@ dashedName: how-to-search-for-files-and-folders-on-your-computer
Watch the lecture video and answer the questions below.
+# --transcript--
+
+How to search for files and folder on your computer?
+
+Let's learn how to search for files and folders on Windows and macOS.
+
+We'll start with Windows. You can search from the Taskbar or from the File Explorer.
+
+To search from the Taskbar, write the name of the file or folder that you are looking for. You can also search for keywords. You'll see results from across your PC and OneDrive.
+
+If you only want to see documents, you can click on the "Documents" tab. You also have tabs for apps and web results.
+
+Another alternative is to use the Search File Explorer. You will find it at the top right of the Explorer window, where you can see "Search Documents."
+
+You have three options to define the scope of the search:
+
+- You can search from Home to find files from your PC and from the cloud quickly.
+
+- You can search from a folder to find files stored inside it.
+
+- You can search from This PC for a slow but in-depth search.
+
+This is how you can search for files and folders on Windows. Now let's see how you can do this on macOS.
+
+First, you can use Spotlight, a tool that helps you find files on your Mac. To open Spotlight, go to your menu bar at the top right and find the magnifying glass icon. If you don't see this icon on the menu bar, you can add it in the Control Center settings.
+
+Go to your settings, filter by "Control Center", click on this option and then scroll down until you find the "Spotlight" option. You can also use a keyboard shortcut to open Spotlight: `Command + Spacebar`.
+
+When you open Spotlight, you'll see the Spotlight Search, where you can search for any file or folder by typing its name. When you start typing, you'll see the results grouped by category, including suggestions, folders, presentations, photos, documents, and related searches.
+
+You can also expand a specific category by clicking on "Show More."
+
+Another way to search for files that you have recently opened is to open Finder by click on the Finder icon in the Dock. Then, go to "Recents" in the Finder sidebar. And there, you'll find all the files that you've recently viewed.
+
+This is how you can search for files and folders on macOS. With these search tools, you can optimize your workflow and find the files and folders you need very quickly.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672ac403a9ba7732b31c6480.md b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672ac403a9ba7732b31c6480.md
index 025f69cab1..f35d416a40 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672ac403a9ba7732b31c6480.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-file-systems/672ac403a9ba7732b31c6480.md
@@ -10,6 +10,62 @@ dashedName: what-are-some-common-file-types-you-will-work-with-in-web-applicatio
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What are some common file types used in web applications?
+
+Files are classified based on their content and structure. The file type determines how a file is opened and processed by computer programs.
+
+We identify file types based on their extensions. A file extension is a three or four letter suffix at the end of the file name. The three main file types that you will find in web applications are HTML, CSS, and JavaScript.
+
+HTML files contain the structure and content of the web application. They have a `.html` file extension.
+
+CSS files define the styles. They have a `.css` file extension.
+
+And JavaScript files add more advanced functionality and interactivity. They have a `.js` file extension.
+
+As you develop web applications, you will also need to include images. These are some of the most widely used image file types.
+
+JPEG, which stands for "Joint Photographic Experts Group," is known for its efficient compression. It's great for photographs and images. However, the compression is lossy, which means that some image quality is lost to reduce the file size.
+
+PNG, which stands for "Portable Network Graphics," preserves image quality, even after compression. This results in larger files. PNG supports transparency and it's great for images with sharp edges, like logos and icons.
+
+The GIF image format supports both animation and transparency but has a limited color palette. GIF stands for "Graphics Interchange Format."
+
+And finally, we have SVG, which stands for "Scalable Vector Graphics." It's a vector image format. These images can be scaled as much as needed without losing quality.
+
+Great. Now that you know about image formats, let's see some video and audio formats.
+
+MP3 is an audio format known for its efficient compression. It's a lossy format, so some audio data is lost during the compression to make these files smaller.
+
+MP4 is one of the most common video formats. It offers good compression and supports multiple audio and video codecs, subtitles, and metadata.
+
+MOV, the QuickTime multimedia file format developed by Apple, is primarily associated with QuickTime Player.
+
+Other popular audio and video file types are WAV, a lossless audio format that keeps the original quality of the audio, and WebM, a high-quality open-source video format.
+
+If you ever need to customize the fonts of your web application, you will also work with font formats. These are three of the most widely used ones.
+
+TTF, which stands for "TrueType Font", is a font format compatible with different operating systems.
+
+WOFF is a modern font format, specifically designed for web development purposes. It stands for "Web Open Font Format". These files are smaller because they have better compression. They can also store metadata, including licensing information.
+
+And WOFF2 is the successor of WOFF with even more efficient compression and performance.
+
+You can also create archive files if you need to group multiple folders and files. The most widely used archive format is ZIP. ZIP offers lossless compression, so no data is lost during the process. It's widely supported across operating systems and software applications.
+
+And finally, let's talk about documentation. In web applications, you will usually find a file called `README` that contains information about the application, like how to use it, how to install it, its license, and how to contribute.
+
+They are usually written in a file format called Markdown. With Markdown, you can create structured documents with headings, subheadings, links, images, lists, and more. Markdown files have a `.md` or `.markdown` extension.
+
+Here you can find the `README` file of freeCodeCamp's GitHub repository: https://github.com/freeCodeCamp/freeCodeCamp/blob/main/README.md
+
+You can create this detailed structure and format using Markdown.
+
+You will definitely read and write many `README` files throughout your career. Learning about these common file types is essential for web development.
+
+From the core building blocks of HTML, CSS, and JavaScript to image, video, and audio formats, every file type has an important role in creating interactive web applications.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-links/6716744f7245947a3dd60009.md b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-links/6716744f7245947a3dd60009.md
index 950d3b1275..914d95482a 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-links/6716744f7245947a3dd60009.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-links/6716744f7245947a3dd60009.md
@@ -10,6 +10,30 @@ dashedName: what-are-the-different-target-attribute-types
Watch the video and answer the questions below.
+# --transcript--
+
+What are the different `target` attribute types, and how do they work?
+
+You may have seen the `target` attribute on anchor elements, or links. This important attribute tells the browser where to open the URL for the anchor element:
+
+```html
+Visit freeCodeCamp
+```
+
+There are four important possible values for this attribute. Note that each value is preceded by an underscore.
+
+The first value is `_self`, which is the default value. This opens the link in the current browsing context. In most cases, this will be the current tab or window.
+
+The second value is `_blank`, which opens the link in a new browsing context. Typically, this will open in a new tab. But some users might configure their browsers to open a new window instead.
+
+The third value is `_parent`, which opens the link in the parent of the current context. For example, if your website has an `iframe`, a `_parent` value in that `iframe` would open in your website's tab/window, not in the embedded frame.
+
+The fourth value is `_top`, which opens the link in the top-most browsing context - think "the parent of the parent". This is similar to `_parent`, but the link will always open in the full browser tab/window, even for nested embedded frames.
+
+There is a fifth value, called `_unfencedTop`, which is currently used for the experimental FencedFrame API. At the time of this video, you probably won't have a reason to use this one yet.
+
+Selecting the right `target` value to control where your users end up is an important consideration when creating a website.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-links/671682dd88e461a8e2620f38.md b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-links/671682dd88e461a8e2620f38.md
index 7bc6e9ff7d..e663d54571 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-links/671682dd88e461a8e2620f38.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-links/671682dd88e461a8e2620f38.md
@@ -10,6 +10,69 @@ dashedName: what-is-the-difference-between-absolute-and-relative-paths
Watch the video and answer the questions below.
+# --transcript--
+
+What is the different between absolute and relative paths?
+
+A path is a string that specifies the location of a file or directory in a file system. In web development, paths let developers link to resources like images, stylesheets, scripts, and other web pages. There are absolute and relative paths - both are essential when specifying file locations within a file system. Let's look at the two so you can decide which one of them to use and when.
+
+An absolute path is a complete link to a resource. It starts from the root directory, includes every other directory, and finally the filename and extension. The "root directory" refers to the top-level directory or folder in a hierarchy.
+
+An absolute path also includes the protocol - which could be `http`, `https`, and `file` and the domain name if the resource is on the web. Here's an example of an absolute path that links to the freeCodeCamp logo:
+
+```html
+
+ View fCC Logo
+
+```
+
+In this example, the protocol is `https`, the domain name is `design-style-guide.freecodecamp.org`, and the filename is `fcc_secondary_small.svg`.
+
+Now, what if the resource you want to link to using an absolute path is on your local machine? Here's how to link to the `about.html` file with an absolute path:
+
+```html
+
+ Read more on the
+ About Page
+
+```
+
+It looks like this because we are going into a folder called `Users`, then into a folder called `user`, then into a folder called `Desktop`, then into a folder called `fCC`, then into a folder called `script-code`, then into a folder called `absolute-vs-relative-paths`, then into a folder called `pages` to finally get the `about.html` file.
+
+Here's what the absolute URL looks like in the browser address bar:
+
+```sh
+file:///Users/user/Desktop/fCC/script-code/absolute-vs-relative-paths/pages/about.html
+```
+
+The URL includes the protocol, `file://`. It also include the path, which looks like this: `/Users/user/Desktop/fCC/script-code/absolute-vs-relative-paths/pages/`, and represents the series of folders that lead to the file. And finally, it also includes the `about.html`, which is the filename and the extension.
+
+Now, lets look at the relative path. A relative path specifies the location of a file relative to the directory of the current file. It does not include the protocol or the domain name, making it shorter and more flexible for internal links within the same website. Here's an example of linking to the `about.html` page from the `contact.html` page, both of which are in the same folder:
+
+```html
+
+ Read more on the
+ About Page
+
+```
+
+So imagine you are on the `contact.html` page, and because the `about.html` page is in the same place, you simply get the filename. This is an example of using a relative file path.
+
+So, which should you use and when; an absolute path or a relative path? Here are the rules you should follow:
+
+- Use absolute paths when linking to a resource hosted on an external website.
+
+- Use absolute paths when you need the link to a page or resource to work consistently regardless of the document location within the site.
+
+- Use relative paths when linking to resources within the same website.
+
+- Use relative paths if you want to keep your code cleaner and easier to maintain during development.
+
+- Use relative paths during local testing to ensure links work without an internet connection.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-links/6716830dbaf95da9564f2e3b.md b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-links/6716830dbaf95da9564f2e3b.md
index 9327a2725c..ff8d9357a9 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-links/6716830dbaf95da9564f2e3b.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-links/6716830dbaf95da9564f2e3b.md
@@ -1,6 +1,6 @@
---
id: 6716830dbaf95da9564f2e3b
-videoId: GTgzy4wPXcM
+videoId: 5EfMkiLB9BA
title: What Is the Difference Between Slashes, a Single Dot, and Double Dot in Path Syntax?
challengeType: 11
dashedName: what-is-the-difference-between-slashes-a-single-dot-and-double-dot-in-path-syntax
@@ -10,6 +10,30 @@ dashedName: what-is-the-difference-between-slashes-a-single-dot-and-double-dot-i
Watch the video and answer the questions below.
+# --transcript--
+
+You may have seen links like `/public/logo.png`, `./script.js`, or `../styles.css` before. But what do these special types of links mean? These are called file paths. There are three key syntaxes to know. First is the slash, which can be a backslash (`\`) or forward slash (`/`) depending on your operating system. The second is the single dot (`.`). And finally, we have the double dot (`..`).
+
+The slash is known as the "path separator". It is used to indicate a break in the text between folder or file names. This is how your computer knows that `naomis-files/` points to a directory of that same name, while `naomis/files/` points to a `files` directory in the `naomis` directory.
+
+A single dot points to the current directory, and two dots point to the parent directory. You will typically see a single dot used to ensure that the path is recognized as a relative path. Remember that you learned in a previous lecture about relative versus absolute paths before.
+
+Double dots, however, are much more common to access files outside of the current working directory.
+
+For example, given this file tree:
+
+```sh
+my-app/
+├─ public/
+│ ├─ favicon.ico
+│ ├─ index.html
+├─ src/
+│ ├─ index.css
+│ ├─ index.js
+```
+
+If your `public/index.html` file needed to load the `favicon.ico` file, you would use a relative path with a single dot to access the current directory: `./favicon.ico`. If your `public/index.html` file needed to load the `index.css` file, you would use a relative path with double dots to navigate to the parent `my-app` directory first, then to the `src` directory, and finally to your file: `../src/index.css`.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-links/67168323932391a9ee0d3a9e.md b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-links/67168323932391a9ee0d3a9e.md
index c2d2741e7a..68d8c1f1d3 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-links/67168323932391a9ee0d3a9e.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-links/67168323932391a9ee0d3a9e.md
@@ -10,6 +10,26 @@ dashedName: what-are-the-different-link-states
Watch the video and answer the questions below.
+# --transcript--
+
+What are the different link states, and why are they important?
+
+You may have seen a link on a web page become purple after you click it. This is because the state of the link has changed, so different styling gets applied. There are five different states a link can be in.
+
+The first is the default state, which is `:link`. This state represents a link which the user has not visited, clicked, or interacted with yet. You can think of this state as providing the base styles for all links on your page. The other states build on top of it.
+
+The second state is `:visited`, which applies when a user has already visited the page being linked to. By default, this turns the link purple - but you can leverage CSS to provide a different visual indication to the user. This is helpful to let someone know they have already read a portion of your documentation. Or, that the site is one they can trust because they have used it before.
+
+The third state is `:hover`. This state applies when a user is hovering their cursor over a link. This state is helpful for providing extra attention to a link, to ensure a user actually intends to click it.
+
+Then we have `:focus`. This state applies when we focus on a link.
+
+And finally, we have `:active`. This state applies to links that are being activated by the user. This typically means clicking on the link with the primary mouse button by left clicking, in most cases. This state can be helpful for showing a user that the element they clicked on is interactive.
+
+When you use these states to style your links, there is a specific order you need to write your CSS in: `link`, `visited`, `hover`, `focus`, then `active`.
+
+You should now know how to give links in your page your own personal flair, while still providing the important information a user needs about the state of each link.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/672d26809d388621ad1ecd43.md b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/672d26809d388621ad1ecd43.md
index 28deeb7f56..60cf94568b 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/672d26809d388621ad1ecd43.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/672d26809d388621ad1ecd43.md
@@ -10,6 +10,77 @@ dashedName: how-does-isnan-work
Watch the video lecture and answer the questions below.
+# --transcript--
+
+What is `NaN`, and how does `isNaN` work?
+
+In JavaScript, `NaN` stands for "Not a Number". It's a special value that represents an unrepresentable or undefined numerical result. `NaN` is a property of the global object, and it's also considered a type of number in JavaScript, which might seem counterintuitive at first.
+
+`NaN` is typically the result of operations that should return a number but can't produce a meaningful numerical value. For example:
+
+```js
+let result = 0 / 0;
+console.log(result); // Output: NaN
+```
+
+In this case, dividing zero by zero is mathematically undefined, so JavaScript returns `NaN`. One peculiar property of `NaN` is that it's not equal to anything, including itself:
+
+```js
+console.log(NaN === NaN); // Output: false
+```
+
+This unique behavior makes it challenging to check if a value is `NaN` using standard comparison operators. To address this, JavaScript provides the `isNaN()` function. The `isNaN()` function property is used to determine whether a value is `NaN` or not. However, it's important to understand how `isNaN()` works, as it can sometimes produce unexpected results. Here's how `isNaN()` behaves:
+
+```js
+console.log(isNaN(NaN)); // true
+console.log(isNaN(undefined)); // true
+console.log(isNaN({})); // true
+
+console.log(isNaN(true)); // false
+console.log(isNaN(null)); // false
+console.log(isNaN(37)); // false
+
+console.log(isNaN("37")); // false: "37" is converted to 37
+console.log(isNaN("37.37")); // false: "37.37" is converted to 37.37
+console.log(isNaN("")); // false: empty string is converted to 0
+console.log(isNaN(" ")); // false: string with a space is converted to 0
+
+console.log(isNaN("blabla")); // true: "blabla" is not a number
+```
+
+As you can see, `isNaN()` first attempts to convert the parameter to a number. If it can't be converted, it returns `true`. This behavior can lead to some surprising results, especially when dealing with strings that can be coerced into numbers.
+
+Due to these potential inconsistencies, ES6 introduced `Number.isNaN()`. This method does not attempt to convert the parameter to a number before testing. It only returns `true` if the value is exactly `NaN`:
+
+```js
+console.log(Number.isNaN(NaN)); // true
+console.log(Number.isNaN(Number.NaN)); // true
+console.log(Number.isNaN(0 / 0)); // true
+
+console.log(Number.isNaN("NaN")); // false
+console.log(Number.isNaN(undefined)); // false
+console.log(Number.isNaN({})); // false
+console.log(Number.isNaN("blabla")); // false
+```
+
+`Number.isNaN()` provides a more reliable way to check for `NaN` values, especially in cases where type coercion might lead to unexpected results with the global `isNaN()` function. In practice, when dealing with numerical operations or user inputs that should be numbers, it's often necessary to check for `NaN` to handle errors or unexpected inputs gracefully. For example:
+
+```js
+function divide(a, b) {
+ let result = a / b;
+ if (Number.isNaN(result)) {
+ return "Error: Division resulted in NaN";
+ }
+ return result;
+}
+
+console.log(divide(10, 2)); // 5
+console.log(divide(10, 0)); // Infinity
+console.log(divide(0, 0)); // "Error: Division resulted in NaN"
+```
+
+In this example, we're using `Number.isNaN()` to catch cases where the division operation results in `NaN`, allowing us to handle this scenario appropriately. Understanding `NaN` and how to properly check for it is crucial for writing robust JavaScript code, especially when dealing with mathematical operations or parsing user inputs.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/6732808f3221720adc833e81.md b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/6732808f3221720adc833e81.md
index ccae567b85..13585293a8 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/6732808f3221720adc833e81.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/6732808f3221720adc833e81.md
@@ -10,6 +10,52 @@ dashedName: how-do-the-parsefloat-and-parseint-methods-work
Watch the lecture video and answer the questions below.
+# --transcript--
+
+How do the `parseFloat()` and `parseInt()` methods work?
+
+`parseFloat()` and `parseInt()` are two essential methods in JavaScript for converting strings to numbers. These methods are particularly useful when dealing with user input or processing data that comes in string format but needs to be treated as numerical values.
+
+Let's start with `parseFloat()`. This method parses a string argument and returns a floating-point number. It's designed to extract a number from the beginning of a string, even if the string contains non-numeric characters later on. Remember that floats are numbers with decimal points. Here's how `parseFloat()` works:
+
+```js
+console.log(parseFloat("3.14")); // Output: 3.14
+console.log(parseFloat("3.14 abc")); // Output: 3.14
+console.log(parseFloat("3.14.5")); // Output: 3.14
+console.log(parseFloat("abc 3.14")); // Output: NaN
+```
+
+As you can see, `parseFloat()` starts parsing from the beginning of the string and continues until it encounters a character that can't be part of a floating-point number. If it can't find a valid number at the start of the string, it returns `NaN` (Not a Number).
+
+`parseInt()`, on the other hand, parses a string argument and returns an integer. Like `parseFloat()`, it starts from the beginning of the string, but it stops at the first non-digit character. Here's how `parseInt()` works:
+
+```js
+console.log(parseInt("42")); // Output: 42
+console.log(parseInt("42px")); // Output: 42
+console.log(parseInt("3.14")); // Output: 3
+console.log(parseInt("abc123")); // Output: NaN
+```
+
+`parseInt()` stops parsing at the first non-digit it encounters. For floating-point numbers, it returns only the integer part. If it can't find a valid integer at the start of the string, it returns `NaN`.
+
+Both methods have some noteworthy behaviors. They ignore leading whitespace:
+
+```js
+console.log(parseFloat(" 3.14")); // Output: 3.14
+console.log(parseInt(" 42")); // Output: 42
+```
+
+They handle plus and minus signs at the beginning of the string:
+
+```js
+console.log(parseFloat("+3.14")); // Output: 3.14
+console.log(parseInt("-42")); // Output: -42
+```
+
+It's worth noting that while these methods are powerful, they have some limitations. For instance, they don't handle all number formats, such as scientific notation, directly. For more complex parsing needs, you might need to use additional techniques or libraries.
+
+In conclusion, `parseFloat()` and `parseInt()` are valuable tools for converting strings to numbers in JavaScript. Understanding how they work and their specific behaviors allows you to handle numeric data more effectively in your applications, especially when dealing with user inputs or external data sources.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/673280a1c29d0a0b17316e56.md b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/673280a1c29d0a0b17316e56.md
index b371fd65d2..1aa667227f 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/673280a1c29d0a0b17316e56.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-numbers-and-common-number-methods/673280a1c29d0a0b17316e56.md
@@ -10,6 +10,50 @@ dashedName: what-is-the-tofixed-method-and-how-does-it-work
Watch the lecture video and answer the questions below.
+# --transcript--
+
+What is the `.toFixed()` method, and how does it work?
+
+The `.toFixed()` method is a built-in JavaScript function that formats a number using fixed-point notation. It's particularly useful when you need to control the number of decimal places in a number, especially for displaying currency values or when working with precise measurements.
+
+The `.toFixed()` method is called on a number and takes one optional argument, which is the number of digits to appear after the decimal point. It returns a string representation of the number with the specified number of decimal places. Here's a basic example of how `.toFixed()` works:
+
+```js
+let num = 3.14159;
+console.log(num.toFixed(2)); // Output: "3.14"
+```
+
+In this case, we're limiting the number of decimal places to two. So, `3.14159` becomes `3.14`. It's important to note that `.toFixed()` returns a string, not a number. This is because the method is primarily intended for formatting numbers for display, not for further calculations.
+
+The `.toFixed()` method rounds the number to the nearest value that can be represented with the specified number of decimal places. This rounding behavior is important to understand:
+
+```js
+console.log((3.14159).toFixed(3)); // Output: "3.142"
+console.log((3.14449).toFixed(3)); // Output: "3.144"
+console.log((3.14550).toFixed(3)); // Output: "3.146"
+```
+
+As you can see, `.toFixed()` rounds up when the next digit is `5` or greater, and rounds down otherwise. If you call `.toFixed()` without arguments, it defaults to `0` decimal places:
+
+```js
+let num = 3.14159;
+console.log(num.toFixed()); // Output: "3"
+```
+
+The `.toFixed()` method can be particularly useful when working with financial calculations or displaying prices:
+
+```js
+let price = 19.99;
+let taxRate = 0.08;
+let total = price + (price * taxRate);
+
+console.log("Total: $" + total.toFixed(2)); // Output: "Total: $21.59"
+```
+
+In this example, `.toFixed(2)` ensures that the total is always displayed with two decimal places, which is standard for currency in many countries.
+
+In conclusion, the `.toFixed()` method is a powerful tool for formatting numbers in JavaScript, particularly when you need to control the display of decimal places. While it's primarily used for formatting output, remember its behavior, especially when precise calculations are needed.
+
# --questions--
## --text--
diff --git a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-strings-in-javascript/673263e80dd43da7df3ae565.md b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-strings-in-javascript/673263e80dd43da7df3ae565.md
index 9999634949..4aa306a97c 100644
--- a/curriculum/challenges/italian/25-front-end-development/lecture-working-with-strings-in-javascript/673263e80dd43da7df3ae565.md
+++ b/curriculum/challenges/italian/25-front-end-development/lecture-working-with-strings-in-javascript/673263e80dd43da7df3ae565.md
@@ -2,7 +2,7 @@
id: 673263e80dd43da7df3ae565
title: How Can You Find the Position of a Substring in a String?
challengeType: 11
-videoId: k2QaBPHl_00
+videoId: tTm8t9inci8
dashedName: how-can-you-find-the-position-of-a-substring-in-a-string
---
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-advanced-react/66f1ad049d7a6ac0886cc2ba.md b/curriculum/challenges/italian/25-front-end-development/quiz-advanced-react/66f1ad049d7a6ac0886cc2ba.md
index cb439f3337..c21d32edac 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-advanced-react/66f1ad049d7a6ac0886cc2ba.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-advanced-react/66f1ad049d7a6ac0886cc2ba.md
@@ -7,7 +7,7 @@ dashedName: quiz-advanced-react
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-asynchronous-javascript/66edd630f7666cfa54b404d0.md b/curriculum/challenges/italian/25-front-end-development/quiz-asynchronous-javascript/66edd630f7666cfa54b404d0.md
index 59a3d2a8e3..269ab6ac91 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-asynchronous-javascript/66edd630f7666cfa54b404d0.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-asynchronous-javascript/66edd630f7666cfa54b404d0.md
@@ -7,7 +7,7 @@ dashedName: quiz-asynchronous-javascript
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-bash-and-sql/66f1affc0ef4fcca423d4688.md b/curriculum/challenges/italian/25-front-end-development/quiz-bash-and-sql/66f1affc0ef4fcca423d4688.md
index a5b185a89e..761190010c 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-bash-and-sql/66f1affc0ef4fcca423d4688.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-bash-and-sql/66f1affc0ef4fcca423d4688.md
@@ -7,7 +7,7 @@ dashedName: quiz-bash-and-sql
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-bash-commands/66f1af4fedf643c78d024c5e.md b/curriculum/challenges/italian/25-front-end-development/quiz-bash-commands/66f1af4fedf643c78d024c5e.md
index c1d376c0ca..32bd4a6f46 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-bash-commands/66f1af4fedf643c78d024c5e.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-bash-commands/66f1af4fedf643c78d024c5e.md
@@ -7,7 +7,7 @@ dashedName: quiz-bash-commands
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-bash-scripting/66f1afbd9998e9c985d8e73b.md b/curriculum/challenges/italian/25-front-end-development/quiz-bash-scripting/66f1afbd9998e9c985d8e73b.md
index 9a81db9e10..56990ab396 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-bash-scripting/66f1afbd9998e9c985d8e73b.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-bash-scripting/66f1afbd9998e9c985d8e73b.md
@@ -7,7 +7,7 @@ dashedName: quiz-bash-scripting
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-basic-css/66ed8fa2f45ce3ece4053eab.md b/curriculum/challenges/italian/25-front-end-development/quiz-basic-css/66ed8fa2f45ce3ece4053eab.md
index 288e6b89dd..f444fea6f1 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-basic-css/66ed8fa2f45ce3ece4053eab.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-basic-css/66ed8fa2f45ce3ece4053eab.md
@@ -7,7 +7,7 @@ dashedName: quiz-basic-css
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -39,7 +39,7 @@ Cascading Style Sheets
#### --text--
-Which answer uses the correct structure of using a CSS rule?
+Which of the following is a correct CSS rule?
#### --distractors--
@@ -65,19 +65,19 @@ What does `` do?
#### --distractors--
-Establishes flexbox within the device.
+It links external stylesheets to a webpage for responsive design.
---
-Creates the font for the device.
+It specifies the metadata used by search engines to index a webpage.
---
-Makes the website automatically responsive.
+It specifies the character encoding used on the webpage.
#### --answer--
-Controls the shape and size of the web page from a user's device.
+It controls the shape and size of a web page on different screen sizes.
### --question--
@@ -241,19 +241,19 @@ What statement is TRUE about block-level elements?
#### --distractors--
-Block-level elements don't start on new lines.
+Block-level elements stack horizontally by default.
---
-Block-level elements only takes up as much as it needs.
+`width` and `height` properties usually do not apply to block-level elements unless you set their `display` property to `inline-block`.
---
-Block-level elements come with no margin.
+Block-level elements cannot contain inline elements inside them.
#### --answer--
-Block-level elements start on a new line with margin before and after the element.
+Block-level elements start on a new line and take up the full width of their container.
### --question--
@@ -263,19 +263,19 @@ What statement is TRUE when using the `inline-block` value?
#### --distractors--
-Doesn't allow you to set the height and width.
+Elements stack vertically, always taking up the full width of their container.
---
-Top and bottom margins not respected.
+Elements align horizontally but cannot apply vertical padding or margin.
---
-Adds a line break after an element.
+Elements respect width and height settings but cannot contain other elements inside them.
#### --answer--
-Allows you to place elements next to each other while letting you set the height and width.
+Elements retain inline flow but allow setting width and height.
### --question--
@@ -351,19 +351,19 @@ What does `!important` do in CSS?
#### --distractors--
-It doesn't effect the code.
+It makes the CSS rule work exclusively for inline styles and ignores styles defined in external or internal stylesheets.
---
-Applies to all properties in the code.
+It disables all other CSS properties applied to the same element, effectively making it the only rule that affects the element's styling.
---
-Applies on to a certain selector or group of elements.
+It applies on to a certain selector or group of elements.
#### --answer--
-Overrides any other values applied to the property for that selector.
+It overrides any other values applied to the property for that selector.
### --question--
@@ -373,19 +373,19 @@ How does the CSS Cascade algorithm work?
#### --distractors--
-Determines styles of the element based on alphabetical order.
+It determines styles of the element based on order of declaration, regardless of other factors.
---
-Gives animations to the page.
+It applies styles based solely on the order they are written, ignoring specificity.
---
-Improves Search Engine Optimization (SEO).
+It applies styles prioritizing specificity, ignoring origin and relevance.
#### --answer--
-Determines styles of the element based on specificity and order of declaration.
+It determines styles of the element based on specificity and order of declaration.
### --question--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-basic-html/66df3b712c41c499e9d31e5b.md b/curriculum/challenges/italian/25-front-end-development/quiz-basic-html/66df3b712c41c499e9d31e5b.md
index c136b3183d..0b138aa460 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-basic-html/66df3b712c41c499e9d31e5b.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-basic-html/66df3b712c41c499e9d31e5b.md
@@ -7,7 +7,7 @@ dashedName: quiz-basic-html
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-computer-basics/66ed8fb9f45ce3ece4053eac.md b/curriculum/challenges/italian/25-front-end-development/quiz-computer-basics/66ed8fb9f45ce3ece4053eac.md
index e59a69ece4..5dd20697f4 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-computer-basics/66ed8fb9f45ce3ece4053eac.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-computer-basics/66ed8fb9f45ce3ece4053eac.md
@@ -7,7 +7,7 @@ dashedName: quiz-computer-basics
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -39,23 +39,23 @@ Motherboard
#### --text--
-Which is not a conventional way to connect a keyboard to the computer?
+What are browser developer tools?
#### --distractors--
-USB Receiver
+Tools for editing browser settings and managing user profiles.
---
-Bluetooth
+Utilities for blocking ads and improving web page performance.
---
-USB Cable
+Software for managing browser extensions and plug-ins.
#### --answer--
-Ethernet Cable
+Built-in features in browsers that help developers debug and inspect websites.
### --question--
@@ -87,25 +87,25 @@ Which of the following is NOT a safe practice when signing in?
#### --distractors--
-Using a fingerprint or face scanner
+Using a fingerprint or face scanner.
---
-Making a long and complex password like `@ppl3_+B@nana34823`
+Making a long and complex password like `@ppl3_+B@nana34823`.
---
-Utilizing a physical USB security key
+Setting up two-factor authentication (2FA).
#### --answer--
-Saving passwords in the browser on a public computer
+Using passwords based on personal information like your birthday.
### --question--
#### --text--
-Which of the following is not a Web Browser?
+Which of the following is NOT a Web Browser?
#### --distractors--
@@ -113,11 +113,11 @@ Safari
---
-Opera GX
+Opera
---
-DuckDuckGo
+Microsoft Edge
#### --answer--
@@ -149,7 +149,7 @@ Visual Studio Code
#### --text--
-Which of the following stores and accesses files on the hard drive?
+Which of the following is used primarily for managing files stored on a local hard drive?
#### --distractors--
@@ -171,45 +171,45 @@ Windows File Explorer
#### --text--
-What is not a good practice when naming files for later use?
+What is NOT a good practice when naming files?
#### --distractors--
-Putting an underscore or hyphen between words
+Putting an underscore or hyphen between words.
---
-Use a casing style such as camelCase and sticking with it
+Use a casing style such as camelCase and sticking with it.
---
-Putting a version number at the end of a document like `summaryReport_v2.docx`
+Putting a version number at the end of a document like `summaryReport_v2.docx`.
#### --answer--
-Being lazy and pounding your keyboard like `asdfloweiueld` to get it over with
+Using non-descriptive names like `file1.txt`.
### --question--
#### --text--
-Which of the following is a way to move files?
+What does the term "domain name" refer to?
#### --distractors--
-Using `Ctrl + X` and `Ctrl + V` (or `Command + X` and `Command + V` on Mac)
+A type of software that manages website files and databases.
---
-Dragging the file and dropping it at the destination
+The physical location of a web server in a data center.
---
-Using a terminal command such as `move` (`mv` on Mac)
+None of the other choices.
#### --answer--
-All of the other choices
+The address used to identify websites on the internet.
### --question--
@@ -219,47 +219,47 @@ Which of the following is a way to send a file to the Recycle Bin/Trash?
#### --distractors--
-All of the other choices
+All of the other choices.
---
-Pressing the `Backspace` key on the keyboard
+Pressing the `Backspace` key on the keyboard.
---
-Moving it to an Archived folder
+Moving it to an Archived folder.
#### --answer--
-Pressing the `Delete` key on the keyboard (`Command + Delete` on Mac)
+Right-click on it and select the Delete/Move to trash option.
### --question--
#### --text--
-Which of the following is not a feature when searching for files locally?
+What is a RAM?
#### --distractors--
-Using boolean operators like `AND`, `OR`, and `NOT`
+A network protocol used for transferring files between devices.
---
-Using filters like `*.jpg`
+A permanent storage device used for saving files and applications.
---
-Using Cortana on Windows or Spotlight Search on Mac
+A component in a computer responsible for generating graphics and rendering images.
#### --answer--
-Typing the name of the file into your Web Browser and hitting `Enter`
+A temporary memory for fast data access by the processor.
### --question--
#### --text--
-What file type will be best suited for writing documentation?
+What file type will be best suited for writing a `README` file?
#### --distractors--
@@ -281,29 +281,29 @@ What file type will be best suited for writing documentation?
#### --text--
-Which of the following is not a configuration file?
+What is an Integrated Development Environment (IDE)?
#### --distractors--
-`.env`
+A platform designed for deploying and hosting web applications.
---
-`.build`
+A type of hardware device used for testing and debugging electronic circuits.
---
-`.yaml` or `.yml`
+A version control system that helps developers track changes in source code during software development.
#### --answer--
-`.log`
+A program that integrates tools for writing, debugging, and running code.
### --question--
#### --text--
-A piece of software that allows you to look at online content is called a:
+What is a piece of software that allows you to look at online content called?
#### --distractors--
@@ -325,7 +325,7 @@ Web Browser
#### --text--
-A piece of software that lists web pages related to a user's query is a called a:
+What is a piece of software that lists web pages related to a user's query called?
#### --distractors--
@@ -347,7 +347,7 @@ Search Engine
#### --text--
-A set of one or more web pages under one domain name is called a:
+What is a set of one or more web pages under one domain name called?
#### --distractors--
@@ -369,15 +369,15 @@ Website
#### --text--
-To search for an exact phrase, you should use what character?
+To search for an exact phrase, what should you enclose your search query with?
#### --distractors--
-Backtick
+Backticks
---
-Parenthesis
+Parentheses
---
@@ -391,65 +391,65 @@ Quotation marks
#### --text--
-Which is not a way to install a Web Browser?
+Which is NOT a way to install a Web Browser?
#### --distractors--
-Using a Package Manager
+Using a Package Manager.
---
-Directly downloading from the website
+Directly downloading from the website.
---
-Using an App Store like Microsoft Store
+Using an App Store like Microsoft Store.
#### --answer--
-Pressing the Network/Internet button in Settings
+Pressing the Network/Internet button in Settings.
### --question--
#### --text--
-Which of these peripherals is an input device?
+Which of the following formats does NOT preserve image quality after compression?
#### --distractors--
-Projector
+All of the other choices.
---
-Speakers
+PNG
---
-Monitor
+SVG
#### --answer--
-Microphone
+JPEG
### --question--
#### --text--
-Which of the following lists of parts can all be found in the circuit board?
+Which of the following parts can be found in the circuit board?
#### --distractors--
-Printer, Router, USB Ports
+Printer and Router.
---
-Mouse, Keyboard, Monitor
+Mouse and Keyboard.
---
-Motherboard, Hard Drive, GPU
+Hard Drive and GPU.
#### --answer--
-BIOS/UEFI Chip, CPU, RAM
+CPU and RAM.
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-css-accessibility/66ed8fc1f45ce3ece4053ead.md b/curriculum/challenges/italian/25-front-end-development/quiz-css-accessibility/66ed8fc1f45ce3ece4053ead.md
index 019e90821e..414d24f413 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-css-accessibility/66ed8fc1f45ce3ece4053ead.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-css-accessibility/66ed8fc1f45ce3ece4053ead.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-accessibility
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-css-animations/66ed8fc9f45ce3ece4053eae.md b/curriculum/challenges/italian/25-front-end-development/quiz-css-animations/66ed8fc9f45ce3ece4053eae.md
index 4befddea1b..f3355ce004 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-css-animations/66ed8fc9f45ce3ece4053eae.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-css-animations/66ed8fc9f45ce3ece4053eae.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-animations
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-css-attribute-selectors/66ed8fd0f45ce3ece4053eaf.md b/curriculum/challenges/italian/25-front-end-development/quiz-css-attribute-selectors/66ed8fd0f45ce3ece4053eaf.md
index 8e578e4f09..725a82871d 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-css-attribute-selectors/66ed8fd0f45ce3ece4053eaf.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-css-attribute-selectors/66ed8fd0f45ce3ece4053eaf.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-attribute-selectors
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-css-backgrounds-and-borders/66ed8fd7f45ce3ece4053eb0.md b/curriculum/challenges/italian/25-front-end-development/quiz-css-backgrounds-and-borders/66ed8fd7f45ce3ece4053eb0.md
index 7558dd38a0..05c1d209c7 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-css-backgrounds-and-borders/66ed8fd7f45ce3ece4053eb0.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-css-backgrounds-and-borders/66ed8fd7f45ce3ece4053eb0.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-backgrounds-and-borders
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-css-colors/66ed8fe1f45ce3ece4053eb1.md b/curriculum/challenges/italian/25-front-end-development/quiz-css-colors/66ed8fe1f45ce3ece4053eb1.md
index 449e3fe6e7..7475192583 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-css-colors/66ed8fe1f45ce3ece4053eb1.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-css-colors/66ed8fe1f45ce3ece4053eb1.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-colors
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -413,91 +413,59 @@ Which color model includes the `hue` component?
#### --text--
-Which of the following is the correct syntax to create a CSS variable with a fallback value?
+Which color function also allows you to set the opacity of the color?
#### --distractors--
```css
-.element {
- color: var(--main-color; red);
-}
+hsl(0, 20%, 30%, 50%)
```
---
```css
-.element {
- color: var(--main-color);
-}
+rgb(20, 30, 80, 0.5)
```
---
```css
-.element {
- color: var(--main-color: red);
-}
+rgba(20, 30, 80)
```
#### --answer--
```css
-.element {
- color: var(--main-color, red);
-}
+hsla(0, 20%, 30%, 50%)
```
### --question--
#### --text--
-How can you use CSS variables to dynamically change the color of multiple elements?
+Which of the following is the correct way to give an element a top-to-bottom red-to-blue gradient background?
#### --distractors--
```css
-:root {
- primary-color: blue;
-}
-
-.element1, .element2 {
- color: --primary-color;
-}
+background: radial-gradient(red, blue)
```
---
```css
-body {
- --color: blue;
-}
-
-.element1, .element2 {
- color: var(color);
-}
+background: radial-gradient(blue, red)
```
---
```css
-:root {
- primary: blue;
-}
-
-.element1, .element2 {
- color: var(--primary);
-}
+background: linear-gradient(blue, red)
```
#### --answer--
```css
-:root {
- --primary-color: blue;
-}
-
-.element1, .element2 {
- color: var(--primary-color);
-}
+background: linear-gradient(red, blue)
```
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-css-flexbox/66ed8fe7f45ce3ece4053eb2.md b/curriculum/challenges/italian/25-front-end-development/quiz-css-flexbox/66ed8fe7f45ce3ece4053eb2.md
index 64800f658e..802c8e1a5e 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-css-flexbox/66ed8fe7f45ce3ece4053eb2.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-css-flexbox/66ed8fe7f45ce3ece4053eb2.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-flexbox
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-css-grid/66ed8fedf45ce3ece4053eb3.md b/curriculum/challenges/italian/25-front-end-development/quiz-css-grid/66ed8fedf45ce3ece4053eb3.md
index 212a4d9174..3a1db70a11 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-css-grid/66ed8fedf45ce3ece4053eb3.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-css-grid/66ed8fedf45ce3ece4053eb3.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-grid
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-css-layout-and-effects/66ed8ff4f45ce3ece4053eb4.md b/curriculum/challenges/italian/25-front-end-development/quiz-css-layout-and-effects/66ed8ff4f45ce3ece4053eb4.md
index 96fa9703af..1a0901cda1 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-css-layout-and-effects/66ed8ff4f45ce3ece4053eb4.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-css-layout-and-effects/66ed8ff4f45ce3ece4053eb4.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-layout-and-effects
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-css-libraries-and-frameworks/66f1aeb60b11aec5abe83c2e.md b/curriculum/challenges/italian/25-front-end-development/quiz-css-libraries-and-frameworks/66f1aeb60b11aec5abe83c2e.md
index 1becf6756e..9c4658cd5a 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-css-libraries-and-frameworks/66f1aeb60b11aec5abe83c2e.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-css-libraries-and-frameworks/66f1aeb60b11aec5abe83c2e.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-libraries-and-frameworks
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-css-positioning/66ed8ffcf45ce3ece4053eb5.md b/curriculum/challenges/italian/25-front-end-development/quiz-css-positioning/66ed8ffcf45ce3ece4053eb5.md
index 9ac0e24c3c..36b0a03ebf 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-css-positioning/66ed8ffcf45ce3ece4053eb5.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-css-positioning/66ed8ffcf45ce3ece4053eb5.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-positioning
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -17,438 +17,594 @@ To pass the quiz, you must correctly answer at least 17 of the 20 questions belo
#### --text--
-What is the main purpose of the `float` property in CSS?
+Which of the following is NOT a valid value for the `position` property?
#### --distractors--
-To create rounded corners.
+`fixed`
---
-To control opacity.
+`absolute`
---
-To center vertically.
+`relative`
#### --answer--
-To align elements to either the left or the right of their container.
+`above`
### --question--
#### --text--
-Which CSS property is used to set the stack order of an element?
+What is the main purpose of the `float` property in CSS?
#### --distractors--
-`position`
+Floats are used to remove an element from its normal flow on the page and automatically position it in the upper right hand side of the webpage.
---
-`bg-green`
+Floats are used to remove an element from its normal flow on the page and position it to the top of its container.
---
-`float`
+Floats are used to remove an element from its normal flow on the page and automatically position it to the bottom right hand side of webpage.
#### --answer--
-`z-index`
+Floats are used to remove an element from its normal flow on the page and position it either on the left or right side of its container.
### --question--
#### --text--
-What happens when you apply `position: relative` to an element in CSS?
+Which of the following is an example making a box element float to the left?
#### --distractors--
-It removes the element from document flow.
+```css
+.box {
+ left: float;
+ margin-right: 15px;
+ width: 50px;
+ height: 50px;
+ background-color: black;
+}
+```
---
-It only moves the element relative to the viewport.
+```css
+.box {
+ position: float-left;
+ margin-right: 15px;
+ width: 50px;
+ height: 50px;
+ background-color: black;
+}
+```
---
-It positions the element in a fixed position relative to the viewport.
+```css
+.box {
+ float: left-side;
+ margin-right: 15px;
+ width: 50px;
+ height: 50px;
+ background-color: black;
+}
+```
#### --answer--
-It moves the element relative to its default position in the document.
+```css
+.box {
+ float: left;
+ margin-right: 15px;
+ width: 50px;
+ height: 50px;
+ background-color: black;
+}
+```
### --question--
#### --text--
-Which CSS property would you use to fix an element at a certain position on the page so that it does not move when scrolling occurs?
+What is the role of the `clear` property?
#### --distractors--
-`position: absolute`
+It is used to determine if an element needs to be moved to the bottom of the page.
---
-`position: relative`
+It is used to determine if an element needs to be completely cleared from the page.
---
-`display: block`
+It is used to determine if an element needs to be fixed to the top of the page.
#### --answer--
-`position: fixed`
+It is used to determine if an element needs to be moved below the floated content.
### --question--
#### --text--
-If an element has `position: absolute`, what element is it positioned relatively to?
+Which CSS property is used to control the vertical stacking order of positioned elements that overlap on the page?
#### --distractors--
-The closest ancestor with `position: fixed`.
+`position`
---
-The closest ancestor with `position: absolute`.
+`bg-green`
---
-The `` element.
+`float`
#### --answer--
-The closest positioned ancestor with `position` set to `relative`, `absolute`, or `fixed`.
+`z-index`
### --question--
#### --text--
-Which positioning method allows an element to stick to a defined position only when you scroll past a certain point?
+Which of the following is the correct syntax for relative positioning?
#### --distractors--
-`position: float`
+```css
+.relative {
+ position: relative-position;
+ top: 30px;
+ left: 30px;
+}
+```
---
-`position: fixed`
+```css
+.relative {
+ relative-position: relative;
+ top: 30px;
+ left: 30px;
+}
+```
---
-`position: absolute`
+```css
+.relative {
+ relative: position;
+ top: 30px;
+ left: 30px;
+}
+```
#### --answer--
-`position: sticky`
-
-### --question--
-
-#### --text--
-
-Given the following code:
-
```css
-#box1 {
+.relative {
position: relative;
- z-index: 1;
+ top: 30px;
+ left: 30px;
}
+```
-#box2 {
- position: relative;
- z-index: 2;
-}
+### --question--
-#box3 {
- position: relative;
- z-index: -1;
-}
-```
+#### --text--
-How will `#box3` be positioned on the page?
+Which CSS property would you use to fix an element at a certain position on the page so that it does not move when scrolling occurs?
#### --distractors--
-It will be stacked above all the other elements on the page.
+`position: no-scroll;`
---
-It will disappear from view.
+`position: relative;`
---
-It will stay at the bottom corner of the page.
+`display: block;`
#### --answer--
-It will be stacked below all the other elements on the page.
+`position: fixed;`
### --question--
#### --text--
-How does a floated element affect the layout of surrounding elements?
+What does absolute positioning do to an element?
#### --distractors--
-Other elements are placed in relation to the floated element.
+Absolute positioning is used to determine if an element needs to be moved below the floated content.
---
-The surrounding elements ignore the floated element and overlap it.
+Absolute positioning is used to position the element within the normal document flow.
---
-It will shift surrounding elements behind the floated element.
+Absolute positioning is used to control the vertical stacking order of positioned elements that overlap on the page.
#### --answer--
-Block elements surrounding it flow around the floated element.
+Absolute positioning allows you to take an element out of the normal document flow, making it behave independently from other elements.
### --question--
#### --text--
-What does an element with `position: sticky` require for it to work?
+Which of the following is NOT a valid property that you can use for absolute positioning?
#### --distractors--
-A `position: relative` parent element.
+`right`
---
-A `z-index` value greater than 1.
+`bottom`
---
-A `z-index` of 0 or greater.
+`top`
#### --answer--
-A declared `top`, `left`, `right`, or `bottom` property.
+`side`
### --question--
#### --text--
-What happens when setting the `overflow` property of a parent to `auto` and one of its children has the property `position: sticky`?
+What is the key difference between relative and absolute positioning?
#### --distractors--
-The child element's sticky behavior is not affected by the `overflow` property of the parent.
+Absolute positioning sets the element in a sticky position while relative positioning takes an element out of the normal document flow.
---
-The sticky element will maintain its behavior regardless of scrolling.
+Relative positioning sets the element in a fixed position while absolute positioning takes an element out of the normal document flow.
---
-The sticky element will act as if it has `position: fixed` within the parent.
+Absolute positioning positions the element within the normal document flow while relative positioning takes an element out of the normal document flow.
#### --answer--
-The child will lose its sticky behavior when the parent scrolls.
+Relative positioning positions the element within the normal document flow while absolute positioning takes an element out of the normal document flow.
### --question--
#### --text--
-Which of the following properties is used to offset a positioned element from its normal position?
+Which of the following is an example of positioning a box in the upper left hand corner of the page?
#### --distractors--
-`float`
+```css
+.box {
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ background-color: coral;
+ width: 50px;
+ height: 50px;
+}
+```
---
-`padding-right`
+```css
+.box {
+ position: absolute;
+ top: 0;
+ right: 0;
+ background-color: coral;
+ width: 50px;
+ height: 50px;
+}
+```
---
-`margin-right`
+```css
+.box {
+ position: absolute;
+ bottom: 0;
+ right: 0;
+ background-color: coral;
+ width: 50px;
+ height: 50px;
+}
+```
#### --answer--
-`right`
+```css
+.box {
+ position: absolute;
+ top: 0;
+ left: 0;
+ background-color: coral;
+ width: 50px;
+ height: 50px;
+}
+```
### --question--
#### --text--
-How does a floated element impact the height of its containing block when the containing block does not have an explicit height defined?
+Which positioning method allows an element to stick to a defined position only when you scroll past a certain point?
#### --distractors--
-The height of the containing block is automatically expanded to fit the floated element.
+Float positioning
---
-The height will automatically adapt to fit all the floated elements.
+Fixed positioning
---
-The containing block will automatically apply `clear: both` to fit the floated element.
+Absolute positioning
#### --answer--
-The containing block will collapse, completely ignoring its floated element height.
+Sticky positioning
### --question--
#### --text--
-Which of the following CSS techniques is an accepted method for preventing a parent container from shrinking in size when it contains only floated elements?
+Which of the following is a correct example of using sticky positioning?
#### --distractors--
-Set `float: none` to the container.
+```css
+.box {
+ sticky: position;
+ top: 30px;
+ right: 30px;
+ width: 50px;
+ height: 50px;
+ background-color: red;
+}
+```
---
-Add `margin: auto` to the parent container.
+```css
+.box {
+ position: sticky-fixed;
+ top: 30px;
+ right: 30px;
+ width: 50px;
+ height: 50px;
+ background-color: red;
+}
+```
---
-Use the `position: relative` on the parent container.
+```css
+.box {
+ position: sticky-top;
+ right: 30px;
+ width: 50px;
+ height: 50px;
+ background-color: red;
+}
+```
#### --answer--
-Adding the property `overflow: auto` or `overflow: hidden` to the parent container.
+```css
+.box {
+ position: sticky;
+ top: 30px;
+ right: 30px;
+ width: 50px;
+ height: 50px;
+ background-color: red;
+}
+```
### --question--
#### --text--
-When a floating element is followed by non-floating inline elements, how will their layout be affected?
+What is the difference between sticky and fixed positioning?
#### --distractors--
-The inline elements will be positioned below the floated element.
+Sticky elements can only be used in table layouts while fixed elements can be used in any type of CSS layout.
---
-Inline elements will always be on top of the floated element.
+Sticky elements will always remain in the same position while fixed elements will stick to a certain point then behave like relative elements.
---
-The inline elements will overlap the floated element.
+Fixed elements will be positioned relative to its normal position while sticky elements will only stick to a certain point then behave like relative elements.
#### --answer--
-Inline elements will wrap around the floated element if there is enough space.
+Fixed elements will remain in the same position on the screen while sticky elements will only stick to a certain point then behave like relative elements.
### --question--
#### --text--
-What happens when `clear: both` is applied to an element following two floated elements - one left and one right - in a container?
+What problem did the `clearfix` hack solve when working with floats?
#### --distractors--
-The element will be positioned to the left of the floated elements.
+The `clearfix` hack helped solve the issue of floated elements being removed from the normal document flow and being placed in a fixed position on the page.
---
-The element will align between the two floated elements.
+The `clearfix` hack helped solve the issue of floated elements not being responsive in mobile and tablet layouts.
---
-The element will wrap around the floated elements depending on space.
+The `clearfix` hack helped solve the issue of floated elements disappearing from the page.
#### --answer--
-The element will be underneath both floated elements - the float breaks.
+The `clearfix` hack helped solve the issue of overlaps and collapsing in the layouts when multiple floated elements were stacked next to each other.
### --question--
#### --text--
-When does an element with `z-index: auto` create a new stacking context?
+Which of the following is a correct example for using the `clearfix` hack?
#### --distractors--
-When combined with `position: absolute` or `position: relative`.
+```css
+.clearfix::before {
+ position: fixed;
+ top: 0;
+ width: 100%;
+ clear: both;
+}
+```
---
-When its parent element has `z-index: auto` and `position: fixed`.
+```css
+.clearfix::after {
+ position: relative;
+ top: 30px;
+ left: 30px;
+ clear: all;
+}
+```
---
-When it is combined with `float: left`, if two sibling elements are of the same `z-index` and absolutely positioned.
+```css
+.clearfix::before {
+ top: 30px;
+ clear: none;
+}
+```
#### --answer--
-In combination with `position: fixed` or `position: sticky`.
+```css
+.clearfix::after {
+ content: "";
+ display: block;
+ clear: both;
+}
+```
### --question--
#### --text--
-If two sibling elements have the same `z-index` and are both positioned absolutely using `position: absolute`, what determines which one is on top?
+What is static positioning?
#### --distractors--
-It rearranges the sibling elements in relation to its new position.
+This is used to remove an element from its normal flow on the page and automatically position it in the upper right hand side of the webpage.
---
-Adding `z-index: auto` to the parent container.
+This allows you to take an element out of the normal document flow, making it behave independently from other elements.
---
-Using `position: relative` on the parent container.
+This allows an element to stick to a defined position only when you scroll past a certain point.
#### --answer--
-The document source order (HTML position).
+This is the normal flow for the document. Elements are positioned from top to bottom and left to right one after another.
### --question--
#### --text--
-In what way will the property `position: relative` exert an effect on sibling elements in regards to document flow?
+Which of the following is an example of setting the navbar to the top of the page using fixed positioning?
#### --distractors--
-It removes the element from the normal document flow, which affects the positions of siblings.
+```css
+.navbar {
+ fixed: top;
+ top: 0;
+ width: 100%;
+}
+```
---
-The relative element will move by the parent's top and left properties.
+```css
+.navbar {
+ upper: fixed;
+ width: 100%;
+}
+```
---
-It creates a new stacking context which lifts the element in relation to any siblings.
+```css
+.navbar {
+ position: fixed-top;
+ top: 0;
+ width: 100%;
+}
+```
#### --answer--
-It allows the element to shift without affecting the document flow of sibling elements.
+```css
+.navbar {
+ position: fixed;
+ top: 0;
+ width: 100%;
+}
+```
### --question--
#### --text--
-What happens when a `position: relative` element is nested inside of a `position: absolute` parent, with `top` and `left` values set?
+Which of the following is a valid value to use for the `z-index` property?
#### --distractors--
-It moves relative to the parent element's original position.
+`12.0`
---
-It moves with respect to the absolute coordinates of the containing parent element.
+`none`
---
-It will never create a new stacking context regardless of the `z-index` value.
+`up`
#### --answer--
-It ignores the positioning of the parent and moves relative to its normal position.
+`1`
### --question--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-css-pseudo-classes/66ed9002f45ce3ece4053eb6.md b/curriculum/challenges/italian/25-front-end-development/quiz-css-pseudo-classes/66ed9002f45ce3ece4053eb6.md
index 3e9e2dd892..3f797ae969 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-css-pseudo-classes/66ed9002f45ce3ece4053eb6.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-css-pseudo-classes/66ed9002f45ce3ece4053eb6.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-pseudo-classes
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-css-relative-and-absolute-units/66ed9009f45ce3ece4053eb7.md b/curriculum/challenges/italian/25-front-end-development/quiz-css-relative-and-absolute-units/66ed9009f45ce3ece4053eb7.md
index 0ee4e9ffcf..fdbceb80b1 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-css-relative-and-absolute-units/66ed9009f45ce3ece4053eb7.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-css-relative-and-absolute-units/66ed9009f45ce3ece4053eb7.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-relative-and-absolute-units
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-css-typography/66ed9010f45ce3ece4053eb8.md b/curriculum/challenges/italian/25-front-end-development/quiz-css-typography/66ed9010f45ce3ece4053eb8.md
index 45ba4f942a..2db93157b5 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-css-typography/66ed9010f45ce3ece4053eb8.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-css-typography/66ed9010f45ce3ece4053eb8.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-typography
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-css-variables/66ed9018f45ce3ece4053eb9.md b/curriculum/challenges/italian/25-front-end-development/quiz-css-variables/66ed9018f45ce3ece4053eb9.md
index 7eee5f9ae0..80f213dbb3 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-css-variables/66ed9018f45ce3ece4053eb9.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-css-variables/66ed9018f45ce3ece4053eb9.md
@@ -7,7 +7,7 @@ dashedName: quiz-css-variables
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-debugging-javascript/66edd10913f078e7669eca81.md b/curriculum/challenges/italian/25-front-end-development/quiz-debugging-javascript/66edd10913f078e7669eca81.md
index eab6ee36ca..09f6c2d29e 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-debugging-javascript/66edd10913f078e7669eca81.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-debugging-javascript/66edd10913f078e7669eca81.md
@@ -7,7 +7,7 @@ dashedName: quiz-debugging-javascript
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-design-fundamentals/66ed901ff45ce3ece4053eba.md b/curriculum/challenges/italian/25-front-end-development/quiz-design-fundamentals/66ed901ff45ce3ece4053eba.md
index c687e078a1..17d106d010 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-design-fundamentals/66ed901ff45ce3ece4053eba.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-design-fundamentals/66ed901ff45ce3ece4053eba.md
@@ -7,7 +7,7 @@ dashedName: quiz-design-fundamentals
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -39,7 +39,7 @@ Creates visual hierarchy, improves readability, focuses the viewer's attention o
#### --text--
-What is the design principle of carefully choosing the size of elements in relation to each other and the layout?
+What is the design principle of carefully choosing the size of elements in relation to each other?
#### --distractors--
@@ -65,25 +65,25 @@ Which of the following sites would most likely benefit from using breadcrumbs?
#### --distractors--
-A single-page portfolio site.
+A single-page portfolio site
---
-An infinite scroll gallery site.
+An infinite scroll gallery site
---
-A simple blog with only a few posts.
+A simple blog with only a few posts
#### --answer--
-A complex e-commerce site with multiple categories and subcategories.
+A complex e-commerce site with multiple categories and subcategories
### --question--
#### --text--
-What design pattern allows users to access and interact with specific elements and content on a website without or while deferring registration?
+Which design pattern allows users to access and interact with elements and content on a website without requiring immediate registration?
#### --distractors--
@@ -105,19 +105,19 @@ Deferred/lazy registration
#### --text--
-What are the three main types of text alignment?
+What are three types of text alignment?
#### --distractors--
-Vertical, center, horizontal
+Top, center, horizontal
---
-Left, right, justified
+Left, right, middle
---
-Vertical, horizontal, justified
+Vertical, horizontal, equal
#### --answer--
@@ -171,7 +171,7 @@ Elements that are strikingly different from each other visually
#### --text--
-In the examples below, which one is an example of visual hierarchy in design?
+Which of the following is an example of visual hierarchy in design?
#### --distractors--
@@ -197,7 +197,7 @@ What is a common goal of conducting exit interviews in user research?
#### --distractors--
-To increase the number of new users.
+To increase the number of new users
---
@@ -205,11 +205,11 @@ To test new features with existing users
---
-To gather data for A/B testing.
+To gather data for A/B testing
#### --answer--
-To understand the factors causing user churn.
+To understand the factors causing user churn
### --question--
@@ -285,19 +285,19 @@ How can user research impact user requirements?
#### --distractors--
-It has no impact on user requirements.
+It has no impact on user requirements
---
-It only affects non-functional requirements.
+It only affects non-functional requirements
---
-It only affects functional requirements.
+It only affects functional requirements
#### --answer--
-It can help define and refine user requirements based on user feedback.
+It can help define and refine user requirements based on user feedback
### --question--
@@ -307,63 +307,63 @@ Why is it important for a design brief to be reviewed and approved by all stakeh
#### --distractors--
-To ensure everyone is aware of the project's social media strategy.
+To ensure everyone is aware of the project's social media strategy
---
-To finalize the color palette and design elements.
+To finalize the color palette and design elements
---
-To determine the project's marketing budget.
+To determine the project's marketing budget
#### --answer--
-To confirm that all stakeholders agree on the project's objectives and requirements.
+To confirm that all stakeholders agree on the project's objectives and requirements
### --question--
#### --text--
-What is one bad practice method for implementing infinite scroll?
+What is considered bad practice when implementing infinite scroll?
#### --distractors--
-Allow users to jump to a page or section through the navbar or a pagination drop down menu
+Allowing users to jump to a page or section through the navbar or a pagination drop down menu
---
-Add a load more indicator or symbol after a certain point in the page along with the infinite scroll
+Adding a load more indicator or symbol after a certain point in the page along with the infinite scroll
---
-Integrate a footer reveal at the bottom
+Integrating a footer reveal at the bottom
#### --answer--
-No back to top button, alternative methods of navigating the page, and very long inefficient scrolling
+Not adding alternative methods of navigating the page
### --question--
#### --text--
-What is one bad practice for working with images?
+Which of the following is a best practice when designing progress indicators for forms?
#### --distractors--
-Make important images stand out by being larger in size
+Requiring users to restart the form if they navigate away from the page
---
-Separate text and images into columns or rows
+Keeping the progress indicator small and discreet
---
-Put images outside the layout and important ones on their own or full screen
+Making sure the progress is just displayed visually without any text
#### --answer--
-Images placed in the middle of text paragraphs with very little margin space for separation
+Breaking the progress indicator into labeled sections
### --question--
@@ -381,7 +381,7 @@ Do not allow users to add or remove items from the cart
---
-Include a checkout summary on another page
+Automatically add products to the cart without user interaction
#### --answer--
@@ -391,7 +391,7 @@ Include thumbnail images of products in the cart
#### --text--
-Dark mode doesn't mean pure black. What are some colors and good techniques to create a good dark mode color scheme?
+Dark mode doesn't mean pure black. What is a good technique to create an effective dark mode color scheme?
#### --distractors--
@@ -439,17 +439,17 @@ What is a design brief?
#### --distractors--
-A design brief is a document outlining the programming and design standards of the project
+A document outlining the programming and design standards of the project
---
-A design brief is a document explaining how to replicate a design
+A document explaining how to replicate a design
---
-A design brief is a document with detailed information of icons, colors, and assets the designer should use
+A document with detailed information of icons, colors, and assets the designer should use
#### --answer--
-A design brief states the goals and project scope, budget, design requirements, and other important details of the project
+A document stating the goals and project scope, budget and design requirements
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-dom-manipulation-and-click-event-with-javascript/66edd07682767adff3a6231e.md b/curriculum/challenges/italian/25-front-end-development/quiz-dom-manipulation-and-click-event-with-javascript/66edd07682767adff3a6231e.md
index c5957d5c06..50a47ba445 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-dom-manipulation-and-click-event-with-javascript/66edd07682767adff3a6231e.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-dom-manipulation-and-click-event-with-javascript/66edd07682767adff3a6231e.md
@@ -7,7 +7,7 @@ dashedName: quiz-dom-manipulation-and-click-event-with-javascript
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-form-validation-with-javascript/66edd3403d7077eece6dc4b6.md b/curriculum/challenges/italian/25-front-end-development/quiz-form-validation-with-javascript/66edd3403d7077eece6dc4b6.md
index 6a20dd01ac..a722b78020 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-form-validation-with-javascript/66edd3403d7077eece6dc4b6.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-form-validation-with-javascript/66edd3403d7077eece6dc4b6.md
@@ -7,7 +7,7 @@ dashedName: quiz-form-validation-with-javascript
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-git/66f1b06a5a5d10cc100af620.md b/curriculum/challenges/italian/25-front-end-development/quiz-git/66f1b06a5a5d10cc100af620.md
index bad816f377..d15e929765 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-git/66f1b06a5a5d10cc100af620.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-git/66f1b06a5a5d10cc100af620.md
@@ -7,7 +7,7 @@ dashedName: quiz-git
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-html-accessibility/66ed9026f45ce3ece4053ebb.md b/curriculum/challenges/italian/25-front-end-development/quiz-html-accessibility/66ed9026f45ce3ece4053ebb.md
index 0b7b3e0703..97fddd99d5 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-html-accessibility/66ed9026f45ce3ece4053ebb.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-html-accessibility/66ed9026f45ce3ece4053ebb.md
@@ -7,7 +7,7 @@ dashedName: quiz-html-accessibility
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -21,41 +21,74 @@ What is accessibility?
#### --distractors--
-Accessibility focuses on making websites faster to load.
+Accessibility is a set of standardized practices that ensures your code is free from all security risks.
---
-Accessibility is a belief to make websites compatible with older browsers.
+Accessibility is a set of standardized practices that enhances the speed and performance for your web applications.
---
-Accessibility is a type of coding style.
+Accessibility is a set of standardized practices that ensures your code meets 100% test coverage.
#### --answer--
-Accessibility is a set of standardized practices that help make online content more usable by people with disabilities.
+Accessibility is a set of standardized practices to ensure your web applications can be used by everyone, including those with disabilities.
+
### --question--
#### --text--
-What is a best practice for creating accessible headings?
+Which of the following is a good example for proper heading level structure?
#### --distractors--
-Add SEO-friendly keywords.
+```html
+Heading 3
+Heading 3
+Heading 3
+
+Heading 1
+Heading 2
+Heading 4
+```
---
-Create humorous headings.
+```html
+Heading 6
+
+Heading 1
+Heading 1
+
+Heading 5
+
+Heading 2
+Heading 2
+```
---
-Place `h6` headings at the beginning of your webpage.
+```html
+Heading 6
+Heading 5
+Heading 4
+Heading 3
+Heading 2
+Heading 1
+```
#### --answer--
-Put headings in hierarchical order.
+```html
+Heading 1
+Heading 2
+Heading 3
+Heading 4
+Heading 5
+Heading 6
+```
### --question--
@@ -113,89 +146,91 @@ alt=""
#### --text--
-What is WAI-ARIA?
+What does WAI-ARIA stand for?
#### --distractors--
-WAI-ARIA is a programming language specifically designed for creating animated web graphics.
+Website Accessible Initiative - Accessible Rust Internet Applications
---
-WAI-ARIA is a set of guidelines for making websites more visually appealing and colorful.
+Web Anchor Initiative - Anchor Rich Internet Applications
---
-WAI-ARIA is a tool for optimizing website loading speeds and server performance.
+Web Accessibility Initial - Accessible Ready Internet Applications
#### --answer--
-WAI-ARIA is a set of standardized practices that helps make online content more accessible to people with disabilities.
+Web Accessibility Initiative - Accessible Rich Internet Applications
### --question--
#### --text--
-What is the function of the `hidden` attribute?
+What is the role of the `aria-hidden` attribute?
#### --distractors--
-To shrink the focused elements.
+This attribute is used to hide elements only for users with visual impairments.
---
-To add tabs.
+This attribute is used to hide and add label text for an element.
---
-To hide an HTML form.
+This attribute is used to hide an element only to keyboard users.
#### --answer--
-To prevent an element from being rendered.
+This attribute is used to hide an element from people using assistive technologies.
### --question--
#### --text--
-What is the function of the `tabindex` attribute?
+Which attribute makes elements focusable and defines the relative order in which they are navigated using the keyboard?
#### --distractors--
-To change the color of focused elements.
+`keyboardindex`
---
-To shrink the focused elements.
+`tabbingindex`
---
-To add tabs.
+`indextab`
#### --answer--
-To control keyboard navigation order and allow programmatic focus on elements that aren't accessible via keyboard.
+`tabindex`
### --question--
#### --text--
-Which of the following is a best practice for creating accessible data tables?
+Why is it a good practice to include the `caption` element inside an HTML table?
#### --distractors--
-Add a caption by using the `` tag.
+It enhances the table's appearance by adding a decorative header.
---
-Use the `aria-label` attribute to make sure that the data cells associate with the proper header.
+It allows users to easily sort and filter the table's data.
---
-Use absolute sizing to make sure that the data cells are not too large.
+It helps improve the table's responsiveness on mobile devices.
+
#### --answer--
-Designate row and/or column headers by using `` elements.
+It is helpful for users to quickly understand the table's purpose and content.
+
### --question--
@@ -223,67 +258,87 @@ The `aria-labelledby` attribute allows you to give an element an accessible name
#### --text--
-What is the function of the `aria-selected` attribute?
+Which of the following ARIA states is used to indicate that an element is selected?
#### --distractors--
-To change the font size of an element.
+`aria-haspopup`
---
-To change the background color of an element.
+`aria-label`
---
-To shrink an element.
+`aria-expanded`
#### --answer--
-To indicate if an element is selected.
+`aria-selected`
### --question--
#### --text--
-What is the function of `aria-expanded`?
+Which of the following is NOT a common ARIA state?
#### --distractors--
-To change the font size of an element.
+`aria-hidden`
---
-To change the background color of an element.
+`aria-checked`
---
-To shrink an element.
+`aria-disabled`
#### --answer--
-To indicate whether a control is currently expanded or collapsed, and whether its associated content is displayed or hidden.
+`aria-columns`
### --question--
#### --text--
-What is the correct way to give an input a label?
+Which of the following examples is the correct way to associate a `label` with an `input` element?
#### --distractors--
-Give the input a `name` attribute.
+```html
+
+```
---
-Add placeholder text to the input.
+```html
+
+```
---
-Pair the input with a `p` element.
+```html
+
+```
#### --answer--
-Use the `for` attribute on `label`s and matching `id` attribute on `input`s to associate them.
+```html
+
+```
### --question--
@@ -293,7 +348,7 @@ How does a screen magnifier help visually-impaired users navigate web pages?
#### --distractors--
-A screen magnifier reads the page's content aloud to the user.
+A screen magnifier will enlarge only images to twice their size so they can be better viewed by visually-impaired users.
---
@@ -311,7 +366,7 @@ A screen magnifier helps visually-impaired users navigate web pages by allowing
#### --text--
-What is the function of the `aria-haspopup` attribute?
+What is the role of the `aria-haspopup` attribute?
#### --distractors--
@@ -333,45 +388,46 @@ To indicate that an element can trigger a popup like a menu or dialog.
#### --text--
-What is a common keystroke to see if a website is keyboard navigation-friendly?
+Which of the following is NOT a commonly used ARIA role?
#### --distractors--
-Enter + 6
+`role="alert"`
---
-Enter
+`role="menu"`
---
-Caps Lock
+`role="tab"`
#### --answer--
-Shift + Tab
+`role="access"`
### --question--
#### --text--
-What is the function of the `aria-live` attribute?
+Which of the following attributes is used to create a live region on your page which can be used to notify screen reader users of dynamic content changes?
+
#### --distractors--
-To record live music performances.
+`aria-label`
---
-To make HTML elements focusable.
+`aria-region`
---
-To make HTML elements smaller.
+`aria-expanded`
#### --answer--
-To indicate that an element's content is dynamic and will be updated, which enables assistive technology to mention those updates to the user.
+`aria-live`
### --question--
@@ -381,15 +437,15 @@ What is the purpose of the `role` attribute?
#### --distractors--
-To style elements with CSS animations.
+To style elements with CSS animations allowing assistive technologies to better understand how the element should be interpreted and interacted with.
---
-To define the visual appearance of HTML elements.
+To define the visual appearance of HTML elements allowing assistive technologies to better understand how the element should be interpreted and interacted with.
---
-To modify HTML tags.
+To add labels to form elements allowing assistive technologies to better understand how the element should be interpreted and interacted with.
#### --answer--
@@ -399,65 +455,65 @@ To specify the type and purpose of an element, allowing assistive technologies t
#### --text--
-What is the best way to make a website's link accessible?
+Why is it important to use descriptive link text for links?
#### --distractors--
-Use phrases like "click here" to describe the link.
+To make the link text stand out visually from the rest of the page content.
---
-Add the site's URL to the link's text.
+To ensure the link loads faster when clicked.
---
-Link to two different URLs using the same words on the same page.
+To ensure that search engines will always list your site as the first result in the list.
#### --answer--
-Avoid linking whole paragraphs.
+To ensure that everyone, including users of assistive technology understand the purpose of the link.
### --question--
#### --text--
-When recording audio for a video, it is best to:
+Which of the following is a best practice for making audio and video content accessible?
#### --distractors--
-Use the latest recording tool.
+Providing high-quality graphics to accompany the audio and video content to make it accessible to people with visual impairments.
---
-Use jargon and terms related to the topic.
+Using bright colors and large text to make the content more engaging and to make it accessible to people with visual impairments.
---
-Speak quickly.
+Limiting the length of audio and video content to make it accessible to people with hearing impairments.
#### --answer--
-Speak slowly and clearly to give users time to process and understand the presented information.
+Providing captions and transcripts for audio and video content to make it accessible to people with hearing impairments.
### --question--
#### --text--
-What is the function of the `aria-checked` attribute?
+Which of the following attributes is used to indicate that an element is in the checked state?
#### --distractors--
-To show a checkmark.
+`aria-checking`
---
-To mark HTML elements.
+`aria-checkbox`
---
-To add a circle.
+`aria-ischecked`
#### --answer--
-To indicate whether an element is checked (`true`), unchecked (`false`), or in an indeterminate state (`mixed`), meaning neither checked nor unchecked.
+`aria-checked`
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-html-tables-and-forms/66ed902df45ce3ece4053ebc.md b/curriculum/challenges/italian/25-front-end-development/quiz-html-tables-and-forms/66ed902df45ce3ece4053ebc.md
index 9333d52145..dfb273d8d4 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-html-tables-and-forms/66ed902df45ce3ece4053ebc.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-html-tables-and-forms/66ed902df45ce3ece4053ebc.md
@@ -7,7 +7,7 @@ dashedName: quiz-html-tables-and-forms
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-arrays/66edcccbba6dacdb65a59067.md b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-arrays/66edcccbba6dacdb65a59067.md
index e86f0e3326..2a996ef3a0 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-arrays/66edcccbba6dacdb65a59067.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-arrays/66edcccbba6dacdb65a59067.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-arrays
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -17,45 +17,62 @@ To pass the quiz, you must correctly answer at least 17 of the 20 questions belo
#### --text--
-What is the correct way to declare a JavaScript array?
+What will be the output for the following code?
+
+```js
+const numbers = [1, 2, 3];
+console.log(numbers[10]);
+```
#### --distractors--
-`let arr = array(1, 2, 3);`
+`[1, 2, 3]`
---
-`let arr = "1, 2, 3";`
+`null`
---
-`let arr = {1, 2, 3};`
+`10`
#### --answer--
-`let arr = [1, 2, 3];`
+`undefined`
### --question--
#### --text--
-What is the key difference between primitive and non-primitive data types?
+Which of the following is the correct way access the string `"Jessica"` from the `developers` array?
#### --distractors--
-Primitives can store multiple values.
+```js
+const developers = ["Jessica", "Naomi", "Tom"];
+developers[1]
+```
---
-Non-primitives cannot hold references to other objects.
+```js
+const developers = ["Jessica", "Naomi", "Tom"];
+developers[2]
+```
---
-Non-primitives store values directly.
+```js
+const developers = ["Jessica", "Naomi", "Tom"];
+developers[-1]
+```
#### --answer--
-Primitives hold direct values, non-primitives hold references.
+```js
+const developers = ["Jessica", "Naomi", "Tom"];
+developers[0]
+```
### --question--
@@ -89,316 +106,291 @@ console.log(index);
#### --text--
-What value will be assigned to the `arr2` variable?
-
-```js
-const arr1 = [1, 2, 3];
-const arr2 = [...arr1, 4, 5];
-console.log(arr2);
-```
+What does the rest syntax do?
#### --distractors--
-`[4, 5, 1, 2, 3]`
+It is used to divide a string into an array of substrings.
---
-`[1, 2, [3, 4, 5]]`
+It is used to add or remove elements from any position in an array.
---
-`[1, 2, 3]`
+It is used to add elements to the end of the array and will return the new length.
#### --answer--
-`[1, 2, 3, 4, 5]`
+It captures the remaining elements of an array into a new array.
### --question--
#### --text--
-What will this code print to the console?
-
-```js
-const colors = ['red', 'blue', 'green', 'yellow'];
-colors.splice(1, 2, 'purple');
-console.log(colors);
-```
+What is array destructuring?
#### --distractors--
-`['red', 'purple', 'green', 'yellow']`
+It is used to concatenate all of the elements of an array into a single string.
---
-`['red', 'blue', 'yellow']`
+It is used to check if an array contains a specific value.
---
-`['red', 'blue', 'green', 'yellow']`
+It is used to remove the last element from an array and will return that removed element.
#### --answer--
-`['red', 'purple', 'yellow']`
+It is used to extract values from arrays and assign them to variables in a more concise and readable way.
### --question--
#### --text--
-What value will be assigned to the `slicedArr` variable?
+What value will be assigned to the `arr2` variable?
```js
-const arr = ['apple', 'banana', 'cherry', 'date'];
-const slicedArr = arr.slice(1, 3);
-console.log(slicedArr);
+const arr1 = [1, 2, 3];
+const arr2 = [...arr1, 4, 5];
+console.log(arr2);
```
#### --distractors--
-`['apple', 'banana']`
+`[4, 5, 1, 2, 3]`
---
-`['cherry', 'date']`
+`[1, 2, [3, 4, 5]]`
---
-`['apple', 'cherry']`
+`[1, 2, 3]`
#### --answer--
-`['banana', 'cherry']`
+`[1, 2, 3, 4, 5]`
### --question--
#### --text--
-Which method returns the first index of a given element in an array?
+What will this code log to the console?
+
+```js
+const colors = ["red", "blue", "green", "yellow"];
+colors.splice(1, 2, "purple");
+console.log(colors);
+```
#### --distractors--
-`findIndex()`
+`["red", "blue", "green", "yellow"]`
---
-`lastIndexOf()`
+`["red", "blue", "yellow"]`
---
-`slice()`
+`["red", "yellow"]`
#### --answer--
-`indexOf()`
+`["red", "purple", "yellow"]`
### --question--
#### --text--
-Which method removes the first element from an array and shifts all other elements down?
+What value will be assigned to the `slicedArr` variable?
+
+```js
+const arr = ["apple", "banana", "cherry", "date"];
+const slicedArr = arr.slice(1, 3);
+console.log(slicedArr);
+```
#### --distractors--
-`pop()`
+`["apple", "banana"]`
---
-`slice()`
+`["cherry", "date"]`
---
-`splice()`
+`["apple", "cherry"]`
#### --answer--
-`shift()`
+`["banana", "cherry"]`
### --question--
#### --text--
-What does `Array.prototype.concat()` do?
+Which method returns the first index of a given element in an array?
#### --distractors--
-Joins array elements into a string.
+`firstIndex()`
---
-Adds an element to the beginning of an array.
+`lastIndex()`
---
-Removes an element from the array.
+`searchIndex()`
#### --answer--
-Merges two arrays into a new array.
+`indexOf()`
### --question--
#### --text--
-What happens if you set an array's length to a value smaller than the current length?
+Which method is used to remove the first element from an array and returns that removed element?
#### --distractors--
-It throws a syntax error.
+`pop()`
---
-The extra space is filled with `undefined`.
+`slice()`
---
-Nothing happens; the array remains the same size.
+`splice()`
#### --answer--
-The array gets truncated, removing elements beyond the new length.
+`shift()`
### --question--
#### --text--
-What will be the output of this code ?
-
-```js
-const fruits = ['apple', 'banana', 'cherry', 'apple', 'orange'];
-const index = fruits.indexOf('apple');
-if (index !== -1) {
- fruits.splice(index, 1);
-}
-console.log(fruits);
-```
+What does the `concat()` method do?
#### --distractors--
-`['banana', 'cherry', 'orange']`
+Joins array elements into a string.
---
-`['apple', 'cherry', 'apple', 'orange']`
+Adds an element to the beginning of an array.
---
-`['banana', 'cherry', 'apple']`
+Removes an element from the array.
#### --answer--
-`['banana', 'cherry', 'apple', 'orange']`
+Merges two arrays into a new array.
### --question--
#### --text--
-What is the final value of `result` in the following code?
+What will be the output of this code?
```js
-const arr1 = [1, 2];
-const arr2 = [3, 4, 5];
-const combined = arr1.concat(arr2);
-const result = combined.includes(3);
-console.log(result);
+const fruits = ["apple", "banana", "cherry", "apple", "orange"];
+
+fruits.splice(0, 1);
+
+console.log(fruits);
```
#### --distractors--
-`false`
+`["apple", "banana", "cherry", "apple", "orange"]`
---
-`[1, 2, 3, 4, 5]`
+`["apple", "banana", "cherry"]`
---
-`undefined`
+`["cherry", 'apple']`
#### --answer--
-`true`
+`["banana", "cherry", "apple", "orange"]`
### --question--
#### --text--
-What does the following code output?
-
-```js
-const nums = [1, 2, 3, 4];
-const doubled = nums.map(n => n * 2);
-console.log(doubled.includes(8));
-```
+What does the `includes()` method do?
#### --distractors--
-`false`
+It is used to divide a string into an array of substrings.
---
-`[2, 4, 6, 8]`
+It is used to concatenate all of the elements of an array into a single string.
---
-`Error`
+It is used to add or remove elements from any position in an array.
#### --answer--
-`true`
+It is used to check if an array contains a specific value.
### --question--
#### --text--
-What is the output when using `splice()` to remove elements from a 2D array?
-
-```js
-let matrix = [
- [1, 2, 3],
- [4, 5, 6],
- [7, 8, 9]
-];
-matrix.splice(1, 1);
-console.log(matrix);
-```
+Which of the following methods is used to reverse an array in place?
#### --distractors--
-`[[1, 2, 3], [4, 5, 6]]`
+`reversed()`
---
-`[[1, 2], [4, 5], [7, 8]]`
+`reverseArr()`
---
-`[[7, 8, 9]]`
+`reversing()`
#### --answer--
-`[[1, 2, 3], [7, 8, 9]]`
+`reverse()`
### --question--
#### --text--
-Which of the following statements about `.length` is correct?
+What is a two dimensional array?
#### --distractors--
-It counts the number of values in a 2D array.
+An array that only contains object literals.
---
-It returns `undefined` for empty arrays.
+An array of fixed length.
---
-It gives the total number of elements in a 2D array.
+An array of floating point numbers.
#### --answer--
-It counts the number of top-level elements in a 2D array.
+An array of arrays.
### --question--
@@ -426,75 +418,73 @@ It returns `-1` if the element is not found.
#### --text--
-What is the main difference between `push()` and `concat()` when working with arrays?
+Which of the following is NOT an array method?
#### --distractors--
-`push()` adds multiple arrays together, while `concat()` adds a single element.
+`includes()`
---
-`concat()` modifies the original array, while `push()` creates a new array.
+`pop()`
---
-Both `push()` and `concat()` are immutable methods.
+`push()`
#### --answer--
-`push()` modifies the original array, while `concat()` creates a new array.
+`keys()`
### --question--
#### --text--
-How does the rest parameter `...rest` work in array destructuring in JavaScript?
+What will be the output for the following code?
+
+```js
+const arr = ["o", "l", "l", "e", "h"];
+console.log(arr.join(""));
+```
#### --distractors--
-It is used to add extra elements to the array.
+`["o", "l", "l", "e", "h"]`
---
-It allows you to access elements outside the array's bounds.
+`"hello"`
---
-It removes the last element of the array.
+`undefined`
#### --answer--
-It collects the remaining elements into a new array after the initial elements are assigned to variables.
+`"olleh"`
### --question--
#### --text--
-What will be the result of this code ?
+What will be the result of using the `shift()` method on an empty array?
-```js
-const numbers = [10, 20, 30];
-numbers.push(40);
-numbers.pop();
-const length = numbers.length;
-console.log(length);
-```
#### --distractors--
-2
+`TypeError`
---
-5
+`[]`
---
-4
+`null`
#### --answer--
-3
+`undefined`
### --question--
@@ -504,7 +494,7 @@ Which method will return a new array without changing the original array?
#### --distractors--
-`splice()`
+`shift()`
---
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-audio-and-video/66edd3b3096349f06cf688bb.md b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-audio-and-video/66edd3b3096349f06cf688bb.md
index 01af9a24ea..7d821914e4 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-audio-and-video/66edd3b3096349f06cf688bb.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-audio-and-video/66edd3b3096349f06cf688bb.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-audio-and-video
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-classes/67358ac128957c865dcf3ddf.md b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-classes/67358ac128957c865dcf3ddf.md
index 0dfe06296f..e06087a7bd 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-classes/67358ac128957c865dcf3ddf.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-classes/67358ac128957c865dcf3ddf.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-classes
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-comparisons-and-conditionals/66edc47c11492ac5cf258ad9.md b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-comparisons-and-conditionals/66edc47c11492ac5cf258ad9.md
index b01389747e..47999af6dc 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-comparisons-and-conditionals/66edc47c11492ac5cf258ad9.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-comparisons-and-conditionals/66edc47c11492ac5cf258ad9.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-comparisons-and-conditionals
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-dates/66edd3711bb9f7efa73aef91.md b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-dates/66edd3711bb9f7efa73aef91.md
index 13af765c56..23bf2405bd 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-dates/66edd3711bb9f7efa73aef91.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-dates/66edd3711bb9f7efa73aef91.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-dates
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-events/66edd0ac31fea6e678eb925a.md b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-events/66edd0ac31fea6e678eb925a.md
index 74b23bfcb7..5736bbd1e8 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-events/66edd0ac31fea6e678eb925a.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-events/66edd0ac31fea6e678eb925a.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-events
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-functional-programming/66edd4f31ff19bf5573bf64b.md b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-functional-programming/66edd4f31ff19bf5573bf64b.md
index 26d0998da5..7c59a461c7 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-functional-programming/66edd4f31ff19bf5573bf64b.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-functional-programming/66edd4f31ff19bf5573bf64b.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-functional-programming
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-functions/66edcc779993c0da6906dbb9.md b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-functions/66edcc779993c0da6906dbb9.md
index 623be232b7..dd7f298fdf 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-functions/66edcc779993c0da6906dbb9.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-functions/66edcc779993c0da6906dbb9.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-functions
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -17,468 +17,543 @@ To pass the quiz, you must correctly answer at least 17 of the 20 questions belo
#### --text--
-What is the correct syntax for a function declaration?
+Which of the following is the correct way to declare a function in JavaScript?
#### --distractors--
-`var myFunction = function() {};`
+```js
+func greet () {
+ console.log("Hello there!");
+}
+```
---
-`myFunction: function() {}`
+```js
+defineFunction greet () {
+ console.log("Hello there!");
+}
+```
---
-`function = myFunction();`
+```js
+def greet () {
+ console.log("Hello there!");
+}
+```
#### --answer--
-`function myFunction() {}`
+```js
+function greet () {
+ console.log("Hello there!");
+}
+```
### --question--
#### --text--
-Which of the following is a valid function expression?
+What happens when you call (or execute) a function?
#### --distractors--
-```js
-function getSum(x, y) {
- return x + y;
-};
-```
+The code inside the function will run and `null` will always be returned.
---
-```js
-getSum: function(x, y) {
- return x + y;
-};
-```
+Nothing will happen when you call a function.
---
-```js
-function = getSum(x, y) {
- return x + y;
-};
-```
+A `TypeError` will be thrown and the program will crash.
#### --answer--
-```js
-getSum = function(x, y) {
- return x + y;
-};
-```
+The code inside the function will run and a value will be returned.
### --question--
#### --text--
-Where can function expressions be used?
+Which of the following is the correct way to call a function?
#### --distractors--
-Only within other functions
+```js
+exampleFunction;
+```
---
-Only as part of an object literal
+```js
+exampleFunction>>;
+```
---
-Only in the global scope
+```js
+()exampleFunction();
+```
#### --answer--
-Anywhere a variable can be used
+```js
+exampleFunction();
+```
### --question--
#### --text--
-What is the difference between a function expression and a function declaration?
+What is the role of the `return` keyword?
#### --distractors--
-Function expressions can be hoisted, while function declarations cannot.
+The `return` keyword will execute the function.
---
-Both function expressions and function declarations can be hoisted.
+The `return` keyword will throw a type error.
---
-Neither function expressions nor function declarations can be hoisted.
+The `return` keyword serves no purpose in functions.
#### --answer--
-Function declarations can be hoisted, while function expressions cannot.
+The `return` keyword returns a value from the function.
### --question--
#### --text--
-What does it mean for functions to be first-class citizens in JavaScript?
+Which of the following is a valid function expression?
#### --distractors--
-They can be assigned to variables.
+```js
+expression function getSum(x, y) {
+ return x + y;
+};
+```
---
-They can be passed as arguments to other functions.
+```js
+getSum: function(x, y) {
+ return x + y;
+};
+```
---
-They can be returned from functions.
+```js
+function = getSum(x, y) {
+ return x + y;
+};
+```
#### --answer--
-All of the answers are correct.
+```js
+const getSum = function(x, y) {
+ return x + y;
+};
+```
### --question--
#### --text--
-Which of the following is a common use case for first-class functions in JavaScript?
+What are function arguments?
#### --distractors--
-Implementing object-oriented programming
+Values that represents the absence of a value.
---
-Defining global variables
+Special values that act similar to anonymous functions.
---
-Creating custom data types
+Placeholder values used inside of the function.
#### --answer--
-Creating higher-order functions
+Real values passed to a function when it is called.
### --question--
#### --text--
-Which of the following is an example of a first-class function?
+What are function parameters?
#### --distractors--
-```js
-function greet(name) {
- console.log("Hello, " + name);
-}
-```
+Floating point values used inside of the function.
---
-```js
-var greet = function(name) {
- console.log("Hello, " + name);
-};
-```
+Values passed to a function when it is called.
---
-```js
-const greet = (name) => {
- console.log("Hello, " + name);
-}
-```
+Values that represent the intentional absence of the value.
#### --answer--
-All of the answers are correct.
+Values listed inside the function definition.
### --question--
#### --text--
-Which of the following is not a common use case for first-class functions?
+What value will be returned in the following code example?
+
+```js
+function greet () {
+ console.log("Hello there!");
+}
+
+greet();
+```
#### --distractors--
-Defining object methods
+`NaN`
---
-Implementing closures
+`TypeError`
---
-Creating callbacks
+`null`
#### --answer--
-Creating custom data types
+`undefined`
### --question--
#### --text--
-What is the syntax for an arrow function?
+Which of the following is the correct syntax for an arrow function?
#### --distractors--
-`myFunction: function() {}`
+```js
+const sum <<>> (num1, num2) => num1 + num2
+```
---
-`function myFunction() {}`
+```js
+const sum === (num1, num2) === num1 + num2
+```
---
-`const myFunction = function() {};`
+```js
+const sum >=> (num1, num2) => num1 + num2
+```
#### --answer--
-`myFunction = () => { ... };`
+```js
+const sum = (num1, num2) => num1 + num2
+```
### --question--
#### --text--
-What is the difference between a regular function and an arrow function?
+What will be result for the following code?
+
+```js
+function greet() {
+ const developer = "Jessica";
+ console.log("Hello there!");
+}
+
+console.log(developer);
+```
#### --distractors--
-Arrow functions do not have their own 'this' binding.
+Nothing will happen and the code will run normally.
---
-Arrow functions cannot be used as constructors.
+The string `"Hello there!"` will be logged to the console.
---
-Arrow functions cannot be used with the 'new' keyword.
+The string `"Hello!"` will be logged to the console.
#### --answer--
-All of the answers are correct.
+You will get a reference error because `developer` is not defined globally.
### --question--
#### --text--
-You can also call arrow function as
+When can you omit a set of parentheses around a parameter list for an arrow function?
#### --distractors--
-Lambda function
+You should always omit the parentheses around a parameter list.
---
-Fat arrow function
+You are never supposed to omit the parentheses for an arrow function.
---
-Neither Lambda function or Fat arrow function
+You should only omit the parentheses when you are working with multiple parameters.
#### --answer--
-Both Lambda function and Fat arrow function
+You should only omit the parentheses when you only have one parameter.
### --question--
#### --text--
-What is the benefit of using arrow functions?
+When can you omit the curly braces and `return` keyword for an arrow function?
#### --distractors--
-You can omit curly braces and return keyword if your output is going to be a single line.
+You should always omit the curly braces and `return` keyword.
---
-They provide easy syntax while writing promises and callbacks.
+You should never omit the curly braces and `return` keyword.
---
-They have short syntax and increase readability.
+When the function body has multiple lines of code.
#### --answer--
-All of the answers are correct.
+When the function body consists of a single expression.
### --question--
#### --text--
-What is the difference between a function and a method?
+What will be the result for the following code?
+
+```js
+function exampleFunction () {
+
+}
+exampleFunction();
+```
#### --distractors--
-There is no difference between functions and methods.
+The program will crash.
---
-Functions and methods are properties of objects
+JavaScript will skip over that piece of code.
---
-Functions are properties of objects, while methods are standalone functions.
+An error message will display.
#### --answer--
-Methods are properties of objects, while functions are standalone functions.
+Nothing will happen.
### --question--
#### --text--
-Can a method be used outside of its object?
+Which of the following is the correct way to use default parameters?
#### --distractors--
-Yes, methods can be used anywhere a function can be used.
+```js
+function sum (num1, num2 <<>> 12) {
+ return num1 + num2
+}
+```
---
-Methods can be used outside of their object, but only if they are bound to a specific 'this' value.
+```js
+function sum (num1, num2 === 12) {
+ return num1 + num2
+}
+```
---
-Methods can be used outside of their object, but only if they are defined as arrow functions.
+```js
+function sum (num1, num2 >> 12) {
+ return num1 + num2
+}
+```
#### --answer--
-No, methods can only be used within their object.
+```js
+function sum (num1, num2 = 12) {
+ return num1 + num2
+}
+```
### --question--
#### --text--
-Which of the following is an example of a method?
-
-#### --distractors--
+What will be the result for the following code?
```js
-function greet(name) {
- console.log("Hello, " + name);
+const developer = "Jessica";
+
+function greet() {
+ console.log("Hello, " + developer)
}
+
+greet();
```
+#### --distractors--
+
+The string `"Hello, developer"` will be logged to the console.
+
---
-```js
-var greet = function(name) {
- console.log("Hello, " + name);
-};
-```
+An error message will display in the console.
---
-All of them.
+Nothing will display in the console.
#### --answer--
-```js
-const person = {
- name: "Alice",
- greet: function() {
- console.log("Hello, my name is " + this.name);
- }
-};
-```
+The string `"Hello, Jessica"` will be logged to the console.
### --question--
#### --text--
-What is the benefit of using methods instead of functions?
+What happens if you try to remove the curly braces for a regular function?
#### --distractors--
-Methods provide a more organized way to group related functionality.
+An alert box will display on the page with an error.
---
-Methods can be accessed using dot notation, which can make code more readable.
+The program will crash and not start again.
---
-Methods have access to the properties and methods of their object.
+Nothing will happen.
#### --answer--
-All of the answers are correct.
+You will get a syntax error.
### --question--
#### --text--
-What is the difference between arguments and parameters?
+What will be the result for the following code?
+
+```js
+const sum = (num1, num2) => num1 + num2
+console.log(sum(0, 0) + 10);
+```
#### --distractors--
-There is no difference between arguments and parameters.
+An error message will display in the console.
---
-Parameters are the actual values passed to a function when it is called, while arguments are the names of variables used in a function definition.
+The number `0` will be logged to the console.
---
-Arguments and parameters are used interchangeably.
+Nothing will be logged to the console.
#### --answer--
-Parameters are the names of variables used in a function definition, while arguments are the actual values passed to the function when it is called.
+The number `10` will be logged to the console.
### --question--
#### --text--
-What happens if a function is called with more arguments than it expects?
+What will be the output for the following code?
+
+```js
+const exampleFunction = (param1, param2) => param1 + param2;
+console.log(exampleFunction(3, "Something"));
+```
#### --distractors--
-The extra arguments will be assigned to the remaining parameters.
+`null`
---
-The function will throw an error.
+`undefined`
---
-The function will use the default values specified in the function definition.
+`3 + "Something"`
#### --answer--
-The extra arguments will be ignored.
+`"3Something"`
### --question--
#### --text--
-What is the correct syntax for defining a function with default parameter values?
+What will be the result for the following code?
+
+```js
+const sum = (num1, num2) => num1 + num2
+console.log(sum(0, 0) + num2);
+```
#### --distractors--
-`function myFunction(param1 = value1, param2) { ... }`
+An error message saying `num1` is not defined.
---
-`function myFunction(param1, param2 = value2) { ... }`
+The number `0` will be displayed in the console.
---
-`function myFunction(param1: value1, param2: value2) { ... }`
+`undefined` will be displayed in the console.
#### --answer--
-`function myFunction(param1 = value1, param2 = value2) { ... }`
+An error message saying `num2` is not defined.
### --question--
#### --text--
-What is the default value for a missing argument in a function call?
+What will be the output for the following code?
+
+```js
+const divideTwoNumbers = (num1, num2) => num1 / num2;
+console.log(divideTwoNumbers(3, 0));
+```
#### --distractors--
@@ -494,5 +569,5 @@ What is the default value for a missing argument in a function call?
#### --answer--
-`undefined`
+`Infinity`
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-fundamentals/66edcd875b0d91de1fbbb492.md b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-fundamentals/66edcd875b0d91de1fbbb492.md
index 43ab730256..36e3ec148f 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-fundamentals/66edcd875b0d91de1fbbb492.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-fundamentals/66edcd875b0d91de1fbbb492.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-fundamentals
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-higher-order-functions/66edcdd18a4ef8df16e6bb7e.md b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-higher-order-functions/66edcdd18a4ef8df16e6bb7e.md
index 7be9dba11e..de53f54549 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-higher-order-functions/66edcdd18a4ef8df16e6bb7e.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-higher-order-functions/66edcdd18a4ef8df16e6bb7e.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-higher-order-functions
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-loops/66edcd49e73385dd4df54ac7.md b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-loops/66edcd49e73385dd4df54ac7.md
index 8f79dade85..765b9aa915 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-loops/66edcd49e73385dd4df54ac7.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-loops/66edcd49e73385dd4df54ac7.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-loops
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-maps-and-sets/67358be1c7903489c0a7db78.md b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-maps-and-sets/67358be1c7903489c0a7db78.md
index 9f9c01a60e..0c9007b514 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-maps-and-sets/67358be1c7903489c0a7db78.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-maps-and-sets/67358be1c7903489c0a7db78.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-maps-and-sets
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-math/66edc3ab8c6413c344f401bf.md b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-math/66edc3ab8c6413c344f401bf.md
index 23c49152c8..fa9233cfd8 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-math/66edc3ab8c6413c344f401bf.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-math/66edc3ab8c6413c344f401bf.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-math
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -17,53 +17,33 @@ To pass the quiz, you must correctly answer at least 17 of the 20 questions belo
#### --text--
-What is the result of this code?
-
-``` js
-const num1 = Number('888');
-const num2 = new Number('777');
-
-console.log(num1 === 888);
-console.log(num2 === 777);
-```
+What does `NaN` stand for?
#### --distractors--
-```js
-true
-true
-```
+`Numeric and Number`
---
-```js
-false
-false
-```
+`Not a Null`
---
-```js
-false
-true
-```
+`Null and Number`
#### --answer--
-```js
-true
-false
-```
+`Not a Number`
### --question--
#### --text--
-Which of the following is not an arithmetic operator in JavaScript?
+Which of the following is NOT an arithmetic operator in JavaScript?
#### --distractors--
-`%`
+`*`
---
@@ -71,71 +51,55 @@ Which of the following is not an arithmetic operator in JavaScript?
---
-`--`
+`-`
#### --answer--
-`==`
+`??`
### --question--
#### --text--
-Which of the following will log the correct gross profit?
+What happens if you try to divide by zero in JavaScript?
#### --distractors--
-``` js
-let store1_sales = 7500;
-let store2_sales = 6000;
-console.log("Total Sales: " + store1_sales + store2_sales);
-```
+JavaScript will output 0
---
-``` js
-let store1_sales = 7500;
-let store2_sales = 6000;
-console.log("Total Sales: " + store1_sales - store2_sales);
-```
+Nothing will happen
---
-``` js
-let store1_sales = 7500;
-let store2_sales = 6000;
-console.log("Total Sales: " + (store1_sales - store2_sales));
-```
+JavaScript will throw an error
#### --answer--
-``` js
-let store1_sales = 7500;
-let store2_sales = 6000;
-console.log("Total Sales: " + (store1_sales + store2_sales));
-```
+JavaScript will output `Infinity`
### --question--
#### --text--
-What is the result of the statement `25 * 4 - 16 / (2 * 4) + 8`?
+Which of the following is the correct use of the exponentiation operator?
#### --distractors--
-`18.5`
+`2*3`
---
-`107.5`
+`2#3`
---
-`17`
+`2%3`
#### --answer--
-`106`
+`2**3`
### --question--
@@ -163,7 +127,7 @@ Which operator should you use when decrementing a variable in JavaScript?
#### --text--
-Which of the following is not a bitwise operator?
+Which of the following is NOT a bitwise operator?
#### --distractors--
@@ -229,89 +193,89 @@ The `==` operator only compares values whereas the `===` operator compares value
#### --text--
-Which of the following statements are false about unary plus (`+`) operators?
+What is the unary plus operator (`+`) used for?
#### --distractors--
-It tries to convert the operand into a number.
+It is used to decrement a value by one.
---
-It is the fastest way to convert an operand to a number.
+It is used to get the remainder from an operation.
---
-It can convert operands with negative numbers except for hexadecimals.
+It is used to invert the binary representation of a number.
#### --answer--
-It can't convert `true`, `false`, or `null` into a number.
+It is used to convert its operand into a number.
### --question--
#### --text--
-Which method in the built-in Math object is used to round up a number?
+Which of the following `Math` methods rounds a value to the nearest whole integer?
#### --distractors--
-`Math.round(num)`
+`Math.trunc()`
---
-`Math.floor(num)`
+`Math.max()`
---
-`Math.fround(num)`
+`Math.min()`
#### --answer--
-`Math.ceil(num)`
+`Math.round()`
### --question--
#### --text--
-Which of the following Math object methods are used to raise a base to a power?
+What does the `Math.sqrt()` method do?
#### --distractors--
-`Math.exp(base, power)`
+This method returns a random floating point number.
---
-`Math.raise(base, power)`
+This method returns the absolute value for a number.
---
-`Math.e(base, power)`
+This method returns the cube of a number.
#### --answer--
-`Math.pow(base, power)`
+This method returns the square root of a number.
### --question--
#### --text--
-Which of the following is the correct method for generating a random number in JavaScript?
+Which of the following is NOT a valid method for the `Math` object?
#### --distractors--
-`Math.rand(1,10)`
+`Math.ceil()`
---
-`Math.rand()`
+`Math.pow()`
---
-`Math.random(1,10)`
+`Math.abs()`
#### --answer--
-`Math.random()`
+`Math.extend()`
### --question--
@@ -321,11 +285,11 @@ Which of the following will return `false`?
#### --distractors--
-`isNaN("1998", "1999")`
+`isNaN("Matt")`
---
-`isNaN({})`
+`isNaN()`
---
@@ -333,105 +297,114 @@ Which of the following will return `false`?
#### --answer--
-`isNaN(null)`
+`isNaN(7)`
### --question--
#### --text--
-Which of the following will convert `172` to its hexadecimal equivalent?
+What does the `parseFloat()` method do?
#### --distractors--
-`(-0xa5).toString(2);`
+It parses a string argument and performs a bitwise operation on it.
---
-`(172).string(0x);`
+It parses a string argument and returns `false`.
---
-`(172).parseString(0x);`
+It parses a string argument and returns an integer.
#### --answer--
-`(172).toString(16);`
+It parses a string argument and returns a floating-point number.
### --question--
#### --text--
-Which of the following is the right way to convert a string to an integer?
+What will be logged to the console?
+
+```js
+const num = 5;
+console.log(++num);
+```
#### --distractors--
-`parseINT("300")`
+`error`
---
-`int("300")`
+`null`
---
-`integer("300")`
+`5`
#### --answer--
-`parseInt("300")`
+`6`
### --question--
#### --text--
-Which of the following statements is false?
+What would be the output for the following code?
+
+```js
+console.log(5 == '5');
+```
#### --distractors--
-`parseFloat()` ignores trailing invalid characters
+`undefined`
---
-`parseFloat()` can parse a string that begins with `Infinity` or `-Infinity`
+`false`
---
-`parseFloat("0x1f")` will return `0`
+`null`
#### --answer--
-`parseFloat()` requires two parameters
+`true`
### --question--
#### --text--
-Which of the following is false?
+What is operator precedence?
#### --distractors--
-A number greater than 100 as an argument to the `Number.prototype.toFixed()` method will result to a range error
+Operator precedence is used to check if the value on the left is less than the one on the right.
---
-`Number.prototype.toFixed(numDecimalPlaces)` is used to return a number converted to a string with decimals places depending on the argument
+Operator precedence is used to raise a variable to the power of the specified number and reassigns the result to the variable.
---
-Calling the `Number.prototype.toFixed()` method on a number object with decimal points and no argument will round the number to the nearest ones
+Operator precedence is used to to increase the value by one.
#### --answer--
-Using `Number.prototype.toFixed()` without an argument will by default add a decimal point followed by a zero
+Operator precedence determines the order in which operations are evaluated in an expression.
### --question--
#### --text--
-Which of the following is not a comparison operator?
+Which of the following is NOT a comparison operator?
#### --distractors--
-`!=`
+`>`
---
@@ -439,7 +412,7 @@ Which of the following is not a comparison operator?
---
-`===`
+`<`
#### --answer--
@@ -449,43 +422,75 @@ Which of the following is not a comparison operator?
#### --text--
-Which of the following is false?
+What does the unary negation operator (`-`) do?
#### --distractors--
-Exponentiation has a lower operator precedence than the grouping operator `()`.
+It flips the boolean value of its operand.
---
-Postfix operators like `x++` or `x--` has higher precedence than prefix operators.
+It decreases the value by one.
---
-Relational operators like `>` or `<` has higher precedence than equality operators.
+It increases the value by one.
#### --answer--
-Logical operator like `AND` and `OR` have higher precedence than bitwise operators.
+It negates the operand.
### --question--
#### --text--
-`Math.random()` returns a number in what range?
+Which of the following is an example of using the nullish coalescing operator?
#### --distractors--
-`Math.random()` returns a number between 0 (inclusive) and 1 (inclusive)
+```js
+const userSettings = {
+ theme: null,
+ volume: 0,
+ notifications: false,
+};
+
+userSettings.theme () 'light';
+```
---
-`Math.random()` returns a number between 0 (exclusive) and 1 (inclusive)
+```js
+const userSettings = {
+ theme: null,
+ volume: 0,
+ notifications: false,
+};
+
+userSettings.theme ** 'light';
+```
---
-`Math.random()` returns a number between 0 (exclusive) and 1 (exclusive)
+```js
+const userSettings = {
+ theme: null,
+ volume: 0,
+ notifications: false,
+};
+
+userSettings.theme \\ 'light';
+```
#### --answer--
-`Math.random()`returns a number between 0 (inclusive) and 1 (exclusive)
+```js
+const userSettings = {
+ theme: null,
+ volume: 0,
+ notifications: false,
+};
+
+userSettings.theme ?? 'light';
+```
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-objects/66edcd0ecb4b25dc64a34804.md b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-objects/66edcd0ecb4b25dc64a34804.md
index ed8a322ec7..32d7860e61 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-objects/66edcd0ecb4b25dc64a34804.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-objects/66edcd0ecb4b25dc64a34804.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-objects
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-regular-expressions/66edd3011f18f4ee1bd9d28b.md b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-regular-expressions/66edd3011f18f4ee1bd9d28b.md
index 3ba595809d..9a372d5f6d 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-regular-expressions/66edd3011f18f4ee1bd9d28b.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-regular-expressions/66edd3011f18f4ee1bd9d28b.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-regular-expressions
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-strings/66edc31c44f1b9c1d5c5ebca.md b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-strings/66edc31c44f1b9c1d5c5ebca.md
index b8c343bfbe..4a89fdc6d1 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-strings/66edc31c44f1b9c1d5c5ebca.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-strings/66edc31c44f1b9c1d5c5ebca.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-strings
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -65,19 +65,19 @@ Which of the following options is the newline character?
#### --distractors--
-`'\newline'`
+`\newline`
---
-`'\new'`
+`\new`
---
-`'\line'`
+`\line`
#### --answer--
-`'\n'`
+`\n`
### --question--
@@ -205,57 +205,56 @@ developer[2];
#### --text--
-How can you obtain the ASCII value of a character in a string?
+How can you obtain the ASCII value of the first character in the string `"hello"`?
#### --distractors--
-`str.charCode()`
+`"hello".charCode(0)`
---
-`str.codeAt()`
+`"hello".codeAt(0)`
---
-`str.getCharIndex()`
+`"hello".getCharIndex(0)`
#### --answer--
-`str.charCodeAt()`
+`"hello".charCodeAt(0)`
### --question--
#### --text--
-How can you obtain the character corresponding to an ASCII value?
+Which method can you use to obtain the character corresponding to an ASCII value?
#### --distractors--
-`String.toASCII()`
+`toASCII()`
---
-`String.toChar()`
+`toChar()`
---
-`String.toCode()`
+`toCode()`
#### --answer--
-`String.fromCharCode()`
+`fromCharCode()`
### --question--
#### --text--
-Which of the following `indexOf` examples will correctly return -1?
+Which of the following `indexOf` examples will log `-1` to the console?
#### --distractors--
```js
const organization = "freeCodeCamp";
-
console.log(organization.indexOf("e"));
```
@@ -263,7 +262,6 @@ console.log(organization.indexOf("e"));
```js
const organization = "freeCodeCamp";
-
console.log(organization.indexOf("f"));
```
@@ -271,7 +269,6 @@ console.log(organization.indexOf("f"));
```js
const organization = "freeCodeCamp";
-
console.log(organization.indexOf("C"));
```
@@ -279,7 +276,6 @@ console.log(organization.indexOf("C"));
```js
const organization = "freeCodeCamp";
-
console.log(organization.indexOf("c"));
```
@@ -287,23 +283,23 @@ console.log(organization.indexOf("c"));
#### --text--
-How can you check if the string `"JavaScript"` contains a specific substring?
+How can you check if the string `"JavaScript"` contains `"Script"`?
#### --distractors--
-`"JavaScript".has()`
+`"JavaScript".has("Script")`
---
-`"JavaScript".contains()`
+`"JavaScript".contains("Script")`
---
-`"JavaScript".exists()`
+`"JavaScript".exists("Script")`
#### --answer--
-`"JavaScript".includes()`
+`"JavaScript".includes("Script")`
### --question--
@@ -313,7 +309,7 @@ Which of the following extracts the substring `"Script"` from the string `"JavaS
#### --distractors--
-`"JavaScript".remove(3)`
+`"JavaScript".find(5)`
---
@@ -321,7 +317,7 @@ Which of the following extracts the substring `"Script"` from the string `"JavaS
---
-`"JavaScript".cut(3)`
+`"JavaScript".cut(5)`
#### --answer--
@@ -375,23 +371,23 @@ How do you convert the string `"JavaScript"` to lowercase?
#### --text--
-Which of the following methods is used to find a specified value in a string and replace it with another value?
+Which of the following will replace `"dogs"` with `"cats"` in the string `"I love dogs"`.
#### --distractors--
-`indexOf()`
+`"I love dogs".slice("dogs", "cats")`
---
-`replaceWith()`
+`"I love dogs".replaceWith("dogs", "cats")`
---
-`find()`
+`"I love dogs".find("dogs", "cats")`
#### --answer--
-`replace()`
+`"I love dogs".replace("dogs", "cats")`
### --question--
@@ -401,25 +397,25 @@ Which method is used to repeat a string a specified number of times?
#### --distractors--
-`str.times()`
+`times()`
---
-`str.repeatTimes()`
+`repeatTimes()`
---
-`str.repeatNumber()`
+`repeatNumber()`
#### --answer--
-`str.repeat()`
+`repeat()`
### --question--
#### --text--
-What will the following code return: `'abc'.repeat(3)`?
+What will the following code return: `"abc".repeat(3)`?
#### --distractors--
@@ -441,23 +437,23 @@ It will throw an error.
#### --text--
-How do you remove whitespace from the beginning and end of a string?
+Which method will remove whitespace from the beginning and end of a string?
#### --distractors--
-`str.strip()`
+`strip()`
---
-`str.removeWhitespace()`
+`removeWhitespace()`
---
-`str.trimWhitespace()`
+`trimWhitespace()`
#### --answer--
-`str.trim()`
+`trim()`
### --question--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-variables-and-data-types/66edc25ae5ea80bf6f785552.md b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-variables-and-data-types/66edc25ae5ea80bf6f785552.md
index c84a01b0e9..fd6f7460d3 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-javascript-variables-and-data-types/66edc25ae5ea80bf6f785552.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-javascript-variables-and-data-types/66edc25ae5ea80bf6f785552.md
@@ -7,7 +7,7 @@ dashedName: quiz-javascript-variables-and-data-types
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
@@ -17,7 +17,7 @@ To pass the quiz, you must correctly answer at least 17 of the 20 questions belo
#### --text--
-What is JavaScript?
+Which of the following best describes JavaScript?
#### --distractors--
@@ -33,7 +33,7 @@ A database management system.
#### --answer--
-A programming language primarily used for web development.
+A programming language used for web development.
### --question--
@@ -43,19 +43,19 @@ Which of the following is NOT a JavaScript data type?
#### --distractors--
-`null`
+`Number`
---
-`undefined`
+`Undefined`
---
-`bigInt`
+`Object`
#### --answer--
-`double`
+`Double`
### --question--
@@ -77,29 +77,29 @@ Which of the following is NOT a valid JavaScript variable declaration?
#### --answer--
-`public final Long x;`
+`public Int x;`
### --question--
#### --text--
-Which of the following is a conventional variable name in JavaScript?
+Which of the following is a common naming convention for variables in JavaScript?
#### --distractors--
-`my_var`
+JavaScript case
---
-`my-var`
+Lightning case
---
-`MyVar`
+Giraffe case
#### --answer--
-`myVar`
+Camel case
### --question--
@@ -127,28 +127,23 @@ What is the difference between `let` and `const` variable declarations in JavaSc
#### --text--
-What would be the outcome of the following code?
-
-```js
-let name = "Andy";
-name[0] = "M";
-```
+Why are strings considered immutable in JavaScript?
#### --distractors--
-The value of `name` would be `"MAndy"`.
+You cannot create strings using variables.
---
-The value of `name` would be `"Mndy"`.
+Strings can only be created using literals.
---
-The value of `name` would still be `"Andy"`.
+You can change strings, but only through global variables.
#### --answer--
-It would throw an error.
+Once a string is created, you cannot change its characters directly.
### --question--
@@ -186,7 +181,7 @@ console.log(hello);
#### --distractors--
-Reassigns `world` to the variable `hello`, and prints it out in the console.
+Reassigns `" world"` to the variable `hello`, and prints it out in the console.
---
@@ -194,33 +189,33 @@ Prints out the number of characters in `Hello world` in the console.
---
-Adds the string `world` to the variable `hello`, and prints it out in the console.
+Combines `"Hello"` and `" world"` into a new string and prints it, but the value of `hello` remains `"Hello"`.
#### --answer--
-Creates a new string that is made of the values of `hello` and `" world"` combined together, and assigns this new string back to `hello` and then prints it out in the console.
+Combines the current value of `hello` with the string `" world"`, reassigns it to `hello`, and prints it to the console.
### --question--
#### --text--
-Are semicolons required in JavaScript?
+Which JavaScript character is used to mark the end of a statement?
#### --distractors--
-Yes. The code won't work without semicolons.
+`:`
---
-Semicolons are sometimes required in JavaScript.
+`,`
---
-No. It's recommended not to use semicolons in JavaScript.
+`.`
#### --answer--
-No, but it is generally recommended to use semicolons consistently to avoid potential issues in code.
+`;`
### --question--
@@ -264,7 +259,7 @@ JavaScript performs type checking before execution, meaning type related errors
#### --answer--
-You don't need to declare the data type of a variable before using it. JavaScript infers the type based on the value assigned to the variable.
+JavaScript infers the type based on the value assigned to the variable.
### --question--
@@ -410,7 +405,7 @@ Which of the following is NOT a valid string concatenation method in JavaScript?
---
-``console.log(`${string1} ${string2}`);``
+`console.log("string1 " + string2);`
---
@@ -424,7 +419,7 @@ Which of the following is NOT a valid string concatenation method in JavaScript?
#### --text--
-Which of the following variable names uses camelCase correctly?
+Which of the following variable names uses camel case correctly?
#### --distractors--
@@ -446,23 +441,23 @@ Which of the following variable names uses camelCase correctly?
#### --text--
-Which character JavaScript uses to mark the end of a statement?
+Why is it beneficial to use semicolons explicitly even though JavaScript has Automatic Semicolon Insertion?
#### --distractors--
-`:`
+To increase the execution speed of the code.
---
-`,`
+To maintain consistency with other programming languages.
---
-`.`
+To allow for better debugging and error tracing.
#### --answer--
-`;`
+To improve code readability and reliability.
### --question--
@@ -485,4 +480,3 @@ Which of the following is NOT a JavaScript data type?
#### --answer--
`Float`
-
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-local-storage-and-crud/66edd3f9bef926f129990425.md b/curriculum/challenges/italian/25-front-end-development/quiz-local-storage-and-crud/66edd3f9bef926f129990425.md
index 516d98c4d5..e24ac7258c 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-local-storage-and-crud/66edd3f9bef926f129990425.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-local-storage-and-crud/66edd3f9bef926f129990425.md
@@ -7,7 +7,7 @@ dashedName: quiz-local-storage-and-crud
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-nano/66f1b03b922a53cb231e1c0d.md b/curriculum/challenges/italian/25-front-end-development/quiz-nano/66f1b03b922a53cb231e1c0d.md
index c64fbf7b45..0db555f3f7 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-nano/66f1b03b922a53cb231e1c0d.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-nano/66f1b03b922a53cb231e1c0d.md
@@ -7,7 +7,7 @@ dashedName: quiz-nano
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-react-basics/66f1a2009e65c9a40a26d51e.md b/curriculum/challenges/italian/25-front-end-development/quiz-react-basics/66f1a2009e65c9a40a26d51e.md
index c4d04944fa..3a650302e0 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-react-basics/66f1a2009e65c9a40a26d51e.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-react-basics/66f1a2009e65c9a40a26d51e.md
@@ -7,7 +7,7 @@ dashedName: quiz-react-basics
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-react-state-and-hooks/66f1a417757b6ca4eecd89d6.md b/curriculum/challenges/italian/25-front-end-development/quiz-react-state-and-hooks/66f1a417757b6ca4eecd89d6.md
index 9567f42558..ccd75bb2fc 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-react-state-and-hooks/66f1a417757b6ca4eecd89d6.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-react-state-and-hooks/66f1a417757b6ca4eecd89d6.md
@@ -7,7 +7,7 @@ dashedName: quiz-react-state-and-hooks
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-recursion/66edd43cded6bff30944b676.md b/curriculum/challenges/italian/25-front-end-development/quiz-recursion/66edd43cded6bff30944b676.md
index 19b2f867d6..4c664d2c9d 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-recursion/66edd43cded6bff30944b676.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-recursion/66edd43cded6bff30944b676.md
@@ -7,7 +7,7 @@ dashedName: quiz-recursion
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-relational-database/66f1af82732957c895f0b21a.md b/curriculum/challenges/italian/25-front-end-development/quiz-relational-database/66f1af82732957c895f0b21a.md
index 0d211c1fe3..34a426be61 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-relational-database/66f1af82732957c895f0b21a.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-relational-database/66f1af82732957c895f0b21a.md
@@ -7,7 +7,7 @@ dashedName: quiz-relational-database
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-responsive-web-design/66ed9034f45ce3ece4053ebd.md b/curriculum/challenges/italian/25-front-end-development/quiz-responsive-web-design/66ed9034f45ce3ece4053ebd.md
index 09267e343a..81e621ef35 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-responsive-web-design/66ed9034f45ce3ece4053ebd.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-responsive-web-design/66ed9034f45ce3ece4053ebd.md
@@ -7,7 +7,7 @@ dashedName: quiz-responsive-web-design
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-semantic-html/66ed903cf45ce3ece4053ebe.md b/curriculum/challenges/italian/25-front-end-development/quiz-semantic-html/66ed903cf45ce3ece4053ebe.md
index 79a4bd220d..e791468957 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-semantic-html/66ed903cf45ce3ece4053ebe.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-semantic-html/66ed903cf45ce3ece4053ebe.md
@@ -7,7 +7,7 @@ dashedName: quiz-semantic-html
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-styling-forms/66ed9043f45ce3ece4053ebf.md b/curriculum/challenges/italian/25-front-end-development/quiz-styling-forms/66ed9043f45ce3ece4053ebf.md
index 9e01e081b0..c425ccad6a 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-styling-forms/66ed9043f45ce3ece4053ebf.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-styling-forms/66ed9043f45ce3ece4053ebf.md
@@ -7,7 +7,7 @@ dashedName: quiz-styling-forms
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-testing/66f1aeffc5774ac692112a7e.md b/curriculum/challenges/italian/25-front-end-development/quiz-testing/66f1aeffc5774ac692112a7e.md
index 61e38a9945..7a66d675b9 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-testing/66f1aeffc5774ac692112a7e.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-testing/66f1aeffc5774ac692112a7e.md
@@ -7,7 +7,7 @@ dashedName: quiz-testing
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-typescript/66f1ae758b77cfc3e4da6151.md b/curriculum/challenges/italian/25-front-end-development/quiz-typescript/66f1ae758b77cfc3e4da6151.md
index b87747ea76..402ae44070 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-typescript/66f1ae758b77cfc3e4da6151.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-typescript/66f1ae758b77cfc3e4da6151.md
@@ -7,7 +7,7 @@ dashedName: quiz-typescript
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/quiz-web-performance/66f1adcf97e3e4c1bd89ebf5.md b/curriculum/challenges/italian/25-front-end-development/quiz-web-performance/66f1adcf97e3e4c1bd89ebf5.md
index 20779836c1..f0064b2f01 100644
--- a/curriculum/challenges/italian/25-front-end-development/quiz-web-performance/66f1adcf97e3e4c1bd89ebf5.md
+++ b/curriculum/challenges/italian/25-front-end-development/quiz-web-performance/66f1adcf97e3e4c1bd89ebf5.md
@@ -7,7 +7,7 @@ dashedName: quiz-web-performance
# --description--
-To pass the quiz, you must correctly answer at least 17 of the 20 questions below.
+To pass the quiz, you must correctly answer at least 18 of the 20 questions below.
# --quizzes--
diff --git a/curriculum/challenges/italian/25-front-end-development/review-design-fundamentals/671a892927fdba60db05edfe.md b/curriculum/challenges/italian/25-front-end-development/review-design-fundamentals/671a892927fdba60db05edfe.md
index 711022707e..25db0fc484 100644
--- a/curriculum/challenges/italian/25-front-end-development/review-design-fundamentals/671a892927fdba60db05edfe.md
+++ b/curriculum/challenges/italian/25-front-end-development/review-design-fundamentals/671a892927fdba60db05edfe.md
@@ -33,6 +33,7 @@ Review the concepts below to prepare for the upcoming quiz.
- **Progressive Enhancement**: This is a design approach that ensures all users, regardless of browser or device, can access the essential content and functionality of an application.
- **User-centered Design**: This is an approach that prioritizes the end user, from their needs to their preferences and limitations. The goal of user-centered design is to craft a web page that is intuitive, efficient to use, and pleasing for your users to interact with.
- **User Research**: This is the systematic study of the people who use your product. The goal is to measure user needs, behaviors, and pain points.
+- **Exit Interviews**: This is a survey you can give to users when they cancel their accounts. It can help you understand why users are leaving and what you can do to reduce churn.
- **User Testing**: This refers to the practice of capturing data from users as they interface with your application.
- **A/B Testing**: This is the process of shipping a new feature to a randomly selected subset of your user base. You can then leverage analytics data to determine if the feature is beneficial.
- **User Requirements**: This refers to the stories or rubric that your application needs to follow. User requirements might be defined by user research or industry standards. They can even be defined by stakeholder input.
diff --git a/curriculum/challenges/italian/25-front-end-development/review-form-validation-with-javascript/6723ce555ff2dfc0cc04b69a.md b/curriculum/challenges/italian/25-front-end-development/review-form-validation-with-javascript/6723ce555ff2dfc0cc04b69a.md
index 9c220360ea..e8b56c6cae 100644
--- a/curriculum/challenges/italian/25-front-end-development/review-form-validation-with-javascript/6723ce555ff2dfc0cc04b69a.md
+++ b/curriculum/challenges/italian/25-front-end-development/review-form-validation-with-javascript/6723ce555ff2dfc0cc04b69a.md
@@ -91,7 +91,7 @@ button.addEventListener('click',(event) => {
```
-- **`enctype` Attribute**: The `form` element accepts an `enctype` attribute, which represents the encoding type to use for the data. This attribute only accepts three values: `application/x-www-form-urlencoded` (which is the default, sending the data as a URL-encoded form body), `text/plain` (which sends the data in plaintext form, in `name=value` pairs separated by new lines), or `mulitpart/form-data`, which is specifically for handling forms with a file upload.
+- **`enctype` Attribute**: The `form` element accepts an `enctype` attribute, which represents the encoding type to use for the data. This attribute only accepts three values: `application/x-www-form-urlencoded` (which is the default, sending the data as a URL-encoded form body), `text/plain` (which sends the data in plaintext form, in `name=value` pairs separated by new lines), or `multipart/form-data`, which is specifically for handling forms with a file upload.
# --assignment--
diff --git a/curriculum/challenges/italian/25-front-end-development/review-javascript-comparisons-and-conditionals/6723c554025f449f4f39c3f5.md b/curriculum/challenges/italian/25-front-end-development/review-javascript-comparisons-and-conditionals/6723c554025f449f4f39c3f5.md
index 5ebdbeb3cc..94e4249f6d 100644
--- a/curriculum/challenges/italian/25-front-end-development/review-javascript-comparisons-and-conditionals/6723c554025f449f4f39c3f5.md
+++ b/curriculum/challenges/italian/25-front-end-development/review-javascript-comparisons-and-conditionals/6723c554025f449f4f39c3f5.md
@@ -28,7 +28,7 @@ console.log(null === undefined); // false
## `switch` Statements
-- **Definition**: A `switch` statement evaluates an expression and matches its value against a series of `case` clauses. When a match is found, the code block associated with that case is executed.
+- **Definition**: A `switch` statement evaluates an expression and matches its value against a series of `case` clauses. When a match is found, the code block associated with that case is executed. A `break` statement should be placed at the end of each case, to terminate its execution and continue with the next. The `default` case is an optional case and only executes if none of the other cases match. The `default` case is placed at the end of a `switch` statement.
```js
const dayOfWeek = 3;
diff --git a/curriculum/challenges/italian/25-front-end-development/review-javascript-math/6723c463e51a2d9b747d7529.md b/curriculum/challenges/italian/25-front-end-development/review-javascript-math/6723c463e51a2d9b747d7529.md
index 643130919d..f16459f6a3 100644
--- a/curriculum/challenges/italian/25-front-end-development/review-javascript-math/6723c463e51a2d9b747d7529.md
+++ b/curriculum/challenges/italian/25-front-end-development/review-javascript-math/6723c463e51a2d9b747d7529.md
@@ -56,7 +56,7 @@ console.log(typeof result2); // number
## Operator Precedence
-- **Definition**: Operator precedence determines the order in which operations are evaluated in an expression. Operators with higher precedence are evaluated before those with lower precedence. Values inside the parenthesis will be evaluated first and multiplication/division will have higher precedence than addition/subtraction. If the operators have the same precedence, then JavaScript will use associativity. Associativity is what tells JavaScript whether to evaluate operators from left to right or right to left. For example, the exponent operator is also right to left associative:
+- **Definition**: Operator precedence determines the order in which operations are evaluated in an expression. Operators with higher precedence are evaluated before those with lower precedence. Values inside the parenthesis will be evaluated first and multiplication/division will have higher precedence than addition/subtraction. If the operators have the same precedence, then JavaScript will use associativity.
```js
const result = (2 + 3) * 4;
@@ -72,6 +72,14 @@ const result3 = 2 ** 3 ** 2;
console.log(result3); // 512
```
+- **Definition**: Associativity informs us the direction in which an expression is evaluated when multiple operators of the same type exist. It defines whether the expression should be evaluated from left-to-right (`left-associative`) or right-to-left (`right-associative`). For example, the exponent operator is also right to left associative:
+
+```js
+const result4 = 5 ** 4 ** 1; // 625
+
+console.log(result4);
+```
+
## Increment and Decrement Operators
- **Increment Operator**: This operator is used to increase the value by one. The prefix notation `++num` increases the value of the variable first, then returns a new value. The postfix notation `num++` returns the current value of the variable first, then increases it.
diff --git a/curriculum/challenges/italian/25-front-end-development/review-javascript/6723d3cfdd0717d3f1bf27e3.md b/curriculum/challenges/italian/25-front-end-development/review-javascript/6723d3cfdd0717d3f1bf27e3.md
index 8579e569a2..3d41c6a64e 100644
--- a/curriculum/challenges/italian/25-front-end-development/review-javascript/6723d3cfdd0717d3f1bf27e3.md
+++ b/curriculum/challenges/italian/25-front-end-development/review-javascript/6723d3cfdd0717d3f1bf27e3.md
@@ -2126,7 +2126,7 @@ button.addEventListener('click',(event) => {
```
-- **`enctype` Attribute**: The `form` element accepts an `enctype` attribute, which represents the encoding type to use for the data. This attribute only accepts three values: `application/x-www-form-urlencoded` (which is the default, sending the data as a URL-encoded form body), `text/plain` (which sends the data in plaintext form, in `name=value` pairs separated by new lines), or `mulitpart/form-data`, which is specifically for handling forms with a file upload.
+- **`enctype` Attribute**: The `form` element accepts an `enctype` attribute, which represents the encoding type to use for the data. This attribute only accepts three values: `application/x-www-form-urlencoded` (which is the default, sending the data as a URL-encoded form body), `text/plain` (which sends the data in plaintext form, in `name=value` pairs separated by new lines), or `multipart/form-data`, which is specifically for handling forms with a file upload.
## The `date()` Object and Common Methods
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-cat-photo-app/5ef9b03c81a63668521804d2.md b/curriculum/challenges/italian/25-front-end-development/workshop-cat-photo-app/5ef9b03c81a63668521804d2.md
index 8841cff630..d414bd8b0e 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-cat-photo-app/5ef9b03c81a63668521804d2.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-cat-photo-app/5ef9b03c81a63668521804d2.md
@@ -9,7 +9,7 @@ dashedName: step-29
The code for an ordered list (`ol`) is similar to an unordered list, but list items in an ordered list are numbered when displayed.
-After the second `section` element's last `h3` element, add an ordered list with these three list items:
+Below the `h3` element, add an ordered list with these three list items:
`flea treatment` `thunder` `other cats`
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a8290a27c2c625e2355042.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a8290a27c2c625e2355042.md
index 160e408b1e..37fb6fc20f 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a8290a27c2c625e2355042.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a8290a27c2c625e2355042.md
@@ -8,7 +8,7 @@ demoType: onLoad
# --description--
-In this workshop, you will learn how to work with HTML forms by building a Hotel Feedback Form.
+In this workshop, you will practice working with HTML forms by building a Hotel Feedback Form.
Start by adding the `` followed by an `html` element with a `lang` attribute of `en`.
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a83601cd819e37f0dccd14.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a83601cd819e37f0dccd14.md
index 870600ea87..7e4495a6fb 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a83601cd819e37f0dccd14.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a83601cd819e37f0dccd14.md
@@ -45,14 +45,14 @@ Your `h1` element should have the text `Hotel Feedback Form`.
```js
const h1 = document.querySelector('h1');
-assert.strictEqual(h1.innerText, 'Hotel Feedback Form');
+assert.strictEqual(h1?.innerText, 'Hotel Feedback Form');
```
Your `h1` element should be inside the `header` element.
```js
const h1 = document.querySelector('h1');
-assert.strictEqual(h1.parentElement.tagName, 'HEADER');
+assert.strictEqual(h1?.parentElement.tagName, 'HEADER');
```
You should have an opening `p` tag.
@@ -71,14 +71,21 @@ Your paragraph element should have the text `Thank you for staying with us. Plea
```js
const pElement = document.querySelector('header p');
-assert.strictEqual(pElement.innerText, 'Thank you for staying with us. Please provide feedback on your recent stay.');
+assert.strictEqual(pElement?.innerText, 'Thank you for staying with us. Please provide feedback on your recent stay.');
```
Your paragraph element should be inside your `header`.
```js
const pElement = document.querySelector('p');
-assert.strictEqual(pElement.parentElement.tagName, 'HEADER');
+assert.strictEqual(pElement?.parentElement.tagName, 'HEADER');
+```
+
+Your paragraph element should come after your `h1`.
+
+```js
+const pElement = document.querySelector('p');
+assert.strictEqual(pElement?.previousElementSibling.tagName, 'H1');
```
@@ -94,9 +101,9 @@ assert.strictEqual(pElement.parentElement.tagName, 'HEADER');
Hotel Feedback Form
- --fcc-editable-region--
+--fcc-editable-region--
- --fcc-editable-region--
+--fcc-editable-region--
```
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a83bdcf425e7446900b7c4.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a83bdcf425e7446900b7c4.md
index 7ef3a0b2c8..f8a2060556 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a83bdcf425e7446900b7c4.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a83bdcf425e7446900b7c4.md
@@ -41,14 +41,14 @@ Your `form` element should have an `action` attribute set to `"https://hotel-fee
```js
const formElement = document.querySelector('form');
-assert.strictEqual(formElement.getAttribute('action'), 'https://hotel-feedback.freecodecamp.org');
+assert.strictEqual(formElement?.getAttribute('action'), 'https://hotel-feedback.freecodecamp.org');
```
Your `form` element should have a `method` attribute set to `"POST"`.
```js
const formElement = document.querySelector('form');
-assert.strictEqual(formElement.getAttribute('method'), 'POST');
+assert.strictEqual(formElement?.getAttribute('method'), 'POST');
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a83e5e491625454b6f62c3.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a83e5e491625454b6f62c3.md
index 11058548be..a5b62a7530 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a83e5e491625454b6f62c3.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a83e5e491625454b6f62c3.md
@@ -7,7 +7,7 @@ dashedName: step-7
# --description--
-Forms consist of `inputs` where users can input their data. You can group related inputs together using the fieldset element.
+Forms consist of `inputs` where users can input their data. You can group related inputs together using the `fieldset` element.
Here is an example of using a `fieldset` element:
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a83fec026a7a4631e084d2.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a83fec026a7a4631e084d2.md
index 9720e8635c..e6dc731cfa 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a83fec026a7a4631e084d2.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a83fec026a7a4631e084d2.md
@@ -7,7 +7,7 @@ dashedName: step-8
# --description--
-When working with `fieldset` elements, it is common to use a caption to describe the group of inputs. You can use the legend element for this.
+When working with `fieldset` elements, it is common to use a caption to describe the group of inputs. You can use the `legend` element for this.
Here is an example of using a `legend` element:
@@ -46,7 +46,7 @@ Your `legend` element should contain the text `Personal Information`.
```js
const legend = document.querySelector('fieldset legend');
-assert.strictEqual(legend.innerText, 'Personal Information');
+assert.strictEqual(legend?.innerText, 'Personal Information');
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a84111965a0c46df6bbd0a.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a84111965a0c46df6bbd0a.md
index fec9142b8b..f27372eefe 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a84111965a0c46df6bbd0a.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a84111965a0c46df6bbd0a.md
@@ -16,7 +16,7 @@ In the previous lecture videos, you learned how to associate a `label` element w
The `for` attribute on the `label` element should match the `id` attribute on the `input` element. This is known as an explicit association.
-Below your `legend` element, add a `label` element with the text of `Name (required):`. For the `for` attribute, set it to the value of `"full-name"`.
+Below your `legend` element, add a `label` element with the text of `Name (required):`. Set its `for` attribute to the value of `"full-name"`.
Then below your `label` element, add an `input` element with no attributes. In the next steps, you will add the necessary attributes.
@@ -34,30 +34,30 @@ You should have a closing `label` tag.
assert.match(code, /<\/label>/);
```
-Your `label` element should be inside the `fieldset` element.
+Your `label` element should be placed below your `legend` inside the `fieldset` element.
```js
-assert.isNotNull(document.querySelector('fieldset label'));
+assert.isNotNull(document.querySelector('fieldset legend + label'));
```
Your `label` element should have a `for` attribute with the value of `"full-name"`.
```js
-const label = document.querySelector('fieldset label');
-assert.strictEqual(label.getAttribute('for'), 'full-name');
+const label = document.querySelector('fieldset legend + label');
+assert.strictEqual(label?.getAttribute('for'), 'full-name');
```
Your `label` element should have the text of `Name (required):`.
```js
-const label = document.querySelector('fieldset label');
-assert.strictEqual(label.innerText, 'Name (required):');
+const label = document.querySelector('fieldset legend + label');
+assert.strictEqual(label?.innerText, 'Name (required):');
```
-You should have an `input` element.
+You should have an `input` element below your `label` element.
```js
-assert.isNotNull(document.querySelector('fieldset input'));
+assert.isNotNull(document.querySelector('fieldset label + input'));
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a930b20f589b6664c51cb0.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a930b20f589b6664c51cb0.md
index 3fce452eba..0c57b14c58 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a930b20f589b6664c51cb0.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a930b20f589b6664c51cb0.md
@@ -37,14 +37,14 @@ Your `input` element should have a `type` attribute with the value of `"text"`.
```js
const input = document.querySelector('fieldset input');
-assert.strictEqual(input.getAttribute('type'), 'text');
+assert.strictEqual(input?.getAttribute('type'), 'text');
```
Your `input` element should have an `id` attribute with the value of `"full-name"`.
```js
const input = document.querySelector('fieldset input');
-assert.strictEqual(input.getAttribute('id'), 'full-name');
+assert.strictEqual(input?.getAttribute('id'), 'full-name');
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a93730719e1f68410cce54.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a93730719e1f68410cce54.md
index 18f06cf3fa..4b1fd523b8 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a93730719e1f68410cce54.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a93730719e1f68410cce54.md
@@ -35,7 +35,7 @@ Your `input` element should have a `name` attribute with the value of `"name"`.
```js
const input = document.querySelector('fieldset input');
-assert.strictEqual(input.getAttribute('name'), 'name');
+assert.strictEqual(input?.getAttribute('name'), 'name');
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a937e74920ba68ebe5e86d.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a937e74920ba68ebe5e86d.md
index 97fefff54e..d548ff9950 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a937e74920ba68ebe5e86d.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a937e74920ba68ebe5e86d.md
@@ -28,7 +28,7 @@ assert.isNotNull(document.querySelector('fieldset input'));
Your `input` should have a `placeholder` attribute with the value of `"Ex. John Doe"`.
```js
-assert.strictEqual(document.querySelector('fieldset input').getAttribute('placeholder'), 'Ex. John Doe');
+assert.strictEqual(document.querySelector('fieldset input')?.getAttribute('placeholder'), 'Ex. John Doe');
```
Your `input` should have a `required` attribute.
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a93bbe65a26169dbf3bc39.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a93bbe65a26169dbf3bc39.md
index 5adcf8dc6e..e130fa83c3 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a93bbe65a26169dbf3bc39.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a93bbe65a26169dbf3bc39.md
@@ -22,13 +22,13 @@ assert.strictEqual(document.querySelectorAll('fieldset label').length, 2);
Your `label` element should have the text `Email address (required):`.
```js
-assert.strictEqual(document.querySelector('fieldset label:nth-of-type(2)').innerText, 'Email address (required):');
+assert.strictEqual(document.querySelector('fieldset label:nth-of-type(2)')?.innerText, 'Email address (required):');
```
Your `label` element should have a `for` attribute set to the value of `"email"`.
```js
-assert.strictEqual(document.querySelector('fieldset label[for="email"]').getAttribute('for'), 'email');
+assert.strictEqual(document.querySelector('fieldset label[for="email"]')?.getAttribute('for'), 'email');
```
# --seed--
@@ -56,9 +56,9 @@ assert.strictEqual(document.querySelector('fieldset label[for="email"]').getAttr
- --fcc-editable-region--
+--fcc-editable-region--
- --fcc-editable-region--
+--fcc-editable-region--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a93c95bc58e26a8fe95818.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a93c95bc58e26a8fe95818.md
index 92204193a3..92c3e79385 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a93c95bc58e26a8fe95818.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a93c95bc58e26a8fe95818.md
@@ -7,7 +7,7 @@ dashedName: step-14
# --description--
-Next, add an `input` with the type of `"email"` to the form. This `input` should have an `id` attribute set to the value of `"email"`. Also, set the `name` attribute to the value of `"email"`.
+Next, add an `input` with the type of `"email"` below your email `label`. This `input` should have an `id` attribute set to the value of `"email"`. Also, set the `name` attribute to the value of `"email"`.
This `input` is also required, so make sure to add the `required` attribute.
@@ -15,10 +15,10 @@ Finally, add a `placeholder` attribute set to `"example@email.com"`.
# --hints--
-You should have an `input` element.
+You should have an `input` element below your email `label`.
```js
-assert.strictEqual(document.querySelectorAll('input').length, 2);
+assert.isNotNull(document.querySelector('label[for="email"] + input'));
```
Your `input` element should have a `type` of `"email"`.
@@ -42,13 +42,13 @@ assert.isNotNull(document.querySelector('input[name="email"]'));
Your `input` element should have a `required` attribute.
```js
-assert.strictEqual(document.querySelector('input#email').getAttribute('required'), "");
+assert.strictEqual(document.querySelector('input#email')?.getAttribute('required'), "");
```
Your `input` element should have a `placeholder` attribute set to `"example@email.com"`.
```js
-assert.strictEqual(document.querySelector('input#email').getAttribute('placeholder'), "example@email.com");
+assert.strictEqual(document.querySelector('input#email')?.getAttribute('placeholder'), "example@email.com");
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9401c9d660d6bb15993e2.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9401c9d660d6bb15993e2.md
index 76740ec36c..4accbbe419 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9401c9d660d6bb15993e2.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9401c9d660d6bb15993e2.md
@@ -30,7 +30,7 @@ assert.isNotNull(document.querySelector('label[for="age"]'));
Your `label` element should have the text `Age (optional):`.
```js
-assert.strictEqual(document.querySelector('label[for="age"]').textContent, "Age (optional):");
+assert.strictEqual(document.querySelector('label[for="age"]')?.textContent, "Age (optional):");
```
# --seed--
@@ -67,9 +67,9 @@ assert.strictEqual(document.querySelector('label[for="age"]').textContent, "Age
type="email"
name="email"
/>
- --fcc-editable-region--
+--fcc-editable-region--
- --fcc-editable-region--
+--fcc-editable-region--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9419e2d18476c645ce693.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9419e2d18476c645ce693.md
index 0f39573b13..69860f585c 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9419e2d18476c645ce693.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9419e2d18476c645ce693.md
@@ -23,34 +23,34 @@ The `name` attribute should be set to `"age"`, the `min` attribute should be set
# --hints--
-You should have a number `input`.
+You should have a number `input` below your `label` element.
```js
-assert.isNotNull(document.querySelector('input[type="number"]'));
+assert.isNotNull(document.querySelector('label + input[type="number"]'));
```
Your number `input` should have an `id` of `age`.
```js
-assert.isNotNull(document.querySelector('input#age'));
+assert.isNotNull(document.querySelector('label + input#age'));
```
Your number `input` should have a `name` attribute set to `age`.
```js
-assert.isNotNull(document.querySelector('input[name="age"]'));
+assert.isNotNull(document.querySelector('label + input[name="age"]'));
```
Your number `input` should have a `min` attribute set to `"3"`.
```js
-assert.isNotNull(document.querySelector('input[min="3"]'));
+assert.isNotNull(document.querySelector('label + input[min="3"]'));
```
Your number `input` should have a `max` attribute set to `"100"`.
```js
-assert.isNotNull(document.querySelector('input[max="100"]'));
+assert.isNotNull(document.querySelector('label + input[max="100"]'));
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a94ea5df66236ebed260e8.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a94ea5df66236ebed260e8.md
index c77341470d..516d5dcefb 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a94ea5df66236ebed260e8.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a94ea5df66236ebed260e8.md
@@ -24,13 +24,13 @@ assert.strictEqual(document.querySelectorAll('fieldset').length, 2);
You should have a `legend` element inside of your `fieldset` element.
```js
-assert.strictEqual(document.querySelectorAll('legend').length, 2);
+assert.strictEqual(document.querySelectorAll('fieldset legend').length, 2);
```
Your `legend` element should have the text of `Was this your first time at our hotel?`.
```js
-assert.strictEqual(document.querySelectorAll('legend')[1].textContent, 'Was this your first time at our hotel?');
+assert.strictEqual(document.querySelectorAll('fieldset legend')[1]?.textContent, 'Was this your first time at our hotel?');
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9521bc70162712caf118d.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9521bc70162712caf118d.md
index 478f36777f..ebc55f3798 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9521bc70162712caf118d.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9521bc70162712caf118d.md
@@ -26,40 +26,40 @@ Below your `label` element, add a `radio` button with the `id` set to `"yes-opti
# --hints--
-You should have a `label` element inside your `fieldset` element.
+You should have a `label` element below your `legend` element.
```js
-assert(document.querySelector('fieldset:nth-of-type(2) label'));
+assert(document.querySelector('fieldset:nth-of-type(2) legend + label'));
```
Your `label` element should have a `for` attribute set to `"yes-option"`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) label').htmlFor, 'yes-option');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) legend + label')?.htmlFor, 'yes-option');
```
Your `label` element should have the text `Yes`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) label').innerText, 'Yes');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) legend + label')?.innerText, 'Yes');
```
-You should have a `radio` button inside your `fieldset` element.
+You should have a `radio` button below your `label` element.
```js
-assert(document.querySelector('fieldset:nth-of-type(2) input[type="radio"]'));
+assert(document.querySelector('fieldset:nth-of-type(2) label + input[type="radio"]'));
```
Your `radio` button should have an `id` attribute set to `"yes-option"`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) input[type="radio"]').id, 'yes-option');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) label + input[type="radio"]')?.id, 'yes-option');
```
Your `radio` button should have a `name` attribute set to `"hotel-stay"`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) input[type="radio"]').name, 'hotel-stay');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) label + input[type="radio"]')?.name, 'hotel-stay');
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a954b2bcddba72076c1857.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a954b2bcddba72076c1857.md
index 3803f25473..55b1f8efc8 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a954b2bcddba72076c1857.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a954b2bcddba72076c1857.md
@@ -15,46 +15,46 @@ When you are finished, you can now try out the radio buttons by selecting one op
# --hints--
-You should have a `label` element inside your `fieldset` element.
+You should have a `label` element below your first radio button.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(2) label').length, 2);
+assert.isNotNull(document.querySelector('fieldset:nth-of-type(2) input[type="radio"] + label'));
```
Your `label` should have a `for` attribute set to `"no-option"`.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(2) label[for="no-option"]').length, 1);
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) input[type="radio"] + label')?.htmlFor, "no-option");
```
Your `label` should have the text of `No`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) label[for="no-option"]').textContent, 'No');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) input[type="radio"] + label[for="no-option"]')?.textContent, 'No');
```
-You should have a second `input` inside your `fieldset` element.
+You should have a second `input` below your second `label` element.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(2) input').length, 2);
+assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(2) label + input').length, 2);
```
Your `input` should have a `type` of `radio`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) input:nth-of-type(2)').getAttribute('type'), 'radio');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) label + input:nth-of-type(2)')?.getAttribute('type'), 'radio');
```
Your `input` should have an `id` of `"no-option"`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) input:nth-of-type(2)').id, 'no-option');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) label + input:nth-of-type(2)')?.id, 'no-option');
```
Your `input` should have a `name` of `"hotel-stay"`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) input:nth-of-type(2)').name, 'hotel-stay');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(2) label + input:nth-of-type(2)')?.name, 'hotel-stay');
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9577022877d72d8f43b4f.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9577022877d72d8f43b4f.md
index ce8fc8267f..65204338f3 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9577022877d72d8f43b4f.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9577022877d72d8f43b4f.md
@@ -30,7 +30,7 @@ assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) legend').l
Your `legend` element should have the text of `Why did you choose to stay at our hotel? (Check all that apply)`. Double check for spelling errors and spacing issues.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(3) legend').innerText, 'Why did you choose to stay at our hotel? (Check all that apply)');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(3) legend')?.innerText, 'Why did you choose to stay at our hotel? (Check all that apply)');
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a95d0eff8168747805f1f3.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a95d0eff8168747805f1f3.md
index 13708d87f3..c5e0574bd7 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a95d0eff8168747805f1f3.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a95d0eff8168747805f1f3.md
@@ -29,47 +29,47 @@ Below your `label` element, add a checkbox input with the `id`, `name` and `valu
# --hints--
-You should have a `label` element inside your `fieldset`.
+You should have a `label` element below your `legend`.
```js
-assert(document.querySelector("fieldset:nth-of-type(3) label"));
+assert(document.querySelector("fieldset:nth-of-type(3) legend + label"));
```
Your `label` element should have the text of `Social Media Ads`.
```js
-assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) label").textContent, "Social Media Ads");
+assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) legend + label")?.textContent, "Social Media Ads");
```
Your `label` element should have a `for` attribute set to `"ads"`.
```js
-assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) label").getAttribute("for"), "ads");
+assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) legend + label")?.getAttribute("for"), "ads");
```
-You should have a checkbox `input` inside your `fieldset`.
+You should have a checkbox `input` below your `label`.
```js
-const inputElement = document.querySelector("fieldset:nth-of-type(3) input[type='checkbox']");
-assert.strictEqual(inputElement.parentElement.tagName, "FIELDSET");
+const inputElement = document.querySelector("fieldset:nth-of-type(3) label + input[type='checkbox']");
+assert.strictEqual(inputElement?.parentElement.tagName, "FIELDSET");
```
Your checkbox should have an `id` attribute set to `"ads"`.
```js
-assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) input[type='checkbox']").id, "ads");
+assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) label + input[type='checkbox']")?.id, "ads");
```
Your checkbox should have a `name` attribute set to `"ads"`.
```js
-assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) input[type='checkbox']").name, "ads");
+assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) label + input[type='checkbox']")?.name, "ads");
```
Your checkbox should have a `value` attribute set to `"ads"`.
```js
-assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) input[type='checkbox']").value, "ads");
+assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) label + input[type='checkbox']")?.value, "ads");
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a96127422411756204bc1b.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a96127422411756204bc1b.md
index ae2eb83e44..dd1a061310 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a96127422411756204bc1b.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a96127422411756204bc1b.md
@@ -13,46 +13,46 @@ Below the `label` element, add another checkbox `input` with the `id`, `name` an
# --hints--
-You should have a `label` element.
+You should have a `label` element below your checkbox.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label").length, 2);
+assert.isNotNull(document.querySelector('fieldset:nth-of-type(3) input[type="checkbox"] + label'));
```
Your `label` element should have the text of `Personal Recommendation`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label")[1].textContent, "Personal Recommendation");
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(3) input[type="checkbox"] + label')?.textContent, "Personal Recommendation");
```
Your `label` element should have a `for` attribute set to `"recommendation"`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label")[1].getAttribute("for"), "recommendation");
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(3) input[type="checkbox"] + label')?.getAttribute("for"), "recommendation");
```
-You should have a checkbox `input`.
+You should have a checkbox `input` below your `label`.
```js
-assert(document.querySelector("fieldset:nth-of-type(3) input:nth-of-type(2)[type='checkbox']"));
+assert(document.querySelector("fieldset:nth-of-type(3) label + input:nth-of-type(2)[type='checkbox']"));
```
Your checkbox should have an `id` set to `"recommendation"`.
```js
-assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) input:nth-of-type(2)[type='checkbox']").id, "recommendation");
+assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) label + input:nth-of-type(2)[type='checkbox']")?.id, "recommendation");
```
Your checkbox should have a `name` attribute set to `"recommendation"`.
```js
-assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) input:nth-of-type(2)[type='checkbox']").name, "recommendation");
+assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) label + input:nth-of-type(2)[type='checkbox']")?.name, "recommendation");
```
Your checkbox should have a `value` attribute set to `"recommendation"`.
```js
-assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) input:nth-of-type(2)[type='checkbox']").value, "recommendation");
+assert.strictEqual(document.querySelector("fieldset:nth-of-type(3) label + input:nth-of-type(2)[type='checkbox']")?.value, "recommendation");
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a962954f4e0d76223b37ed.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a962954f4e0d76223b37ed.md
index 24cb3be379..c7632b1084 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a962954f4e0d76223b37ed.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a962954f4e0d76223b37ed.md
@@ -20,73 +20,73 @@ For the checkbox `input`, both the `id`, `name` and `value` attributes should be
You should have a `label` element with the text of `Location`.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) label')[2].textContent, 'Location');
+assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) label')[2]?.textContent, 'Location');
```
Your `label` should have the `for` attribute set to `"location"`.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) label')[2].getAttribute('for'), 'location');
+assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) label')[2]?.getAttribute('for'), 'location');
```
-You should have a third checkbox `input`.
+You should have a third checkbox `input` after your `label`.
```js
-assert(document.querySelector("fieldset:nth-of-type(3) input:nth-of-type(3)[type='checkbox']"));
+assert(document.querySelector("fieldset:nth-of-type(3) label + input:nth-of-type(3)[type='checkbox']"));
```
Your third checkbox input should have an `id` set to `"location"`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) input[type='checkbox']")[2].getAttribute('id'), 'location');
+assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label + input[type='checkbox']")[2]?.getAttribute('id'), 'location');
```
Your third checkbox should have a `name` of `"location"`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) input[type='checkbox']")[2].getAttribute('name'), 'location');
+assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label + input[type='checkbox']")[2]?.getAttribute('name'), 'location');
```
Your third checkbox should have a `value` of `"location"`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) input[type='checkbox']")[2].getAttribute('value'), 'location');
+assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label + input[type='checkbox']")[2]?.getAttribute('value'), 'location');
```
-You should have a `label` element with the text of `Reputation`.
+You should have a `label` element with the text of `Reputation` below the location checkbox.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) label')[3].textContent, 'Reputation');
+assert.isNotNull(document.querySelectorAll('fieldset:nth-of-type(3) input[value="location"] + label')?.textContent, 'Reputation');
```
Your `label` should have the `for` attribute set to `"reputation"`.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) label')[3].getAttribute('for'), 'reputation');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(3) input[value="location"] + label')?.getAttribute('for'), 'reputation');
```
-You should have a fourth checkbox `input`.
+You should have a fourth checkbox `input` below your `label`.
```js
-assert(document.querySelector("fieldset:nth-of-type(3) input:nth-of-type(4)[type='checkbox']"));
+assert(document.querySelector("fieldset:nth-of-type(3) label + input:nth-of-type(4)[type='checkbox']"));
```
You should have a fourth checkbox `input` with an `id` of `"reputation"`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) input[type='checkbox']")[3].getAttribute('id'), 'reputation');
+assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label + input[type='checkbox']")[3]?.getAttribute('id'), 'reputation');
```
Your fourth checkbox should have a `name` of `"reputation"`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) input[type='checkbox']")[3].getAttribute('name'), 'reputation');
+assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label + input[type='checkbox']")[3]?.getAttribute('name'), 'reputation');
```
Your fourth checkbox should have a `value` of `"reputation"`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) input[type='checkbox']")[3].getAttribute('value'), 'reputation');
+assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label + input[type='checkbox']")[3]?.getAttribute('value'), 'reputation');
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9689b1bf24b7750898a1b.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9689b1bf24b7750898a1b.md
index 397002bc22..683ff2a5c4 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9689b1bf24b7750898a1b.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9689b1bf24b7750898a1b.md
@@ -18,37 +18,37 @@ Now you can test out your `form` by selecting the various checkboxes.
You should have a `label` element with the text of `Price`.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) label')[4].textContent, 'Price');
+assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) label')[4]?.textContent, 'Price');
```
Your `label` should have the `for` attribute set to `"price"`.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) label')[4].getAttribute('for'), 'price');
+assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(3) label')[4]?.getAttribute('for'), 'price');
```
-You should have a fifth checkbox `input`.
+You should have a fifth checkbox `input` below your `label`.
```js
-assert(document.querySelector("fieldset:nth-of-type(3) input:nth-of-type(5)[type='checkbox']"));
+assert(document.querySelector("fieldset:nth-of-type(3) label + input:nth-of-type(5)[type='checkbox']"));
```
You should have a checkbox input with an `id` of `"price"`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) input[type='checkbox']")[4].getAttribute('id'), 'price');
+assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label + input[type='checkbox']")[4]?.getAttribute('id'), 'price');
```
You should have a checkbox input with a `name` of `"price"`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) input[type='checkbox']")[4].getAttribute('name'), 'price');
+assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label + input[type='checkbox']")[4]?.getAttribute('name'), 'price');
```
Your checkbox input should have a `value` of `"price"`.
```js
-assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) input[type='checkbox']")[4].getAttribute('value'), 'price');
+assert.strictEqual(document.querySelectorAll("fieldset:nth-of-type(3) label + input[type='checkbox']")[4]?.getAttribute('value'), 'price');
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a969951120be7818d8ee49.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a969951120be7818d8ee49.md
index 56c8279abc..1d88b0af4c 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a969951120be7818d8ee49.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a969951120be7818d8ee49.md
@@ -30,25 +30,25 @@ assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(4) legend').l
Your legend should have the text `Ratings`.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(4) legend')[0].textContent, 'Ratings');
+assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(4) legend')[0]?.textContent, 'Ratings');
```
-Your `fieldset` should have a `label` element.
+Your `fieldset` should have a `label` element below the `legend`.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(4) label').length, 1);
+assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(4) legend + label').length, 1);
```
Your `label` should have the text `How was the service?`.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(4) label')[0].textContent, 'How was the service?');
+assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(4) legend + label')[0]?.textContent, 'How was the service?');
```
Your `label` should have the `for` attribute set to `"service"`.
```js
-assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(4) label')[0].getAttribute('for'), 'service');
+assert.strictEqual(document.querySelectorAll('fieldset:nth-of-type(4) legend + label')[0]?.getAttribute('for'), 'service');
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a96b01f33ef178dfca9e42.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a96b01f33ef178dfca9e42.md
index 0e8b2d007c..dd8242f1f7 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a96b01f33ef178dfca9e42.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a96b01f33ef178dfca9e42.md
@@ -7,7 +7,7 @@ dashedName: step-27
# --description--
-When you want users to make selections from a dropdown menu, you can use the select and option elements.
+When you want users to make selections from a dropdown menu, you can use the `select` and `option` elements.
Here is an example of using the `select` and `option` elements to create a dropdown for different cities:
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a972137acd1179fa3fe8a0.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a972137acd1179fa3fe8a0.md
index ef98f5cb82..53e53f174a 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a972137acd1179fa3fe8a0.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a972137acd1179fa3fe8a0.md
@@ -36,7 +36,7 @@ assert(document.querySelector('option[value="poor"]'));
Your `option` element with the `value` of `"poor"` should have the text `Poor`.
```js
-assert.strictEqual(document.querySelector('option[value="poor"]').textContent, 'Poor');
+assert.strictEqual(document.querySelector('option[value="poor"]')?.textContent, 'Poor');
```
You should have an `option` element with the `value` set to `"satisfactory"`.
@@ -48,7 +48,7 @@ assert(document.querySelector('option[value="satisfactory"]'));
Your `option` element with the `value` of `"satisfactory"` should have the text `Satisfactory`.
```js
-assert.strictEqual(document.querySelector('option[value="satisfactory"]').textContent, 'Satisfactory');
+assert.strictEqual(document.querySelector('option[value="satisfactory"]')?.textContent, 'Satisfactory');
```
You should have an `option` element with the `value` set to `"good"`.
@@ -61,7 +61,7 @@ Your `option` element with the `value` of `"good"` should have the text `Good`.
```js
-assert.strictEqual(document.querySelector('option[value="good"]').textContent, 'Good');
+assert.strictEqual(document.querySelector('option[value="good"]')?.textContent, 'Good');
```
You should have an `option` element with the value set to `"very-good"`.
@@ -73,7 +73,7 @@ assert(document.querySelector('option[value="very-good"]'));
Your `option` element with the `value` of `"very-good"` should have the text `Very Good`.
```js
-assert.strictEqual(document.querySelector('option[value="very-good"]').textContent, 'Very Good');
+assert.strictEqual(document.querySelector('option[value="very-good"]')?.textContent, 'Very Good');
```
You should have an `option` element with the value set to `"excellent"`.
@@ -86,7 +86,7 @@ Your `option` element with the `value` of `"excellent"` should have the text `Ex
```js
-assert.strictEqual(document.querySelector('option[value="excellent"]').textContent, 'Excellent');
+assert.strictEqual(document.querySelector('option[value="excellent"]')?.textContent, 'Excellent');
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a975c259525b7bc2d5c776.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a975c259525b7bc2d5c776.md
index eea5aeddc9..ace80b2a3e 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a975c259525b7bc2d5c776.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a975c259525b7bc2d5c776.md
@@ -24,19 +24,19 @@ assert(document.querySelector('label[for="food"]'));
Your `label` should have the text `How was the food?`.
```js
-assert.strictEqual(document.querySelector('label[for="food"]').textContent, 'How was the food?');
+assert.strictEqual(document.querySelector('label[for="food"]')?.textContent, 'How was the food?');
```
-You should have a `select` element with the `id` set to `"food"`.
+You should have a `select` element with the `id` set to `"food"` below your `label`.
```js
-assert(document.querySelector('select#food'));
+assert(document.querySelector('label + select#food'));
```
Your `select` element should have the `name` attribute set to `"food"`.
```js
-assert(document.querySelector('select[name="food"]'));
+assert(document.querySelector('label + select[name="food"]'));
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a97ca8c4cbae7d0bb6e0ad.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a97ca8c4cbae7d0bb6e0ad.md
index 268520c6d3..09c4bccd98 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a97ca8c4cbae7d0bb6e0ad.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a97ca8c4cbae7d0bb6e0ad.md
@@ -39,7 +39,7 @@ assert(document.querySelector('fieldset:nth-of-type(4) select#food option[value=
Your `option` with the `value` of `"poor"` should have the text `"Poor"`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(4) select#food option[value="poor"]').textContent, 'Poor');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(4) select#food option[value="poor"]')?.textContent, 'Poor');
```
You should have an `option` element with the `value` set to `"satisfactory"`.
@@ -51,7 +51,7 @@ assert(document.querySelector('fieldset:nth-of-type(4) select#food option[value=
Your `option` with the `value` of `"satisfactory"` should have the text `"Satisfactory"`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(4) select#food option[value="satisfactory"]').textContent, 'Satisfactory');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(4) select#food option[value="satisfactory"]')?.textContent, 'Satisfactory');
```
You should have an `option` element with the `value` set to `"good"`.
@@ -64,7 +64,7 @@ Your `option` with the `value` of `"good"` should have the text `"Good"`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(4) select#food option[value="good"]').textContent, 'Good');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(4) select#food option[value="good"]')?.textContent, 'Good');
```
You should have an `option` element with the value set to `"very-good"`.
@@ -76,7 +76,7 @@ assert(document.querySelector('fieldset:nth-of-type(4) select#food option[value=
Your `option` with the `value` of `"very-good"` should have the text `"Very Good"`.
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(4) select#food option[value="very-good"]').textContent, 'Very Good');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(4) select#food option[value="very-good"]')?.textContent, 'Very Good');
```
You should have an `option` element with the value set to `"excellent"`.
@@ -89,7 +89,7 @@ Your `option` with the `value` of `"excellent"` should have the text `"Excellent
```js
-assert.strictEqual(document.querySelector('fieldset:nth-of-type(4) select#food option[value="excellent"]').textContent, 'Excellent');
+assert.strictEqual(document.querySelector('fieldset:nth-of-type(4) select#food option[value="excellent"]')?.textContent, 'Excellent');
```
You should have an `option` element with the `selected` attribute set to `"excellent"`.
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a97f40ddd40d7deb0618b7.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a97f40ddd40d7deb0618b7.md
index 6b5dce5b85..87541bc47d 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a97f40ddd40d7deb0618b7.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a97f40ddd40d7deb0618b7.md
@@ -22,7 +22,7 @@ assert(document.querySelector('label[for="comments"]'));
Your `label` should have the text `Other Comments?`.
```js
-assert.strictEqual(document.querySelector('label[for="comments"]').textContent, 'Other Comments?');
+assert.strictEqual(document.querySelector('label[for="comments"]')?.textContent, 'Other Comments?');
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9824ac5d9f77ec304969f.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9824ac5d9f77ec304969f.md
index fb1338daf2..e92d1f3b94 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9824ac5d9f77ec304969f.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9824ac5d9f77ec304969f.md
@@ -7,7 +7,7 @@ dashedName: step-33
# --description--
-If you want users to have more space to write their comments, you can use a textarea element.
+If you want users to have more space to write their comments, you can use a `textarea` element.
The `textarea` element is a multi-line text input control that allows users to enter text that is longer than a single line. It can be used to create a comment box, a message input, or other text input that requires multiple lines.
@@ -23,10 +23,10 @@ Below your `label` element, add a `textarea` element. In the next step, you will
# --hints--
-You should have a `textarea` element inside your form.
+You should have a `textarea` element below your label.
```js
-assert(document.querySelector('form textarea'));
+assert(document.querySelector('label + textarea'));
```
# --seed--
@@ -131,9 +131,8 @@ assert(document.querySelector('form textarea'));
-
-
--fcc-editable-region--
+
--fcc-editable-region--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9843525e9fa8046d709b7.md b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9843525e9fa8046d709b7.md
index 8bd434ba5a..3518359396 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9843525e9fa8046d709b7.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-hotel-feedback-form/66a9843525e9fa8046d709b7.md
@@ -32,7 +32,7 @@ assert(document.querySelector('button[type="submit"]'));
Your button should have the text content of `Submit`.
```js
-assert.strictEqual(document.querySelector('button').textContent, 'Submit');
+assert.strictEqual(document.querySelector('button')?.textContent, 'Submit');
```
# --seed--
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-library-manager/67116d7584d0b469b14579c3.md b/curriculum/challenges/italian/25-front-end-development/workshop-library-manager/67116d7584d0b469b14579c3.md
index da8f4aa2b4..3042cddf8f 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-library-manager/67116d7584d0b469b14579c3.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-library-manager/67116d7584d0b469b14579c3.md
@@ -30,7 +30,7 @@ assert.lengthOf(getBooksByAuthor, 2)
Your `getBooksByAuthor` function should return an array.
```js
-assert.isArray(getBooksByAuthor(library))
+assert.isArray(getBooksByAuthor(library, ''));
```
Your `getBooksByAuthor` function should use a higher order function. Ex. (`filter`, `map`, `reduce`).
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-music-player/674728eda5829d7b4c360643.md b/curriculum/challenges/italian/25-front-end-development/workshop-music-player/674728eda5829d7b4c360643.md
index d4725a42a5..60faf74736 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-music-player/674728eda5829d7b4c360643.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-music-player/674728eda5829d7b4c360643.md
@@ -49,7 +49,7 @@ The third object in your `allSongs` array should have a `duration` property set
assert.equal(allSongs[2].duration, "3:51");
```
-The third object in your `allSongs` array should have a `src` property set to the string `"https://cdn.freecodecamp.org/curriculum/js-music-player/can't-stay-down.mp3"`.
+The third object in your `allSongs` array should have a `src` property set to the string `"https://cdn.freecodecamp.org/curriculum/js-music-player/still-learning.mp3"`.
```js
assert.equal(allSongs[2].src, "https://cdn.freecodecamp.org/curriculum/js-music-player/still-learning.mp3");
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-recipe-ingredient-converter/673543d867b44ac7580610a2.md b/curriculum/challenges/italian/25-front-end-development/workshop-recipe-ingredient-converter/673543d867b44ac7580610a2.md
index 233026de48..ac61da05b2 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-recipe-ingredient-converter/673543d867b44ac7580610a2.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-recipe-ingredient-converter/673543d867b44ac7580610a2.md
@@ -9,7 +9,7 @@ dashedName: step-18
To finish the project, you'll need to run the `updateResultsList` function when the recipe form is submitted.
-Use an event listener to do so, and remember that you'll need to prevent the default behaviour (or the page will refresh).
+Use an event listener to do so, and remember that you'll need to prevent the default behavior (or the page will refresh).
Once that's done, take some time to experiment with different values in the form before moving on to the next module.
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-recipe-tracker/66fbcf750a62784cf11f5630.md b/curriculum/challenges/italian/25-front-end-development/workshop-recipe-tracker/66fbcf750a62784cf11f5630.md
index 408895d618..77e052536f 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-recipe-tracker/66fbcf750a62784cf11f5630.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-recipe-tracker/66fbcf750a62784cf11f5630.md
@@ -9,7 +9,7 @@ dashedName: step-6
A third `recipe3` object has been filled in for you. It has the same properties as `recipe1` and `recipe2`.
-You should now push the three objects into the `recipes` array. To do thus, you can use the `push()` method.
+You should now push the three objects into the `recipes` array. To do this, you can use the `push()` method.
Use the `push()` method to push all the recipe objects into the `recipes` array. Make sure to push `recipe1`, `recipe2`, and `recipe3` in that order.
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-reusable-mega-navbar/6740495ba48aa94e5667b436.md b/curriculum/challenges/italian/25-front-end-development/workshop-reusable-mega-navbar/6740495ba48aa94e5667b436.md
index 2e0e0fd742..1b7a8867a4 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-reusable-mega-navbar/6740495ba48aa94e5667b436.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-reusable-mega-navbar/6740495ba48aa94e5667b436.md
@@ -8,7 +8,7 @@ demoType: onLoad
# --description--
-In this workshop, you will practice working with React functional components by building a resuable navbar.
+In this workshop, you will practice working with React functional components by building a reusable navbar.
All the CSS have been provided for you so you can focus on creating the navbar.
diff --git a/curriculum/challenges/italian/25-front-end-development/workshop-shopping-cart/63effe558c87a70e7072e447.md b/curriculum/challenges/italian/25-front-end-development/workshop-shopping-cart/63effe558c87a70e7072e447.md
index bff342d205..c355e87360 100644
--- a/curriculum/challenges/italian/25-front-end-development/workshop-shopping-cart/63effe558c87a70e7072e447.md
+++ b/curriculum/challenges/italian/25-front-end-development/workshop-shopping-cart/63effe558c87a70e7072e447.md
@@ -7,7 +7,7 @@ dashedName: step-27
# --description--
-The behaviour of the `addItem` method needs to change if the product is already in the cart or not. Create a ternary that checks if the current product is already in the cart. Use `undefined` for both the truthy and falsy expressions to avoid a syntax error.
+The behavior of the `addItem` method needs to change if the product is already in the cart or not. Create a ternary that checks if the current product is already in the cart. Use `undefined` for both the truthy and falsy expressions to avoid a syntax error.
# --hints--
