Translated page content & Challenge, Recap, Illustration components translations #428

Th3Wall · 2023-04-27T23:53:53Z

Translation for "Passing props to to a component" page.
Also added <Challenge>, <Recap>, <Illustration> components translations.

Ref #418

…onents translations

github-actions · 2023-04-27T23:56:14Z

Size changes

📦 Next.js Bundle Analysis for react-dev

This analysis was generated by the Next.js Bundle Analysis action. 🤖

Three Pages Changed Size

The following pages changed size from the code in this PR compared to its base branch:

Page	Size (compressed)	First Load
`/404`	`76.46 KB` (🟡 +43 B)	170.09 KB
`/500`	`76.46 KB` (🟡 +43 B)	170.09 KB
`/[[...markdownPath]]`	`77.88 KB` (🟡 +43 B)	171.51 KB

Details

Only the gzipped size is provided here based on an expert tip.

First Load is the size of the global bundle plus the bundle for the individual page. If a user were to show up to your website and land on a given page, the first load size represents the amount of javascript that user would need to download. If next/link is used, subsequent page loads would only need to download that page's bundle (the number in the "Size" column), since the global bundle has already been downloaded.

Any third party scripts you have added directly to your app using the <script> tag are not accounted for in this analysis

Next to the size is how much the size has increased or decreased compared with the base branch of this PR. If this percentage has increased by 10% or more, there will be a red status indicator applied, indicating that special attention should be given to this.

src/content/learn/passing-props-to-a-component.md

Co-authored-by: Alessandro De Blasis <alex@deblasis.net>

deblasis

Piccola modifica ma altrimenti 💯

Th3Wall · 2023-04-28T09:46:04Z

Piccola modifica ma altrimenti 💯

Ahaha 😃 Grazie!! 🙏🏼

github-actions · 2023-04-28T09:46:16Z

Size changes

📦 Next.js Bundle Analysis for react-dev

This analysis was generated by the Next.js Bundle Analysis action. 🤖

Three Pages Changed Size

The following pages changed size from the code in this PR compared to its base branch:

Page	Size (compressed)	First Load
`/404`	`76.47 KB` (🟡 +43 B)	170.1 KB
`/500`	`76.47 KB` (🟡 +43 B)	170.09 KB
`/[[...markdownPath]]`	`77.89 KB` (🟡 +43 B)	171.52 KB

Details

Only the gzipped size is provided here based on an expert tip.

First Load is the size of the global bundle plus the bundle for the individual page. If a user were to show up to your website and land on a given page, the first load size represents the amount of javascript that user would need to download. If next/link is used, subsequent page loads would only need to download that page's bundle (the number in the "Size" column), since the global bundle has already been downloaded.

Any third party scripts you have added directly to your app using the <script> tag are not accounted for in this analysis

Next to the size is how much the size has increased or decreased compared with the base branch of this PR. If this percentage has increased by 10% or more, there will be a red status indicator applied, indicating that special attention should be given to this.

mattia-sanfilippo · 2023-04-28T09:34:54Z

src/components/MDX/Challenges/Challenges.tsx

-  titleText = isRecipes ? 'Try out some examples' : 'Try out some challenges',
-  titleId = isRecipes ? 'examples' : 'challenges',
+  titleText = isRecipes ? 'Prova alcuni esempi' : 'Prova alcune sfide',
+  titleId = isRecipes ? 'Esempi' : 'Sfide',


Suggested change

titleId = isRecipes ? 'Esempi' : 'Sfide',

titleId = isRecipes ? 'esempi' : 'sfide',

mattia-sanfilippo · 2023-04-28T09:37:23Z

src/content/learn/passing-props-to-a-component.md

+## Props familiari {/*familiar-props*/}
+Le props sono le informazioni che passi ad un tag JSX. Ad esempio, `className`, `src`, `alt`, `width` e `height` sono alcune delle props che puoi passare ad un `<img>`:


Suggested change

## Props familiari {/*familiar-props*/}

Le props sono le informazioni che passi ad un tag JSX. Ad esempio, `className`, `src`, `alt`, `width` e `height` sono alcune delle props che puoi passare ad un `<img>`:

## Props familiari {/*familiar-props*/}

Le props sono le informazioni che passi ad un tag JSX. Ad esempio, `className`, `src`, `alt`, `width` e `height` sono alcune delle props che puoi passare ad un `<img>`:

Aggiunto spazio presente nell'originale :)

mattia-sanfilippo · 2023-04-28T09:39:01Z

src/content/learn/passing-props-to-a-component.md


-### Step 2: Read props inside the child component {/*step-2-read-props-inside-the-child-component*/}
+### Step 2: Leggi le props all'interno del tuo componente figlio {/*step-2-read-props-inside-the-child-component*/}


Suggested change

### Step 2: Leggi le props all'interno del tuo componente figlio {/*step-2-read-props-inside-the-child-component*/}

### Step 2: Leggi le props all'interno del componente figlio {/*step-2-read-props-inside-the-child-component*/}

mattia-sanfilippo · 2023-04-28T09:39:38Z

src/content/learn/passing-props-to-a-component.md


 ```js
 function Avatar({ person, size }) {
-  // person and size are available here
+  // person and size sono disponibili qui


Suggested change

// person and size sono disponibili qui

// person e size sono disponibili qui

mattia-sanfilippo · 2023-04-28T09:42:31Z

src/content/learn/passing-props-to-a-component.md


 <Pitfall>

-**Don't miss the pair of `{` and `}` curlies** inside of `(` and `)` when declaring props:
+**Non dimenticare la coppia di `{` e `}` graffe** all'interno di `(` e `)` quando dichiari le props:


Suggested change

**Non dimenticare la coppia di `{` e `}` graffe** all'interno di `(` e `)` quando dichiari le props:

**Non dimenticare la coppia di graffe `{` e `}`** all'interno di `(` e `)` quando dichiari le props:

mattia-sanfilippo · 2023-04-28T09:48:36Z

src/content/learn/passing-props-to-a-component.md

+* Per passare le props, aggiungile al JSX, proprio come faresti con gli attributi HTML.
+* Per leggere le props, usa la sintassi di destrutturazione `function Avatar({ person, size })`.
+* Puoi specificare un valore predefinito come `size = 100`, che viene utilizzato per le props mancanti ed `undefined`.
+* Puoi inoltra tutte le props con la sintassi di spread JSX `<Avatar {...props} />`, ma non abusarne!


Suggested change

* Puoi inoltra tutte le props con la sintassi di spread JSX `<Avatar {...props} />`, ma non abusarne!

* Puoi inoltrare tutte le props con la sintassi di spread JSX `<Avatar {...props} />`, ma non abusarne!

mattia-sanfilippo · 2023-04-28T09:50:03Z

src/content/learn/passing-props-to-a-component.md

+* Puoi inoltra tutte le props con la sintassi di spread JSX `<Avatar {...props} />`, ma non abusarne!
+* Il JSX annidato come `<Card><Avatar /></Card>` apparirà come `children` della prop del componente `Card`.
+* Le props sono istantanee di sola lettura nel tempo: ogni render riceve una nuova versione delle props.
+* Non puoi cambiare le props. Quando hai bisogno di interattività, dovrai impostare lo stato.


Suggested change

* Non puoi cambiare le props. Quando hai bisogno di interattività, dovrai impostare lo stato.

* Non puoi cambiare le props. Quando hai bisogno di interattività, dovrai impostare lo state.

Teniamo state come da glossario 🙂

mattia-sanfilippo · 2023-04-28T09:50:26Z

src/content/learn/passing-props-to-a-component.md


-**Don't try to "change props".** When you need to respond to the user input (like changing the selected color), you will need to "set state", which you can learn about in [State: A Component's Memory.](/learn/state-a-components-memory)
+**Non provare a "cambiare le props".** Quando hai bisogno di rispondere all'input dell'utente (come cambiare il colore selezionato), dovrai "impostare lo stato", che puoi imparare in [State: La memoria di un Componente.](/learn/state-a-components-memory)


Suggested change

**Non provare a "cambiare le props".** Quando hai bisogno di rispondere all'input dell'utente (come cambiare il colore selezionato), dovrai "impostare lo stato", che puoi imparare in [State: La memoria di un Componente.](/learn/state-a-components-memory)

**Non provare a "cambiare le props".** Quando hai bisogno di rispondere all'input dell'utente (come cambiare il colore selezionato), dovrai "impostare lo stato", che puoi imparare in [State: La Memoria di un Componente.](/learn/state-a-components-memory)

mattia-sanfilippo · 2023-04-28T09:50:56Z

src/content/learn/passing-props-to-a-component.md


-**Don't try to "change props".** When you need to respond to the user input (like changing the selected color), you will need to "set state", which you can learn about in [State: A Component's Memory.](/learn/state-a-components-memory)
+**Non provare a "cambiare le props".** Quando hai bisogno di rispondere all'input dell'utente (come cambiare il colore selezionato), dovrai "impostare lo stato", che puoi imparare in [State: La memoria di un Componente.](/learn/state-a-components-memory)


Suggested change

**Non provare a "cambiare le props".** Quando hai bisogno di rispondere all'input dell'utente (come cambiare il colore selezionato), dovrai "impostare lo stato", che puoi imparare in [State: La memoria di un Componente.](/learn/state-a-components-memory)

**Non provare a "cambiare le props".** Quando hai bisogno di rispondere all'input dell'utente (come cambiare il colore selezionato), dovrai "impostare lo state", che puoi imparare in [State: La memoria di un Componente.](/learn/state-a-components-memory)

Teniamo state come da glossario 🙂

mattia-sanfilippo · 2023-04-28T09:54:33Z

Oops, ho fatto tardi 😄

Th3Wall · 2023-04-28T10:07:43Z

Oops, ho fatto tardi 😄

No problem, posso aprire una PR separata ed aggiungo queste fix 😉

Th3Wall · 2023-04-29T22:05:44Z

Ciao @mattia-sanfilippo, ho appena creato la PR per aggiustare le translations con le modifiche che hai suggerito 😄
Aspetto una tua review. Ciaooo! 👋🏼

Translated page content && Added Challenge, Recap & Illustration comp…

322da9b

…onents translations

vercel bot deployed to Preview – it-react-dev April 27, 2023 23:54 View deployment

deblasis reviewed Apr 28, 2023

View reviewed changes

src/content/learn/passing-props-to-a-component.md Outdated Show resolved Hide resolved

deblasis reviewed Apr 28, 2023

View reviewed changes

src/content/learn/passing-props-to-a-component.md Outdated Show resolved Hide resolved

Apply suggestions from code review

95585e6

Co-authored-by: Alessandro De Blasis <alex@deblasis.net>

deblasis approved these changes Apr 28, 2023

View reviewed changes

vercel bot deployed to Preview – it-react-dev April 28, 2023 09:44 View deployment

deblasis merged commit 85d76bc into reactjs:main Apr 28, 2023

deblasis mentioned this pull request Apr 28, 2023

New Italian Translation Progress #418

Open

mattia-sanfilippo reviewed Apr 28, 2023

View reviewed changes

Th3Wall mentioned this pull request Apr 29, 2023

Adjusted translations on "Passing props to to a component" page #432

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Translated page content & Challenge, Recap, Illustration components translations #428

Translated page content & Challenge, Recap, Illustration components translations #428

Th3Wall commented Apr 27, 2023

github-actions bot commented Apr 27, 2023

📦 Next.js Bundle Analysis for react-dev

Three Pages Changed Size

deblasis left a comment

Th3Wall commented Apr 28, 2023 •

edited

Loading

github-actions bot commented Apr 28, 2023

📦 Next.js Bundle Analysis for react-dev

Three Pages Changed Size

mattia-sanfilippo Apr 28, 2023

mattia-sanfilippo Apr 28, 2023

mattia-sanfilippo Apr 28, 2023

mattia-sanfilippo Apr 28, 2023

mattia-sanfilippo Apr 28, 2023

mattia-sanfilippo Apr 28, 2023

mattia-sanfilippo Apr 28, 2023

mattia-sanfilippo Apr 28, 2023

mattia-sanfilippo Apr 28, 2023

mattia-sanfilippo commented Apr 28, 2023

Th3Wall commented Apr 28, 2023

Th3Wall commented Apr 29, 2023

	titleId = isRecipes ? 'Esempi' : 'Sfide',
	titleId = isRecipes ? 'esempi' : 'sfide',

		## Props familiari {/familiar-props/}
		Le props sono le informazioni che passi ad un tag JSX. Ad esempio, `className`, `src`, `alt`, `width` e `height` sono alcune delle props che puoi passare ad un `<img>`:


		### Step 2: Read props inside the child component {/step-2-read-props-inside-the-child-component/}
		### Step 2: Leggi le props all'interno del tuo componente figlio {/step-2-read-props-inside-the-child-component/}

	// person and size sono disponibili qui
	// person e size sono disponibili qui

	Non dimenticare la coppia di `{` e `}` graffe all'interno di `(` e `)` quando dichiari le props:
	Non dimenticare la coppia di graffe `{` e `}` all'interno di `(` e `)` quando dichiari le props:

	* Puoi inoltra tutte le props con la sintassi di spread JSX `<Avatar {...props} />`, ma non abusarne!
	* Puoi inoltrare tutte le props con la sintassi di spread JSX `<Avatar {...props} />`, ma non abusarne!

	* Non puoi cambiare le props. Quando hai bisogno di interattività, dovrai impostare lo stato.
	* Non puoi cambiare le props. Quando hai bisogno di interattività, dovrai impostare lo state.


		Don't try to "change props". When you need to respond to the user input (like changing the selected color), you will need to "set state", which you can learn about in [State: A Component's Memory.](/learn/state-a-components-memory)
		Non provare a "cambiare le props". Quando hai bisogno di rispondere all'input dell'utente (come cambiare il colore selezionato), dovrai "impostare lo stato", che puoi imparare in [State: La memoria di un Componente.](/learn/state-a-components-memory)

Translated page content & Challenge, Recap, Illustration components translations #428

Translated page content & Challenge, Recap, Illustration components translations #428

Conversation

Th3Wall commented Apr 27, 2023

github-actions bot commented Apr 27, 2023

Size changes

📦 Next.js Bundle Analysis for react-dev

Three Pages Changed Size

deblasis left a comment

Choose a reason for hiding this comment

Th3Wall commented Apr 28, 2023 • edited Loading

github-actions bot commented Apr 28, 2023

Size changes

📦 Next.js Bundle Analysis for react-dev

Three Pages Changed Size

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

mattia-sanfilippo commented Apr 28, 2023

Th3Wall commented Apr 28, 2023

Th3Wall commented Apr 29, 2023

Th3Wall commented Apr 28, 2023 •

edited

Loading