Feature | Sidebar Resources Skeleton Created

website/README.md → website/all-about-react/README.md

@@ -1,6 +1,6 @@
 # Website
 
-This website is built using [Docusaurus 2](https://docusaurus.io/), a modern static website generator.
+This website is built using [Docusaurus](https://docusaurus.io/), a modern static website generator.
 
 ### Installation
 

website/all-about-react/docs/1-server-side-rendering/1-react-dom-server.md

@@ -0,0 +1,5 @@
+---
+sidebar_position: 1
+---
+
+# React DOM Server

website/all-about-react/docs/1-server-side-rendering/2-nextjs.md

@@ -0,0 +1,5 @@
+---
+sidebar_position: 2
+---
+
+# NextJS

website/all-about-react/docs/1-server-side-rendering/3-remix.md

@@ -0,0 +1,5 @@
+---
+sidebar_position: 3
+---
+
+# Remix

website/all-about-react/docs/1-server-side-rendering/_category_.json

@@ -0,0 +1,7 @@
+{
+  "label": "Server Side Rendering",
+  "position": 2,
+  "link": {
+    "type": "generated-index"
+  }
+}

website/all-about-react/docs/2-state-and-props/1-state-and-props.md

@@ -0,0 +1,26 @@
+---
+sidebar_position: 1
+---
+
+# State & Props
+
+### Blogs and Articles
+
+- 📜 [You Probably Don't Need Derived State by Brian Vaughn](https://reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html#when-to-use-derived-state)
+- 📜 [Props vs State by Kent C. Dodds](https://kentcdodds.com/blog/props-vs-state)
+- 📜 [Don't Sync State. Derive It by Kent C. Dodds](https://kentcdodds.com/blog/application-state-management-with-react)
+- 📜 [Application State Management with React by Kent C. Dodds](https://kentcdodds.com/blog/application-state-management-with-react)
+- 📜 [State Colocation will make your React app faster by Kent C. Dodds](https://kentcdodds.com/blog/understanding-reacts-key-prop)
+- 📜 [Understanding React's key prop by Kent C. Dodds](https://kentcdodds.com/blog/use-state-lazy-initialization-and-function-updates)
+- 📜 [useState lazy initialization and function updates by Kent C. Dodds](https://kentcdodds.com/blog/use-state-lazy-initialization-and-function-updates)
+- 📜 [Should I useState or useReducer? by Kent C. Dodds](https://kentcdodds.com/blog/should-i-usestate-or-usereducer)
+- 📜 [How to implement useState with useReducer by Kent C. Dodds](https://kentcdodds.com/blog/how-to-implement-usestate-with-usereducer)
+- 📜 [My State Management Mistake by Kent C. Dodds](https://epicreact.dev/my-state-management-mistake/)
+- 📜 [How To Use and Not Use State By Brad Westfall](https://reacttraining.com/blog/how-to-use-and-not-use-state/)
+- 📜 [How is state related to the declarative approach in React? by Brad Westfall](https://reacttraining.com/blog/state-and-the-declarative-approach/)
+
+### Talks
+
+- 🎥 [Using Composition in React to Avoid "Prop Drilling" By Michael Jackson](https://www.youtube.com/watch?v=3XaXKiXtNjw)
+- 🎥 [The Actor Model: a new mental model for React by Farzad YousefZadeh](https://portal.gitnation.org/contents/the-actor-model-a-new-mental-model-for-react)
+- 🎥 [setState, We Need to Talk! by Nikhil Sharma](https://portal.gitnation.org/contents/setstate-we-need-to-talk)

website/all-about-react/docs/2-state-and-props/_category_.json

@@ -0,0 +1,8 @@
+{
+  "label": "State and Props",
+  "position": 3,
+  "link": {
+    "type": "generated-index",
+    "description": "All about state and props."
+  }
+}

website/all-about-react/docs/3-hooks/1-use-state.md

@@ -0,0 +1,50 @@
+---
+sidebar_position: 1
+---
+
+# useState
+
+### Blogs and Articles
+
+- 📜 [Why Do React Hooks Rely on Call Order by Dan Abramov](https://overreacted.io/why-do-hooks-rely-on-call-order/)
+- 📜 [Before You memo() by Dan Abramov](https://overreacted.io/before-you-memo/)
+- 📜 [A Complete Guide to useEffect by Dan Abramov](https://overreacted.io/a-complete-guide-to-useeffect/)
+- 📜 [Synchronizing with Effects by Dan Abramov](https://beta.reactjs.org/learn/synchronizing-with-effects)
+- 📜 [Making setInterval Declarative with React Hooks by Dan Abramov](https://overreacted.io/making-setinterval-declarative-with-react-hooks/)
+- 📜 [Reconciling the useEffect Tree By Ryan Florence](https://reacttraining.com/blog/react-effect-tree/)
+- 📜 [Using Hooks in Classes By Ryan Florence](https://reacttraining.com/blog/using-hooks-in-classes/)
+- 📜 [useEffect vs useLayoutEffect by Kent C. Dodds](https://kentcdodds.com/blog/useeffect-vs-uselayouteffect)
+- 📜 [React Hooks: Compound Components by Kent C. Dodds](https://kentcdodds.com/blog/compound-components-with-react-hooks)
+- 📜 [5 Tips to Help You Avoid React Hooks Pitfalls by Kent C. Dodds](https://kentcdodds.com/blog/react-hooks-pitfalls)
+- 📜 [When to useMemo and useCallback by Kent C. Dodds](https://kentcdodds.com/blog/usememo-and-usecallback)
+- 📜 [Myths about useEffect by Kent C. Dodds](https://epicreact.dev/myths-about-useeffect/)
+- 📜 [useEffect(fn, []) is not the new componentDidMount() by Brad Westfall](https://reacttraining.com/blog/useEffect-is-not-the-new-componentDidMount/)
+- 📜 [When do I use functions in a Hooks Dependency Array? By Brad Westfall](https://reacttraining.com/blog/when-to-use-functions-in-hooks-dependency-array/)
+- 📜 [Wins for Hooks By Brad Westfall](https://reacttraining.com/blog/wins-for-hooks/)
+- 📜 [Blog Claps, and lessons on Hooks By Brad Westfall](https://reacttraining.com/blog/blog-claps-and-lessons-on-hooks/)
+
+### Talks
+
+- 🎥 [React Today and Tomorrow and 90% Cleaner React With Hooks by Dan Abramov](https://www.youtube.com/watch?v=dpw9EHDh2bM&list=RDCMUCz5vTaEhvh7dOHEyd1efcaQ&start_radio=1&rv=dpw9EHDh2bM&t=4)
+- 🎥 [90% Cleaner React With Hooks by Ryan Florence](https://youtu.be/wXLf18DsV-I)
+- 🎥 [Fun with React Hooks by Michael Jackson and Ryan Florence](https://youtu.be/1jWS7cCuUXw)
+- 🎥 [Modern React Workshop: Hooks and Suspense (Part 1) by Kent C. Dodds](https://www.youtube.com/watch?v=xcZXS_VEJS0)
+- 🎥 [Modern React Workshop: Hooks and Suspense (Part 2) by Kent C. Dodds](https://www.youtube.com/watch?v=NKAfuguroRY)
+- 🎥 [Live with Kent: TypeScriptifying the "Advanced React Hooks" workshop by Kent C. Dodds](https://www.youtube.com/watch?v=wsTKYr2acl8)
+- 🎥 [React Hook Pitfalls - React Rally 2019 by Kent C. Dodds](https://www.youtube.com/watch?v=VIRcX2X7EUk)
+- 🎥 [React useEffect - What goes in the dependency array? What do functions sometimes go in the array? By Brad Westfall](https://www.youtube.com/watch?v=NbzDb15j_WU)
+- 🎥 [Composing Behavior in React or Why React Hooks are Awesome by Michael Jackson](https://www.youtube.com/watch?v=nUzLlHFVXx0)
+- 🎥 [Hooks are a great abstraction model by Calin Tamas](https://portal.gitnation.org/contents/hooks-are-a-great-abstraction-model)
+- 🎥 [We Don’t Know How React State Hooks Work by Adam Klein](https://portal.gitnation.org/contents/we-dont-know-how-react-state-hooks-work-456)
+- 🎥 [Don't Forget React Memo by Khrystyna Landvytovych](https://portal.gitnation.org/contents/dont-forget-react-memo)
+- 🎥 [Requisite React: Learn how to use React Hooks, Suspense & JSX by Kent C. Dodds](https://www.youtube.com/watch?v=tO8qHlr6Wqg&list=PLNBNS7NRGKMHLTeH4qfD3F320GXfj97kc&index=1)
+- 🎥 [React's Tackle Box, Using the Right Hooks for the Job by Bryan Pitt](https://www.youtube.com/watch?v=uDguyp13pl8)
+- 🎥 [Build Modern React apps with Hooks, Suspense, Context, and Firebase by Jeff Huleatt](https://www.youtube.com/watch?v=Mi9aKDcpRYA&list=PLNBNS7NRGKMH-zMH-MG7wSszTThAKFi3S&index=11)
+- 🎥 [The Psychological Effects of useEffect by Sara Vieira](https://www.youtube.com/watch?v=0Mfk9k1eXME)
+- 🎥 [React without memo by Xuan Huang](https://www.youtube.com/watch?v=lGEMwh32soc&t=404s)
+
+### Podcasts
+
+- 🎙️ [Realigning Your Model of React After Hooks With Dan Abramov](https://kentcdodds.com/chats/01/03/realigning-your-model-of-react-after-hooks-with-dan-abramov)
+- 🎙️ [Trying React Hooks for the first time with Dan Abramov](https://www.youtube.com/watch?v=G-aO5hzo1aw)
+- 🎙️ [Hooks are Mixins with Ryan Florence](https://spec.fm/podcasts/reactpodcast/6495881a)

website/all-about-react/docs/3-hooks/10-use-insertion-effect.md

@@ -0,0 +1,5 @@
+---
+sidebar_position: 10
+---
+
+# useInsertionEffect

website/all-about-react/docs/3-hooks/11-use-layout-effect.md

@@ -0,0 +1,5 @@
+---
+sidebar_position: 11
+---
+
+# useLayoutEffect

website/all-about-react/docs/3-hooks/12-use-memo.md

@@ -0,0 +1,5 @@
+---
+sidebar_position: 12
+---
+
+# useMemo

website/all-about-react/docs/3-hooks/13-use-reducer.md

@@ -0,0 +1,5 @@
+---
+sidebar_position: 13
+---
+
+# useReducer

website/all-about-react/docs/3-hooks/14-use-ref.md

@@ -0,0 +1,5 @@
+---
+sidebar_position: 14
+---
+
+# useRef

website/all-about-react/docs/3-hooks/15-use-sync-external-store.md

@@ -0,0 +1,5 @@
+---
+sidebar_position: 15
+---
+
+# useSyncExternalStore

website/all-about-react/docs/3-hooks/16-use-transition.md

@@ -0,0 +1,5 @@
+---
+sidebar_position: 16
+---
+
+# useTransition

website/all-about-react/docs/3-hooks/2-use-effect.md

@@ -0,0 +1,5 @@
+---
+sidebar_position: 2
+---
+
+# useEffect

website/all-about-react/docs/3-hooks/3-use-callback.md

@@ -0,0 +1,5 @@
+---
+sidebar_position: 3
+---
+
+# useCallback

website/all-about-react/docs/3-hooks/4-use-context.md

@@ -0,0 +1,5 @@
+---
+sidebar_position: 4
+---
+
+# useContext

website/all-about-react/docs/3-hooks/5-use-debug-value.md

@@ -0,0 +1,5 @@
+---
+sidebar_position: 5
+---
+
+# useDebugValue

website/all-about-react/docs/3-hooks/6-deferred-value.md

@@ -0,0 +1,5 @@
+---
+sidebar_position: 6
+---
+
+# useDeferredValue

website/all-about-react/docs/3-hooks/7-use-event.md

@@ -0,0 +1,5 @@
+---
+sidebar_position: 7
+---
+
+# useEvent

website/all-about-react/docs/3-hooks/8-use-id.md

@@ -0,0 +1,5 @@
+---
+sidebar_position: 8
+---
+
+# useId

website/all-about-react/docs/3-hooks/9-use-imperative-handle.md

@@ -0,0 +1,5 @@
+---
+sidebar_position: 9
+---
+
+# useImperativeHandler

website/all-about-react/docs/3-hooks/_category_.json

@@ -0,0 +1,8 @@
+{
+  "label": "Hooks",
+  "position": 4,
+  "link": {
+    "type": "generated-index",
+    "description": "All about hooks."
+  }
+}

website/all-about-react/docs/intro.md

@@ -0,0 +1,87 @@
+---
+sidebar_position: 1
+---
+
+# Introduction
+
+<!-- EXPERTS -->
+
+## Experts
+
+These are the React experts to whom we are referring for content and resources.
+
+<table>
+  <tr>
+      <td align="center">
+      <a href="#personal_blog">
+      <img src="https://avatars.githubusercontent.com/u/3624098?v=4?s=100" width="100px;" alt="Andrew Clark"/><br /><sub><b>Andrew Clark</b></sub>
+      </a><br />
+      <a href="https://github.com/acdlite" title="Github Profile"><img align="center"
+      src="https://raw.githubusercontent.com/rahuldkjain/github-profile-readme-generator/master/src/images/icons/Social/github.svg"
+      alt="github handle" height="20" width="20" /></a>&nbsp;&nbsp;<a href="https://twitter.com/acdlite" title="Twitter Profile"><img align="center"
+      src="https://raw.githubusercontent.com/rahuldkjain/github-profile-readme-generator/master/src/images/icons/Social/twitter.svg"
+      alt="twitter handle" height="20" width="20" /></a>
+      </td>
+      <td align="center">
+      <a href="http://www.briandavidvaughn.com">
+      <img src="https://avatars.githubusercontent.com/u/29597?v=4?s=100" width="100px;" alt="Brian Vaughn"/><br /><sub><b>Brian Vaughn</b></sub>
+      </a>
+      <br />
+      <a href="https://github.com/bvaughn" title="Github Profile"><img align="center"
+      src="https://raw.githubusercontent.com/rahuldkjain/github-profile-readme-generator/master/src/images/icons/Social/github.svg"
+      alt="github handle" height="20" width="20" /></a>&nbsp;&nbsp;<a href="https://mobile.twitter.com/brian_d_vaughn" title="Twitter Profile"><img align="center"
+      src="https://raw.githubusercontent.com/rahuldkjain/github-profile-readme-generator/master/src/images/icons/Social/twitter.svg"
+      alt="twitter handle" height="20" width="20" /></a>
+      </td>
+      <td align="center">
+      <a href="https://overreacted.io">
+      <img src="https://avatars.githubusercontent.com/u/810438?v=4?s=100" width="100px;" alt="Dan Abramov"/><br /><sub><b>Dan Abramov</b></sub>
+      </a><br />
+      <a href="https://github.com/gaearon" title="Github Profile"><img align="center"
+      src="https://raw.githubusercontent.com/rahuldkjain/github-profile-readme-generator/master/src/images/icons/Social/github.svg"
+      alt="github handle" height="20" width="20" /></a>&nbsp;&nbsp;<a href="https://twitter.com/dan_abramov" title="Twitter Profile"><img align="center"
+      src="https://raw.githubusercontent.com/rahuldkjain/github-profile-readme-generator/master/src/images/icons/Social/twitter.svg"
+      alt="twitter handle" height="20" width="20" /></a>
+      </td>
+      <td align="center">
+      <a href="https://ryanflorence.com">
+      <img src="https://avatars.githubusercontent.com/u/100200?v=4?s=100" width="100px;" alt="Ryan Florence"/><br /><sub><b>Ryan Florence</b></sub>
+      </a><br />
+      <a href="https://github.com/ryanflorence" title="Github Profile"><img align="center"
+      src="https://raw.githubusercontent.com/rahuldkjain/github-profile-readme-generator/master/src/images/icons/Social/github.svg"
+      alt="github handle" height="20" width="20" /></a>&nbsp;&nbsp;<a href="https://mobile.twitter.com/ryanflorence" title="Twitter Profile"><img align="center"
+      src="https://raw.githubusercontent.com/rahuldkjain/github-profile-readme-generator/master/src/images/icons/Social/twitter.svg"
+      alt="twitter handle" height="20" width="20" /></a>
+      </td>
+       <td align="center">
+       <a href="https://kentcdodds.com">
+       <img src="https://avatars.githubusercontent.com/u/1500684?v=4?s=100" width="100px;" alt="Kent C. Dodds"/><br /><sub><b>Kent C. Dodds</b></sub>
+       </a><br />
+       <a href="https://github.com/kentcdodds" title="Github Profile"><img align="center"
+      src="https://raw.githubusercontent.com/rahuldkjain/github-profile-readme-generator/master/src/images/icons/Social/github.svg"
+      alt="github handle" height="20" width="20" /></a>&nbsp;&nbsp;<a href="https://twitter.com/kentcdodds" title="Twitter Profile"><img align="center"
+      src="https://raw.githubusercontent.com/rahuldkjain/github-profile-readme-generator/master/src/images/icons/Social/twitter.svg"
+      alt="twitter handle" height="20" width="20" /></a>
+      </td>
+      <td align="center">
+      <a href="http://bradwestfall.com">
+      <img src="https://avatars.githubusercontent.com/u/2272118?v=4?s=100" width="100px;" alt="Brad Westfall"/><br /><sub><b>Brad Westfall</b></sub>
+      </a><br />
+      <a href="https://github.com/bradwestfall" title="Github Profile"><img align="center"
+      src="https://raw.githubusercontent.com/rahuldkjain/github-profile-readme-generator/master/src/images/icons/Social/github.svg"
+      alt="github handle" height="20" width="20" /></a>&nbsp;&nbsp;<a href="https://twitter.com/bradwestfall" title="Twitter Profile"><img align="center"
+      src="https://raw.githubusercontent.com/rahuldkjain/github-profile-readme-generator/master/src/images/icons/Social/twitter.svg"
+      alt="twitter handle" height="20" width="20" /></a>
+      </td>
+      <td align="center">
+      <a href="https://mjackson.me">
+      <img src="https://avatars.githubusercontent.com/u/92839?v=4?s=100" width="100px;" alt="Michael Jackson"/><br /><sub><b>Michael Jackson</b></sub>
+      </a><br />
+      <a href="https://github.com/mjackson" title="Github Profile"><img align="center"
+      src="https://raw.githubusercontent.com/rahuldkjain/github-profile-readme-generator/master/src/images/icons/Social/github.svg"
+      alt="github handle" height="20" width="20" /></a>&nbsp;&nbsp;<a href="https://twitter.com/mjackson" title="Twitter Profile"><img align="center"
+      src="https://raw.githubusercontent.com/rahuldkjain/github-profile-readme-generator/master/src/images/icons/Social/twitter.svg"
+      alt="twitter handle" height="20" width="20" /></a>
+      </td>
+  </tr>
+</table>