From b58681bdacaba3230dd6e8940026def6d73b585e Mon Sep 17 00:00:00 2001
From: Martti Malmi <sirius@iki.fi>
Date: Mon, 27 Sep 2021 12:51:13 +0300
Subject: [PATCH] .

---
 ...021-9-27-gun-for-react-state-management.md | 23 +++++++++++--------
 1 file changed, 14 insertions(+), 9 deletions(-)

diff --git a/_posts/2021-9-27-gun-for-react-state-management.md b/_posts/2021-9-27-gun-for-react-state-management.md
index 3912a8b..81981c6 100644
--- a/_posts/2021-9-27-gun-for-react-state-management.md
+++ b/_posts/2021-9-27-gun-for-react-state-management.md
@@ -19,25 +19,30 @@ const State = new Gun({
     file: 'State.local', 
     multicast: false,
     peers: []
-});
+}).get('state');
 
-class CommentForm {
+class CommentForm extends React.Component {
+    constructor() {
+      super();
+      this.state = {comment:''};
+    }
     componentDidMount() {
         State.get('comment').on(comment => this.setState({comment}));
     }
     
-    onInput(e) {
-        State.get('comment').put(e.target.value);
+    onInput(e) {  State.get('comment').put(e.target.value);
     }
     
     render() {
-        return {
-            <form>
-                <input type="text" value={{this.state.comment}} onInput={e => this.onInput(e)} />
+        return (
+            <form class="box">
+                <input placeholder="Type something" type="text" value={this.state.comment} onChange={e => this.onInput(e)} />
             </form>
-        }
+        );
     }
 }
 ```
 
-Now you have a comment form that automatically persists its content.
\ No newline at end of file
+Now you have a comment form that syncs its content across component instances and persists it in localStorage.
+
+See the working example on [Codepen](https://codepen.io/mmalmi/pen/VwWVdKG).
\ No newline at end of file