From a6f72e9ab00d0b13ac16aad44b4fd10f2f8d92bf Mon Sep 17 00:00:00 2001 From: dev-kamil <54180588+dev-kamil@users.noreply.github.com> Date: Sat, 7 Jun 2025 17:46:00 +0200 Subject: [PATCH] fix(curriculum): grammar, typos in Introduction to JavaScript Libraries and Frameworks (#60747) Co-authored-by: Huyen Nguyen <25715018+huyenltnguyen@users.noreply.github.com> --- .../6734e86f590727c5e7e9ec5e.md | 4 ++-- .../6734e879c78ee6c61db25b90.md | 6 +++--- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/curriculum/challenges/english/25-front-end-development/lecture-introduction-to-javascript-libraries-and-frameworks/6734e86f590727c5e7e9ec5e.md b/curriculum/challenges/english/25-front-end-development/lecture-introduction-to-javascript-libraries-and-frameworks/6734e86f590727c5e7e9ec5e.md index fda9f333ce8..1ef153d3f32 100644 --- a/curriculum/challenges/english/25-front-end-development/lecture-introduction-to-javascript-libraries-and-frameworks/6734e86f590727c5e7e9ec5e.md +++ b/curriculum/challenges/english/25-front-end-development/lecture-introduction-to-javascript-libraries-and-frameworks/6734e86f590727c5e7e9ec5e.md @@ -26,7 +26,7 @@ In addition to reusable components, React also provides a powerful way to manage With React, you can easily track and update the state of components, ensuring that the UI reflects the most current data. You will learn more about working with state in future lecture videos. -While there are many libraries within the JavaScript ecosystem, freeCodeCamp will mainly be focused on teaching React because of its wide spread use and demand in the industry. +While there are many libraries within the JavaScript ecosystem, freeCodeCamp will mainly be focused on teaching React because of its widespread use and demand in the industry. Our next few lectures will dive deeper into building custom components, managing state, and more. @@ -118,7 +118,7 @@ Think about its React standing within the industry. --- -React has wide spread use and demand in the industry. +React has widespread use and demand in the industry. --- diff --git a/curriculum/challenges/english/25-front-end-development/lecture-introduction-to-javascript-libraries-and-frameworks/6734e879c78ee6c61db25b90.md b/curriculum/challenges/english/25-front-end-development/lecture-introduction-to-javascript-libraries-and-frameworks/6734e879c78ee6c61db25b90.md index 0cf1f397e2c..d1b268980eb 100644 --- a/curriculum/challenges/english/25-front-end-development/lecture-introduction-to-javascript-libraries-and-frameworks/6734e879c78ee6c61db25b90.md +++ b/curriculum/challenges/english/25-front-end-development/lecture-introduction-to-javascript-libraries-and-frameworks/6734e879c78ee6c61db25b90.md @@ -16,9 +16,9 @@ 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. +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. -At a higher level, you can think of component like JavaScript functions that return elements describing the UI. +At a higher level, you can think of components like JavaScript functions that return elements describing the UI. This UI is described using JSX, a syntax extension for JavaScript that looks similar to HTML but allows you to write UI elements in a more declarative way. @@ -58,7 +58,7 @@ To use this `Greeting` component in our application, we would write something li ``` -This would render an `h1` element with the text `Hello, John` to the page. But take a closer look at the syntax here. When we use the component, it ends with a forward slash and then the greater than symbol. +This would render an `h1` element with the text `Hello John` to the page. But take a closer look at the syntax here. When we use the component, it ends with a forward slash and then the greater than symbol. When working with JSX, all tags and uses of components need to be explicitly closed. So if the component or tag does not have any children, then you need to explicitly close it like shown here: