diff --git a/src/components/MDX/Sandpack/DownloadButton.tsx b/src/components/MDX/Sandpack/DownloadButton.tsx
index 5dcdc7a99..169c8e81e 100644
--- a/src/components/MDX/Sandpack/DownloadButton.tsx
+++ b/src/components/MDX/Sandpack/DownloadButton.tsx
@@ -2,8 +2,8 @@
* Copyright (c) Facebook, Inc. and its affiliates.
*/
-import {useSandpack} from '@codesandbox/sandpack-react/unstyled';
import {useSyncExternalStore} from 'react';
+import {useSandpack} from '@codesandbox/sandpack-react/unstyled';
import {IconDownload} from '../../Icon/IconDownload';
export interface DownloadButtonProps {}
diff --git a/src/content/blog/2022/06/15/react-labs-what-we-have-been-working-on-june-2022.md b/src/content/blog/2022/06/15/react-labs-what-we-have-been-working-on-june-2022.md
index 0d9e8e260..938b75c4b 100644
--- a/src/content/blog/2022/06/15/react-labs-what-we-have-been-working-on-june-2022.md
+++ b/src/content/blog/2022/06/15/react-labs-what-we-have-been-working-on-june-2022.md
@@ -8,7 +8,7 @@ June 15, 2022 by [Andrew Clark](https://twitter.com/acdlite), [Dan Abramov](http
-[React 18](https://reactjs.org/blog/2022/03/29/react-v18) was years in the making, and with it brought valuable lessons for the React team. Its release was the result of many years of research and exploring many paths. Some of those paths were successful; many more were dead-ends that led to new insights. One lesson we’ve learned is that it’s frustrating for the community to wait for new features without having insight into these paths that we’re exploring.
+[React 18](https://react.dev/blog/2022/03/29/react-v18) was years in the making, and with it brought valuable lessons for the React team. Its release was the result of many years of research and exploring many paths. Some of those paths were successful; many more were dead-ends that led to new insights. One lesson we’ve learned is that it’s frustrating for the community to wait for new features without having insight into these paths that we’re exploring.
diff --git a/src/content/community/conferences.md b/src/content/community/conferences.md
index 6e1780a7d..1c164a098 100644
--- a/src/content/community/conferences.md
+++ b/src/content/community/conferences.md
@@ -55,7 +55,6 @@ October 27th 2023. In-person in Verona, Italy and online (hybrid event)
[Website](https://2023.reactjsday.it/) - [Twitter](https://twitter.com/reactjsday) - [Facebook](https://www.facebook.com/GrUSP/) - [YouTube](https://www.youtube.com/c/grusp)
-
### React Summit US 2023 {/*react-summit-us-2023*/}
November 13 & 15, 2023. In-person in New York, US + remote first interactivity (hybrid event)
@@ -66,6 +65,11 @@ December 8 & 12, 2023. In-person in Berlin, Germany + remote first interactivity
[Website](https://reactday.berlin) - [Twitter](https://twitter.com/reactdayberlin) - [Facebook](https://www.facebook.com/reactdayberlin/) - [Videos](https://portal.gitnation.org/events/react-day-berlin-2023)
+### App.js Conf 2024 {/*appjs-conf-2024*/}
+May 22 - 24, 2024. In-person in Kraków, Poland + remote
+
+[Website](https://appjs.co) - [Twitter](https://twitter.com/appjsconf)
+
### Render(ATL) 2024 🍑 {/*renderatl-2024-*/}
June 12 - June 14, 2024. Atlanta, GA, USA
diff --git a/src/content/learn/referencing-values-with-refs.md b/src/content/learn/referencing-values-with-refs.md
index 1dfa7ddc4..4a4894a33 100644
--- a/src/content/learn/referencing-values-with-refs.md
+++ b/src/content/learn/referencing-values-with-refs.md
@@ -284,7 +284,11 @@ Sinun ei myöskään tarvitse huolehtia [mutaatioiden välttämistä](/learn/upd
## Ref ja DOM {/*refs-and-the-dom*/}
+<<<<<<< HEAD
Voit osoittaa refin mihin tahansa arvoon. Kuitenkin yleisin käyttökohde refille on DOM elementin käsittely. Esimerkiksi, tämä on kätevää jos haluat focusoida syöttölaatikon ohjelmakoodissa. Kun annat refin `ref`-attribuuttiin JSX:ssä, kuten `
`, React asettaa vastaavan DOM elementin `myRef.current`:iin. Voit lukea lisää tästä [Manipulating the DOM with Refs.](/learn/manipulating-the-dom-with-refs)
+=======
+You can point a ref to any value. However, the most common use case for a ref is to access a DOM element. For example, this is handy if you want to focus an input programmatically. When you pass a ref to a `ref` attribute in JSX, like `
`, React will put the corresponding DOM element into `myRef.current`. Once the element is removed from the DOM, React will update `myRef.current` to be `null`. You can read more about this in [Manipulating the DOM with Refs.](/learn/manipulating-the-dom-with-refs)
+>>>>>>> 68f417a600c7d7b8c4131e39f8a843a856ae3909
diff --git a/src/content/learn/removing-effect-dependencies.md b/src/content/learn/removing-effect-dependencies.md
index 6bf105b51..6fd783371 100644
--- a/src/content/learn/removing-effect-dependencies.md
+++ b/src/content/learn/removing-effect-dependencies.md
@@ -1613,7 +1613,11 @@ label, button { display: block; margin-bottom: 5px; }
Efektisi ajetaan uudelleen koska se riippuu `options` oliosta. Olioita voi luoda vahingossa, ja niitä tulisi välttää Efektien riippuvuuksina aina kun mahdollista.
+<<<<<<< HEAD
Vähiten häiritsevä tapa korjata on lukea `roomId` ja `serverUrl` suoraan Efektin ulkopuolelta, ja tehdä Efektistä riippuvainen näistä primitiivisistä arvoista (jotka eivät voi muuttua tahattomasti). Efektin sisällä, luo olio ja välitä se `createConnection` funktiolle:
+=======
+The least invasive fix is to read `roomId` and `serverUrl` right outside the Effect, and then make the Effect depend on those primitive values (which can't change unintentionally). Inside the Effect, create an object and pass it to `createConnection`:
+>>>>>>> 68f417a600c7d7b8c4131e39f8a843a856ae3909
diff --git a/src/content/learn/rendering-lists.md b/src/content/learn/rendering-lists.md
index 61d8b2205..6b1c7d27f 100644
--- a/src/content/learn/rendering-lists.md
+++ b/src/content/learn/rendering-lists.md
@@ -1086,7 +1086,11 @@ Tässä `` on lyhytsyntaksi joka "välitt
#### Listat erottimella {/*list-with-a-separator*/}
+<<<<<<< HEAD
Tämä esimerkki renderöi kuuluisan Katsushika Hokusain haikun, jokaisen rivin ollessa kääritty `
` tagin sisään. Tehtäväsi on sijoittaa `
` erotin jokaisen kappaleen jälkeen. Lopputuloksen rakennelman pitäisi näyttää tältä:
+=======
+This example renders a famous haiku by Tachibana Hokushi, with each line wrapped in a `
` tag. Your job is to insert an `
` separator between each paragraph. Your resulting structure should look like this:
+>>>>>>> 68f417a600c7d7b8c4131e39f8a843a856ae3909
```js
diff --git a/src/content/learn/start-a-new-react-project.md b/src/content/learn/start-a-new-react-project.md
index 72dca7009..9ba85b6df 100644
--- a/src/content/learn/start-a-new-react-project.md
+++ b/src/content/learn/start-a-new-react-project.md
@@ -21,12 +21,16 @@ Jos haluat rakentaa uuden sovelluksen tai verkkosivuston täysin Reactilla, suos
**[Next.js](https://nextjs.org/) on full-stack React-ohjelmistokehys.** Se on monipuolinen ja antaa sinun luoda React-sovelluksia mistä tahansa koosta--lähes staattisesta blogista monimutkaiseen dynaamiseen sovellukseen. Luodaksesi uuden Next.js-projektin, aja terminaalissa:
-npx create-next-app
+npx create-next-app@latest
Jos olet uusi Next.js:ään, tutustu [Next.js tutoriaaliin.](https://nextjs.org/learn/foundations/about-nextjs)
+<<<<<<< HEAD
Next.js:ää ylläpitää [Vercel](https://vercel.com/). Voit [julkaista Next.js-sovelluksen](https://nextjs.org/docs/deployment) mihin tahansa Node.js- tai serverless-ympäristöön, tai omalla palvelimellasi. [Täysin staattiset Next.js-sovellukset](https://nextjs.org/docs/advanced-features/static-html-export) voidaan julkaista missö tahansa staattisessa hosting-ympäristössä.
+=======
+Next.js is maintained by [Vercel](https://vercel.com/). You can [deploy a Next.js app](https://nextjs.org/docs/app/building-your-application/deploying) to any Node.js or serverless hosting, or to your own server. Next.js also supports a [static export](https://nextjs.org/docs/pages/building-your-application/deploying/static-exports) which doesn't require a server.
+>>>>>>> 68f417a600c7d7b8c4131e39f8a843a856ae3909
### Remix {/*remix*/}
@@ -89,6 +93,7 @@ Nämä ominaisuudet ovat lähempänä tuotantokäyttöä joka päivä, ja olemme
### Next.js (App Router) {/*nextjs-app-router*/}
+<<<<<<< HEAD
**[Next.js's App Router](https://beta.nextjs.org/docs/getting-started) on Next.js:n API:en uudelleensuunnittelu, joka tähtää React-tiimin full-stack arkkitehtuurin visioon.** Se antaa sinun hakea dataa asynkronisissa komponenteissa, jotka suoritetaan palvelimella tai jopa rakennusaikana.
Next.js:ää ylläpitää [Vercel](https://vercel.com/). Voit [julkaista Next.js-sovelluksen](https://nextjs.org/docs/deployment) mihin tahansa Node.js- tai serverless-ympäristöön, tai omalla palvelimellasi. Next.js tukee myös [staattista vientiä](https://nextjs.org/docs/advanced-features/static-html-export), joka ei vaadi palvelinta.
@@ -97,6 +102,11 @@ Next.js:ää ylläpitää [Vercel](https://vercel.com/). Voit [julkaista Next.js
**Next.js:n App Router on tällä hetkellä beta-vaiheessa eikä sitä vielä suositella tuotantokäyttöön** (maaliskuussa 2023). Kokeillaksesi sitä olemassa olevassa Next.js-projektissa, [seuraa tätä ohjeistusta](https://beta.nextjs.org/docs/upgrade-guide#migrating-from-pages-to-app).
+=======
+**[Next.js's App Router](https://nextjs.org/docs) is a redesign of the Next.js APIs aiming to fulfill the React team’s full-stack architecture vision.** It lets you fetch data in asynchronous components that run on the server or even during the build.
+
+Next.js is maintained by [Vercel](https://vercel.com/). You can [deploy a Next.js app](https://nextjs.org/docs/app/building-your-application/deploying) to any Node.js or serverless hosting, or to your own server. Next.js also supports [static export](https://nextjs.org/docs/app/building-your-application/deploying/static-exports) which doesn't require a server.
+>>>>>>> 68f417a600c7d7b8c4131e39f8a843a856ae3909
diff --git a/src/content/learn/state-as-a-snapshot.md b/src/content/learn/state-as-a-snapshot.md
index e1997dbcb..dce02560c 100644
--- a/src/content/learn/state-as-a-snapshot.md
+++ b/src/content/learn/state-as-a-snapshot.md
@@ -79,9 +79,15 @@ Toisin kuin valokuva tai elokuvan kehys, UI "tilannekuva", jonka palautat on int
Kun React renderöi komponentin uudelleen:
+<<<<<<< HEAD
1. React kutsuu funktiotasi uudelleen.
2. Funktiosi palauttaa uuden JSX tilannekuvan.
3. React sitten päivittää ruudun vastaamaan tilannekuvaa, jonka palautit.
+=======
+1. React calls your function again.
+2. Your function returns a new JSX snapshot.
+3. React then updates the screen to match the snapshot your function returned.
+>>>>>>> 68f417a600c7d7b8c4131e39f8a843a856ae3909
diff --git a/src/content/learn/synchronizing-with-effects.md b/src/content/learn/synchronizing-with-effects.md
index 64d75f7fc..a05da481a 100644
--- a/src/content/learn/synchronizing-with-effects.md
+++ b/src/content/learn/synchronizing-with-effects.md
@@ -773,7 +773,11 @@ Ostaminen ei aiheutunut renderöinnin takia. Se aiheutuu tietyn vuorovaikutuksen
}
```
+<<<<<<< HEAD
**Tämä osoittaa, että jos remounttaus rikkoo sovelluksen logiikkaa, tämä usein paljastaa olemassa olevia virheitä.** Käyttäjän näkökulmasta, sivulla vierailu ei pitäisi olla sen erilaisempaa kuin vierailu, linkin napsautus ja sitten Takaisin -painikkeen napsauttaminen. React varmistaa, että komponenttisi eivät riko tätä periaatetta kehitysvaiheessa remounttaamalla niitä kerran.
+=======
+**This illustrates that if remounting breaks the logic of your application, this usually uncovers existing bugs.** From a user's perspective, visiting a page shouldn't be different from visiting it, clicking a link, then pressing Back to view the page again. React verifies that your components abide by this principle by remounting them once in development.
+>>>>>>> 68f417a600c7d7b8c4131e39f8a843a856ae3909
## Laitetaan kaikki yhteen {/*putting-it-all-together*/}
diff --git a/src/content/learn/tutorial-tic-tac-toe.md b/src/content/learn/tutorial-tic-tac-toe.md
index 5aa702595..713aa7070 100644
--- a/src/content/learn/tutorial-tic-tac-toe.md
+++ b/src/content/learn/tutorial-tic-tac-toe.md
@@ -2075,7 +2075,17 @@ export default function Game() {
}
```
+<<<<<<< HEAD
Voit nähdä miltä koodisi tulisi näyttää alla. Huomaa, että sinun tulisi nähdä virhe kehittäjätyökalujen konsolissa, joka sanoo: ``Warning: Each child in an array or iterator should have a unique "key" prop. Check the render method of `Game`.`` Korjaat tämän virheen seuraavassa osiossa.
+=======
+You can see what your code should look like below. Note that you should see an error in the developer tools console that says:
+
+
+Warning: Each child in an array or iterator should have a unique "key" prop. Check the render method of `Game`.
+
+
+You'll fix this error in the next section.
+>>>>>>> 68f417a600c7d7b8c4131e39f8a843a856ae3909
diff --git a/src/content/reference/react-dom/components/common.md b/src/content/reference/react-dom/components/common.md
index 52b5f1912..19bbf803d 100644
--- a/src/content/reference/react-dom/components/common.md
+++ b/src/content/reference/react-dom/components/common.md
@@ -40,6 +40,7 @@ Nämä Reactin erikoispropsit tuetaan kaikissa sisäänrakennetuissa komponentei
Nämä standardit DOM propsit tuetaan myös kaikissa sisäänrakennetuissa komponenteissa:
+<<<<<<< HEAD
* [`accessKey`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/accesskey): Merkkijono. Määrittää pikanäppäimen elementille. [Ei yleensä suositeltavaa.](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/accesskey#accessibility_concerns)
* [`aria-*`](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes): ARIA attribuuttien avulla voit määrittää saavutettavuuspuun tiedot tälle elementille. Katso [ARIA attribuutit](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes) täydellistä viitettä varten. Reactissa kaikki ARIA attribuuttien nimet ovat täsmälleen samat kuin HTML:ssä.
* [`autoCapitalize`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autocapitalize): Merkkijono. Määrittää pitäisikö ja miten käyttäjän syöte kirjoittaa isolla alkukirjaimella.
@@ -154,6 +155,122 @@ Nämä standardit DOM propsit tuetaan myös kaikissa sisäänrakennetuissa kompo
* [`tabIndex`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex): Numero. Ylikirjoittaa oletus sarkain -näppäimen käyttäytymisen. [Vältä käyttämästä arvoja jotka eivät ole `-1` ja `0`.](https://www.tpgi.com/using-the-tabindex-attribute/)
* [`title`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/title): Merkkijono. Määrittää työkaluvihjeen tekstin elementille.
* [`translate`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/translate): Joko `'yes'` tai `'no'`. `'no'` estää elementin sisällön kääntämisen.
+=======
+* [`accessKey`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/accesskey): A string. Specifies a keyboard shortcut for the element. [Not generally recommended.](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/accesskey#accessibility_concerns)
+* [`aria-*`](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes): ARIA attributes let you specify the accessibility tree information for this element. See [ARIA attributes](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes) for a complete reference. In React, all ARIA attribute names are exactly the same as in HTML.
+* [`autoCapitalize`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autocapitalize): A string. Specifies whether and how the user input should be capitalized.
+* [`className`](https://developer.mozilla.org/en-US/docs/Web/API/Element/className): A string. Specifies the element's CSS class name. [Read more about applying CSS styles.](#applying-css-styles)
+* [`contentEditable`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/contenteditable): A boolean. If `true`, the browser lets the user edit the rendered element directly. This is used to implement rich text input libraries like [Lexical.](https://lexical.dev/) React warns if you try to pass React children to an element with `contentEditable={true}` because React will not be able to update its content after user edits.
+* [`data-*`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/data-*): Data attributes let you attach some string data to the element, for example `data-fruit="banana"`. In React, they are not commonly used because you would usually read data from props or state instead.
+* [`dir`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir): Either `'ltr'` or `'rtl'`. Specifies the text direction of the element.
+* [`draggable`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/draggable): A boolean. Specifies whether the element is draggable. Part of [HTML Drag and Drop API.](https://developer.mozilla.org/en-US/docs/Web/API/HTML_Drag_and_Drop_API)
+* [`enterKeyHint`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/enterKeyHint): A string. Specifies which action to present for the enter key on virtual keyboards.
+* [`htmlFor`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLLabelElement/htmlFor): A string. For [`