Improve warnings and add to Fundamentals parts 1 and 5

Author: markerikson

docs/components/_FundamentalsWarning.mdx

@@ -1,10 +1,10 @@
 :::caution
 
-Note that **this tutorial intentionally shows older-style patterns that require more code than the "modern Redux" patterns we teach as the right approach for building apps with Redux today**, in order to explain the principles and concepts behind Redux. It's _not_ meant to be a production-ready project.
+Note that **this tutorial intentionally shows older-style Redux logic patterns that require more code than the "modern Redux" patterns with Redux Toolkit we teach as the right approach for building apps with Redux today**, in order to explain the principles and concepts behind Redux. It's _not_ meant to be a production-ready project.
 
 See these pages to learn how to use "modern Redux" with Redux Toolkit:
 
+- [**The full "Redux Essentials" tutorial**](../tutorials/essentials/part-1-overview-concepts.md), which teaches "how to use Redux, the right way" with Redux Toolkit for real-world apps. **We recommend that all Redux learners should read the "Essentials" tutorial!**
 - [**Redux Fundamentals, Part 8: Modern Redux with Redux Toolkit**](../tutorials/fundamentals/part-8-modern-redux.md), which shows how to convert the low-level examples from earlier sections into modern Redux Toolkit equivalents
-- [**The "Redux Essentials" tutorial**](../tutorials/essentials/part-1-overview-concepts.md), which teaches "how to use Redux, the right way" with Redux Toolkit for real-world apps,
 
 :::

docs/tutorials/fundamentals/part-1-overview.md

@@ -7,6 +7,9 @@ description: 'The official Fundamentals tutorial for Redux: learn the fundamenta
 
 import { DetailedExplanation } from '../../components/DetailedExplanation'
 
+<!-- prettier-ignore -->
+import FundamentalsWarning from "../../components/_FundamentalsWarning.mdx";
+
 # Redux Fundamentals, Part 1: Redux Overview
 
 :::tip What You'll Learn
@@ -28,23 +31,10 @@ Starting in [Part 3: State, Actions, and Reducers](./part-3-state-actions-reduce
 
 **This tutorial will teach you "how Redux works"**, as well as _why_ these patterns exist.
 
-:::tip
-
-Note that **this tutorial intentionally shows older-style patterns that require more code than the "modern Redux" patterns we teach as the right approach for building apps with Redux today**, in order to explain the principles and concepts behind Redux. **The initial code will be less concise than the way we suggest writing real app code**, but writing it out long-hand is the best way to learn.
-
-:::
+<FundamentalsWarning />
 
 Once you understand how everything fits together, we'll look at using Redux Toolkit to simplify things. **Redux Toolkit is the recommended way to build production apps with Redux**, and is built on all of the concepts that we will look at throughout this tutorial. Once you understand the core concepts covered here, you'll understand how to use Redux Toolkit more efficiently.
 
-:::info
-
-If you're looking to learn more about how Redux is used to write real-world applications, please see:
-
-- [**The "Modern Redux" page in this tutorial**](./part-8-modern-redux.md), which shows how to convert the low-level examples from earlier sections into the modern patterns we do recommend for real-world usage
-- [**The "Redux Essentials" tutorial**](../essentials/part-1-overview-concepts.md), which teaches "how to use Redux, the right way" for real-world apps, using our latest recommended patterns and practices.
-
-:::
-
 We've tried to keep these explanations beginner-friendly, but we do need to make some assumptions about what you know already so that we can focus on explaining Redux itself. **This tutorial assumes that you know**:
 
 :::important Prerequisites

docs/tutorials/fundamentals/part-5-ui-and-react.md

@@ -22,6 +22,16 @@ In [Part 4: Store](./part-4-store.md), we saw how to create a Redux store, dispa
 
 In this section, we'll add a User Interface for our todo app. We'll see how Redux works with a UI layer overall, and we'll specifically cover how Redux works together with React.
 
+:::caution
+
+Note that **this page and all of the "Essentials" tutorial teach using [our modern React-Redux hooks API](https://react-redux.js.org/api/hooks)**. The old-style [`connect` API](https://react-redux.js.org/api/connect) still works, but today we want all Redux users using the hooks API.
+
+Also, the other pages in this tutorial intentionally show older-style Redux logic patterns that require more code than the "modern Redux" patterns with Redux Toolkit we teach as the right approach for building apps with Redux today, in order to explain the principles and concepts behind Redux.
+
+See [**the "Redux Essentials" tutorial**](../tutorials/essentials/part-1-overview-concepts.md) for full examples of "how to use Redux, the right way" with Redux Toolkit and React-Redux hooks for real-world apps.
+
+:::
+
 ## Integrating Redux with a UI
 
 Redux is a standalone JS library. As we've already seen, you can create and use a Redux store even if you don't have a user interface set up. This also means that **you can use Redux with any UI framework** (or even without _any_ UI framework), and use it on both client and server. You can write Redux apps with React, Vue, Angular, Ember, jQuery, or vanilla JavaScript.