chore: improve wording

src/content/posts/2024-12-06-React-19.md

@@ -33,7 +33,7 @@ The React team briefly mentioned that previously React treated all unknown prope
 >
 > If you don’t know what’s the difference between attribute and property, I highly recommend this very good article from Jake Archibald “[HTML attributes vs DOM properties](https://jakearchibald.com/2024/attributes-vs-properties/)”
 
-The same applies to `CustomEvent` support. To attach an event listener to a `CustomEvent`, you must create a `Ref` to the web component and interact with the DOM node directly using `addEventListener()` and `removeEventListener()`.
+The same applies to `CustomEvent` support. To attach an event listener of a `CustomEvent`, you must create a `Ref` to the web component and interact with the DOM node directly using `addEventListener()` and `removeEventListener()`.
 
 Finally, there's the matter of how boolean attributes work in HTML. The presence of an attribute means `true`, while its absence means `false`. Before React 19, this behavior only worked for standard attributes like `disabled`. For custom boolean attributes, developers had to create a separate props object, add the attributes that should be `true`, and then spread the result object.
 
@@ -50,7 +50,7 @@ Fortunately, React 19 resolves all these issues. Let's create a two React apps w
 
 - One boolean attribute, `isdark` that changes the color of the text depending on the current color scheme.
 - One property `increment` with type `{ value : number }`, that allows to set up the increment value.
-- It emits a `CustomEven` “IncrementedEvent” with the current value as a payload.
+- It emits a `CustomEvent` “IncrementedEvent” with the current value as a payload.
 
 You can view the complete code here: [web-counter](https://github.com/aleks-elkin/react-web-components/blob/main/packages/web-components/web-counter.js)
 
@@ -77,6 +77,7 @@ This is how it will look in the browser:
 Because this web component has a property of the type `Object` that we want to interact with, we need to create a `Ref` first, and create a `useEffect` to manually update values when the state changes.
 
 ```javascript
+const [increment, setIncrement] = useState({ value: 1 });
 const counterRef = useRef(null);
 
 useEffect(() => {
@@ -90,7 +91,7 @@ useEffect(() => {
 <...>
 ```
 
-Also, we will use the `Ref` to subscribe to the `CustomEvent` to count the clicks.
+Also, we will use the `Ref` to subscribe to the custom `IncrementedEvent` to count the clicks.
 
 ```javascript
 useEffect(() => {