Skip to content

Commit 1103174

Browse files
Fixing typos
1 parent ce46325 commit 1103174

File tree

1 file changed

+3
-10
lines changed

1 file changed

+3
-10
lines changed

content/react-part-2/studio/index.md

Lines changed: 3 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ In this studio, you will make a second Pinterest-inspired application. This stu
1717
The app you complete in this studio will have the following functionality:
1818
1. A star rating component that can be updated to display 0 - 5 stars.
1919
1. The ability to mimic the Save vs Saved button on a Pinterest pin using conditional rendering.
20-
1. Displaying specific recipe information using the `map` function and a JSON file.
20+
1. Displaying specific recipe information using the `map` function, if necessary, and a JSON file.
2121
1. CSS styling has been created for this project. The instructions will let you know what and how to style elements.
2222

2323
## Getting Started
@@ -128,7 +128,7 @@ You will need to create a conditional that will render `SaveButton` or `ClickedB
128128
129129
## Part 3: Add the Recipe Data
130130
131-
The remaining components will be using the `recipe.json` file. You will need to import this file into each component. We will also use the `map` function to find the desired keys.
131+
The remaining components will be using the `recipe.json` file. You will need to import this file into each component. We can also use the `map` function to find the desired keys if it makes sense to you.
132132
133133
### Recipe Name
134134
@@ -143,16 +143,9 @@ _Desired Output_: This function needs to return the recipe name as an `<h1>` lev
143143
_Desired Output_: Returns the image of the recipe from the JSON.
144144
145145
1. Import the recipe JSON file.
146-
1. Use the `map` function to find the `recipeImage`.
146+
1. Find the `recipeImage`.
147147
1. Use the `<img>` tag. You can pass the recipe name to the alt text value.
148148
1. Styling has been created for the image. If you would like to apply it set the `className` equal to `recipeImage`.
149-
```react{linenos=table,hl_lines=[],linenostart=4}
150-
function RecipeImage() {
151-
const recipeImage = recipedata.map((data) => (
152-
<div key={data.name}>
153-
<img src={data.recipeImage} alt={data.name} className="recipeImage" />
154-
//component continues
155-
```
156149
1. Return `recipeImage` inside its own `<div>`.
157150
158151
### Ingredient Lists

0 commit comments

Comments
 (0)