fix(curriculum): remove videos from React fundamentals lecture blocks (#61545)

curriculum/challenges/english/25-front-end-development/lecture-introduction-to-javascript-libraries-and-frameworks/6734e3a9cc78faaf4248d335.md

@@ -1,19 +1,12 @@
 ---
 id: 6734e3a9cc78faaf4248d335
 title: What Is the Role of JS Libraries and Frameworks, and Why Are They Used in the Industry?
-challengeType: 11
-videoId: AJMjp3NxnEA
+challengeType: 19
 dashedName: what-is-the-role-of-js-libraries-and-frameworks-and-why-are-they-used-in-the-industry
 ---
 
 # --description--
 
-Watch the video or read the transcript and answer the questions below.
-
-# --transcript--
-
-What is the role of JS libraries and frameworks, and why are they used in the industry?
-
 JavaScript libraries and frameworks provide pre-built code that streamlines the development process.  While both libraries and frameworks serve to improve productivity and standardize coding practices, they differ in their approach and level of control they provide to developers.
 
 Libraries are generally more focused on providing solutions to specific tasks, such as manipulating the DOM, handling events, or managing AJAX requests.
@@ -92,7 +85,7 @@ COBOL
 
 ### --feedback--
 
-Review the beginning of the video where React libraries were first discussed.
+Review the beginning section where React libraries were first discussed.
 
 ---
 
@@ -104,7 +97,7 @@ Ruby on Rails
 
 ### --feedback--
 
-Review the beginning of the video where React libraries were first discussed.
+Review the beginning section where React libraries were first discussed.
 
 ---
 
@@ -112,7 +105,7 @@ Swift
 
 ### --feedback--
 
-Review the beginning of the video where React libraries were first discussed.
+Review the beginning section where React libraries were first discussed.
 
 ## --video-solution--
 

curriculum/challenges/english/25-front-end-development/lecture-introduction-to-javascript-libraries-and-frameworks/6734e867bbf41cc5b11648c4.md

@@ -1,19 +1,12 @@
 ---
 id: 6734e867bbf41cc5b11648c4
 title: What Are Single Page Applications, and What Are Some Issues Surrounding Them?
-challengeType: 11
-videoId: pqTVIg2JTJc
+challengeType: 19
 dashedName: what-are-single-page-applications-and-what-are-some-issues-surrounding-them
 ---
 
 # --description--
 
-Watch the video or read the transcript and answer the questions below.
-
-# --transcript--
-
-What are single page applications, and what are some issues surrounding them?
-
 Unlike traditional multi-page websites, single page applications (SPAs) load only one HTML page and dynamically update the content as the user interacts with the app, without reloading the entire page. This approach can lead to faster, more responsive applications, but it also comes with a set of challenges and considerations.
 
 SPAs heavily use JavaScript to manage the application's state and render content. Instead of requesting new HTML pages from the server, SPAs use JavaScript to manipulate the DOM and fetch data asynchronously. This is often done using libraries and frameworks like React, Vue, or Angular, which provide great tools for building complex user interfaces.

curriculum/challenges/english/25-front-end-development/lecture-introduction-to-javascript-libraries-and-frameworks/6734e86f590727c5e7e9ec5e.md

@@ -1,19 +1,12 @@
 ---
 id: 6734e86f590727c5e7e9ec5e
 title: What Is React, and What Is It Commonly Used For?
-challengeType: 11
-videoId: 1FGlfBVLSOA
+challengeType: 19
 dashedName: what-is-react-and-what-is-it-commonly-used-for
 ---
 
 # --description--
 
-Watch the video or read the transcript and answer the questions below.
-
-# --transcript--
-
-What is React, and what is it commonly used for?
-
 React is one of the most popular JavaScript libraries for building user interfaces and web applications. Originally developed and maintained by Facebook, React has gained huge popularity in web development due to its efficiency, flexibility, and features.
 
 A fundamental concept in React is the creation of reusable UI components. These components, such as buttons, cards, and avatar components, can be easily reused throughout your application. You can nest these components inside each other to build more complex, dynamic interfaces.
@@ -78,7 +71,7 @@ State determines the styling of UI components.
 
 ### --feedback--
 
-Review the beginning the video where this was discussed. 
+Review the beginning section where this was discussed. 
 
 ---
 
@@ -90,7 +83,7 @@ State is used to manage the DOM directly.
 
 ### --feedback--
 
-Review the beginning the video where this was discussed. 
+Review the beginning section where this was discussed. 
 
 ---
 
@@ -98,7 +91,7 @@ State is only used in functional components.
 
 ### --feedback--
 
-Review the beginning the video where this was discussed. 
+Review the beginning section where this was discussed. 
 
 ## --video-solution--
 

curriculum/challenges/english/25-front-end-development/lecture-introduction-to-javascript-libraries-and-frameworks/6734e879c78ee6c61db25b90.md

@@ -1,19 +1,12 @@
 ---
 id: 6734e879c78ee6c61db25b90
 title: What Are Components in React, and How Do They Work?
-challengeType: 11
-videoId: 0X9IvIhopZQ
+challengeType: 19
 dashedName: what-are-components-in-react-and-how-do-they-work
 ---
 
 # --description--
 
-Watch the video or read the transcript and answer the questions below.
-
-# --transcript--
-
-What are components in React, and how do they work?
-
 Components are the building blocks of React applications that allow developers to break down complex user interfaces into smaller, manageable pieces, making it easier to develop and maintain large-scale applications.
 
 The two types of components in React are functional and class-based components. In modern React, developers will use functional components and all of the examples we look at today will be functional components.
@@ -199,7 +192,7 @@ How would you render a `Message` component in React?
 
 ### --feedback--
 
-Review the part of the video where it explains how components are rendered.
+Review the section where it explains how components are rendered.
 
 ---
 
@@ -207,7 +200,7 @@ Review the part of the video where it explains how components are rendered.
 
 ### --feedback--
 
-Review the part of the video where it explains how components are rendered.
+Review the section where it explains how components are rendered.
 
 ---
 
@@ -215,7 +208,7 @@ Review the part of the video where it explains how components are rendered.
 
 ### --feedback--
 
-Review the part of the video where it explains how components are rendered.
+Review the section where it explains how components are rendered.
 
 ---
 

curriculum/challenges/english/25-front-end-development/lecture-introduction-to-javascript-libraries-and-frameworks/6734e88cc46e6dc679420040.md

@@ -1,19 +1,12 @@
 ---
 id: 6734e88cc46e6dc679420040
 title: What is Vite, and How Can It Be Used to Set Up a New React Project?
-challengeType: 11
-videoId: lzU9WdGBjlw
+challengeType: 19
 dashedName: what-is-vite-and-how-can-it-be-used-to-set-up-a-new-react-project
 ---
 
 # --description--
 
-Watch the video or read the transcript and answer the questions below.
-
-# --transcript--
-
-What is Vite, and how can it be used to set up a new React project?
-
 Unlike working with smaller vanilla HTML, CSS, and JavaScript projects, starting a new React project includes a few more steps to ensure that everything runs correctly. Instead of trying to set up of all of the necessary configurations by yourself, there are tools that will do that for you. 
 
 One of the most popular tools for setting up projects is Vite. Vite, which means "fast" in French, is a build tool that aims to provide a faster development experience for modern web projects. Vite can be used with React, as well as with other libraries and frameworks like Vue or Svelte. You can even use it with vanilla JavaScript projects.
@@ -149,7 +142,7 @@ Which directory contains the starting code that is found in the `App.jsx` file?
 
 ### --feedback--
 
-Review the end of the video where this was discussed.
+Review the end section where this was discussed.
 
 ---
 
@@ -157,7 +150,7 @@ Review the end of the video where this was discussed.
 
 ### --feedback--
 
-Review the end of the video where this was discussed.
+Review the end section where this was discussed.
 
 ---
 
@@ -169,7 +162,7 @@ Review the end of the video where this was discussed.
 
 ### --feedback--
 
-Review the end of the video where this was discussed.
+Review the end section where this was discussed.
 
 ## --video-solution--
 

curriculum/challenges/english/25-front-end-development/lecture-introduction-to-javascript-libraries-and-frameworks/674ba6876f7ada867135bb95.md

@@ -1,19 +1,12 @@
 ---
 id: 674ba6876f7ada867135bb95
 title: How Can You Import and Export Components in React?
-challengeType: 11
-videoId: XWvb9g1IjR4
+challengeType: 19
 dashedName: how-can-you-import-and-export-components-in-react
 ---
 
 # --description--
 
-Watch the video or read the transcript and answer the questions below.
-
-# --transcript--
-
-How can you import and export components in React?
-
 In earlier lecture videos, you learned how to work with imports and exports in JavaScript. In this lecture, we will take a look at how to import and export components in React.
 
 In this example, we have a `Cat` component that belongs in a file called `Cat.jsx`. For the file extension, we are using the `.jsx` file extension because this file is mainly working with JSX.
@@ -148,7 +141,7 @@ exportComponent function Cat() {
 
 ### --feedback--
 
-Review the middle of the video where this was discussed.
+Review the middle section where this was discussed.
 
 ---
 
@@ -168,7 +161,7 @@ e.default function Cat() {
 
 ### --feedback--
 
-Review the middle of the video where this was discussed.
+Review the middle section where this was discussed.
 
 ---
 
@@ -188,7 +181,7 @@ default function Cat() {
 
 ### --feedback--
 
-Review the middle of the video where this was discussed.
+Review the middle section where this was discussed.
 
 ## --video-solution--
 

curriculum/challenges/english/25-front-end-development/lecture-working-with-data-in-react/6734e3ceee2da4b0301719b7.md

@@ -1,19 +1,12 @@
 ---
 id: 6734e3ceee2da4b0301719b7
 title: How Do You Pass Props from a Parent Component to a Child Component in React?
-challengeType: 11
-videoId: kUJ6yGagVtE
+challengeType: 19
 dashedName: how-do-you-pass-props-from-a-parent-component-to-a-child-component-in-react
 ---
 
 # --description--
 
-Watch the video or read the transcript and answer the questions below.
-
-# --transcript--
-
-How do you pass props from a parent component to a child component in react?
-
 In the previous lectures, we learned how to build small components in React like this:
 
 ```jsx

curriculum/challenges/english/25-front-end-development/lecture-working-with-data-in-react/673500abfe36cd015b67b1b7.md

@@ -1,19 +1,12 @@
 ---
 id: 673500abfe36cd015b67b1b7
 title: How Does Conditional Rendering Work in React Components?
-challengeType: 11
-videoId: jSwg6t4FOBc
+challengeType: 19
 dashedName: how-does-conditional-rendering-work-in-react-components
 ---
 
 # --description--
 
-Watch the video or read the transcript and answer the questions below.
-
-# --transcript--
-
-How does conditional rendering work in react components?
-
 Conditional rendering in React allows you to create dynamic user interfaces. It is used to show different content based on certain conditions or states within your application.
 
 The most common approaches of using conditional rendering includes using `if` statements, the ternary (`?:`) operator, and logical AND (`&&`) operator.

curriculum/challenges/english/25-front-end-development/lecture-working-with-data-in-react/673500b41af8500191febedc.md

@@ -1,19 +1,12 @@
 ---
 id: 673500b41af8500191febedc
 title: How Do You Render Lists in React?
-challengeType: 11
-videoId: EXuI5_x3tEM
+challengeType: 19
 dashedName: how-do-you-render-lists-in-react
 ---
 
 # --description--
 
-Watch the video or read the transcript and answer the questions below.
-
-# --transcript--
-
-How do you render lists in React?
-
 Rendering lists is a fundamental task in React web apps, and is used for displaying data to users. In React, the `map` method is used to transform an array of data into an array of JSX elements that can be rendered in the UI.
 
 Here is an example of a component called `FruitList` that displays a list of fruits:

curriculum/challenges/english/25-front-end-development/lecture-working-with-data-in-react/673500bfe1f41601c1ddb1a2.md

@@ -1,19 +1,12 @@
 ---
 id: 673500bfe1f41601c1ddb1a2
 title: How Do Inline Styles Work in React?
-challengeType: 11
-videoId: SMnrYMHFvbA
+challengeType: 19
 dashedName: how-do-inline-styles-work-in-react
 ---
 
 # --description--
 
-Watch the video or read the transcript and answer the questions below.
-
-# --transcript--
-
-How do inline styles work in react?
-
 In React, inline styles are used to apply CSS styles directly to React elements within your JSX code instead of defining them in separate CSS files.
 
 React's approach to inline styles involves using JavaScript objects to define styles, rather than traditional CSS strings. This means that instead of writing styles as you would in a CSS file, you create a JavaScript object where the keys are camel cased versions of CSS property names, and the values are the strings of CSS values.