docs: minor article fixes

content/blog/what-are-react-server-components/index.md

@@ -3,6 +3,7 @@
     title: "What are React Server Components (RSCs)?",
     description: "React Server Components have been a topic of regular discussion in the WebDev space as-of late. What are they? How do they improve the SSR story for React? Let's take a look.",
     published: '2023-12-16T21:52:59.284Z',
+    edited: '2023-12-17T21:52:59.284Z',
     authors: ['crutchcorn'],
     tags: ['react', 'webdev', 'javascript'],
     attached: [],
@@ -24,13 +25,11 @@ See, up to that point Next.js and other React SSR solutions had one way of doing
 4) Re-generate the VDOM from scratch on the client
 5) Wipe away the old DOM and re-render all components from the new client's VDOM instance
 
-
-
 ![The developer ships SSR and framework code to the server, which produces HTML. This HTML/CSS is then sent to the user machine where it re-initializes on the client's browser](./ssr_slowdown.svg)
 
-This process is called "Rehydration" and while it _worked_ the way it did before, it introduced a new performance problem. Rehydration could be needlessly expensive if most of your content coming from the server was going to be static anyway. This was a huge problem that the React team had to solve.
+This process is called "Hydration" and while it _worked_ the way it did before, it introduced a new performance problem. Hydration could be needlessly expensive if most of your content coming from the server was going to be static anyway. This was a huge problem that the React team had to solve.
 
-Later, in the same year of my article (December 2020), they had the answer: [React Server Components](https://legacy.reactjs.org/blog/2020/12/21/data-fetching-with-react-server-components.html).
+Later in the same year of my article (December 2020), they had the answer: [React Server Components](https://legacy.reactjs.org/blog/2020/12/21/data-fetching-with-react-server-components.html).
 
 # What is a React Server Component (RSC)?
 
@@ -59,14 +58,13 @@ Here, we can see that `<ProfilePicture>`, `<Dashboard/>`, and all of their child
 
 > Keep in mind, client-components will still pre-generate HTML on the server by default. The difference here is that the client re-initialization is now informed by the VDOM constructed on the server, allowing for drastically reduced required execution.
 
-# What is `"use server"` and `"use client"`?
+# What is `"use client"`?
 
-In React Server Components, `"use server"` and `"use client"` are strings at the top of the file or function that indicate where the React component should render. If `"use client"`, it will rehydrate on the client; otherwise it won't.
+In React Server Components, `"use client"` is a string at the top of the file or function that indicates that React should also render the component on the client. Rendering on the client side allows you to use state and rerender reactively. Without "use client", the component will be treated as a server component.
 
-Let's use Next.js' syntax to build out the example from above, distinguishing which type of component is which along the way:
+Let's use this `"use client"` syntax to build out the example from the image in the previous section, distinguishing which type of component is which along the way:
 
 ```jsx
-"use server"
 // page.jsx
 import {ProfilePicture, Dashboard} from "./client-components"
 
@@ -130,13 +128,13 @@ Because a server component runs entirely on the server, there are a few limitati
 
 - You cannot pass the following property values from a server component to a client component:
 
-  - React Elements/JSX
+  - React Elements/JSX (`component={<Component/>}` or `component={Component}`)
   - Functions (unless it's a Server Action - more on that in a future article)
   - Classes
   - Instances of Custom Classes
   - Custom [Symbols](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Symbol)
 
-- Cannot be called inside of a Client component. IE:
+- Cannot be called inside a Client component. IE:
 
   ```jsx
   const ClientComponent = () => {
@@ -150,7 +148,7 @@ Because a server component runs entirely on the server, there are a few limitati
   const ClientComponent = ({children}) => {
   	return <div>{children}</div>
   }
-  
+
   const App = () => {
   	return <ClientComponent><ServerComponent/></ClientComponent>
   }
@@ -160,7 +158,7 @@ Because a server component runs entirely on the server, there are a few limitati
 
 # Conclusion
 
-React Server Components have been a huge topic of discussion lately. So much so that while the fixes to rehydration are useful, you may be left wondering:
+React Server Components have been a huge topic of discussion lately. So much so that while the fixes to hydration are useful, you may be left wondering:
 
 > Is that all there is to RSCs?