From aa7eb02897f7894fde09928d955d7b28ece97338 Mon Sep 17 00:00:00 2001
From: folt <foltfrend@list.ru>
Date: Tue, 12 Apr 2022 23:47:03 +0300
Subject: [PATCH 1/3] fix the code block for createRoot typescript error

---
 content/blog/2022-03-08-react-18-upgrade-guide.md | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/content/blog/2022-03-08-react-18-upgrade-guide.md b/content/blog/2022-03-08-react-18-upgrade-guide.md
index 677682a39cc..c72437d80aa 100644
--- a/content/blog/2022-03-08-react-18-upgrade-guide.md
+++ b/content/blog/2022-03-08-react-18-upgrade-guide.md
@@ -39,10 +39,9 @@ render(<App tab="home" />, container);
 
 // After
 import { createRoot } from 'react-dom/client';
-const container = document.getElementById('app');
+const container = document.getElementById('app') as HTMLElement;
 const root = createRoot(container);
 root.render(<App tab="home" />);
-
 ```
 
 We’ve also changed `unmountComponentAtNode` to `root.unmount`:

From 9f7ecd950a8f95e7d977e19089aa69f5a806e21d Mon Sep 17 00:00:00 2001
From: folt <foltfrend@list.ru>
Date: Wed, 13 Apr 2022 00:47:33 +0300
Subject: [PATCH 2/3] added example block code for typescript

---
 content/blog/2022-03-08-react-18-upgrade-guide.md | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/content/blog/2022-03-08-react-18-upgrade-guide.md b/content/blog/2022-03-08-react-18-upgrade-guide.md
index c72437d80aa..6b47b7b5bc6 100644
--- a/content/blog/2022-03-08-react-18-upgrade-guide.md
+++ b/content/blog/2022-03-08-react-18-upgrade-guide.md
@@ -39,11 +39,23 @@ render(<App tab="home" />, container);
 
 // After
 import { createRoot } from 'react-dom/client';
-const container = document.getElementById('app') as HTMLElement;
+const container = document.getElementById('app');
 const root = createRoot(container);
 root.render(<App tab="home" />);
 ```
 
+Example code if your project uses TypeScript:
+
+```typescript{3}
+import ReactDOM from 'react-dom/client';
+
+const root = ReactDOM.createRoot(
+  document.getElementById('root') as HTMLElement
+);
+
+root.render(<App tab="home" />);
+```
+
 We’ve also changed `unmountComponentAtNode` to `root.unmount`:
 
 ```js

From 6866a892fd75ab7d447e00fb1b313cf089e44a63 Mon Sep 17 00:00:00 2001
From: dan <dan.abramov@gmail.com>
Date: Wed, 13 Apr 2022 15:16:06 +0100
Subject: [PATCH 3/3] Inline example

---
 content/blog/2022-03-08-react-18-upgrade-guide.md | 14 +-------------
 1 file changed, 1 insertion(+), 13 deletions(-)

diff --git a/content/blog/2022-03-08-react-18-upgrade-guide.md b/content/blog/2022-03-08-react-18-upgrade-guide.md
index 6b47b7b5bc6..e11951899cf 100644
--- a/content/blog/2022-03-08-react-18-upgrade-guide.md
+++ b/content/blog/2022-03-08-react-18-upgrade-guide.md
@@ -40,19 +40,7 @@ render(<App tab="home" />, container);
 // After
 import { createRoot } from 'react-dom/client';
 const container = document.getElementById('app');
-const root = createRoot(container);
-root.render(<App tab="home" />);
-```
-
-Example code if your project uses TypeScript:
-
-```typescript{3}
-import ReactDOM from 'react-dom/client';
-
-const root = ReactDOM.createRoot(
-  document.getElementById('root') as HTMLElement
-);
-
+const root = createRoot(container); // createRoot(container!) if you use TypeScript
 root.render(<App tab="home" />);
 ```