Add react refs docs

content/roadmaps/103-react/content/101-react-advanced-topics/102-refs.md

@@ -1 +1,8 @@
-# Refs
+# Refs
+
+Refs provide a way to access DOM nodes or React elements created in the render method.
+
+In the typical React dataflow, props are the only way that parent components interact with their children. To modify a child, you re-render it with new props. However, there are a few cases where you need to imperatively modify a child outside of the typical dataflow. The child to be modified could be an instance of a React component, or it could be a DOM element. For both of these cases, React provides an escape hatch.
+
+<ResourceGroupTitle>Free Content</ResourceGroupTitle>
+<BadgeLink colorScheme='blue' badgeText='Official Docs' href='https://reactjs.org/docs/refs-and-the-dom.html'>Refs and DOM</BadgeLink>

content/roadmaps/103-react/content/101-react-advanced-topics/readme.md

@@ -1 +1,3 @@
-# React advanced Topics
+# Advanced Topics
+
+Now that you have covered the basics, next we have the advanced topics such as advanced hook topics, context, refs, portals, error boundaries and more.