Add content directories for react roadmap

2 years ago · 7ab66a3605
parent 15306862cb
commit 7ab66a3605
68 changed files with 192 additions and 73 deletions
--- a/content/roadmaps.json
+++ b/content/roadmaps.json
@ -177,7 +177,6 @@
    "isTextHeavy": false,
    "isCommunity": false,
    "featured": true,
-    "landingPath": "/roadmaps/103-react/landscape.md",
    "resourcesPath": "/roadmaps/103-react/resources.md",
    "jsonUrl": "/project/react.json",
    "versions": [
@ -190,6 +189,7 @@
      "url": "https://twitter.com/kamranahmedse"
    },
    "pdfUrl": "/pdfs/react.pdf",
+    "contentPathsFilePath": "/roadmaps/103-react/content-paths.json",
    "id": "react",
    "metaPath": "/roadmaps/103-react/meta.json",
    "isUpcoming": false
--- a/content/roadmaps/103-react/content-paths.json
+++ b/content/roadmaps/103-react/content-paths.json
@ -0,0 +1,64 @@
+{
+  "home": "/roadmaps/103-react/content/readme.md",
+  "react-advanced-topics": "/roadmaps/103-react/content/101-react-advanced-topics/readme.md",
+  "react-advanced-topics:hooks": "/roadmaps/103-react/content/101-react-advanced-topics/100-hooks/readme.md",
+  "react-advanced-topics:hooks:common-hooks": "/roadmaps/103-react/content/101-react-advanced-topics/100-hooks/102-common-hooks.md",
+  "react-advanced-topics:hooks:writing-your-own-hooks": "/roadmaps/103-react/content/101-react-advanced-topics/100-hooks/101-writing-your-own-hooks.md",
+  "react-advanced-topics:context": "/roadmaps/103-react/content/101-react-advanced-topics/101-context.md",
+  "react-advanced-topics:refs": "/roadmaps/103-react/content/101-react-advanced-topics/102-refs.md",
+  "react-advanced-topics:render-props": "/roadmaps/103-react/content/101-react-advanced-topics/103-render-props.md",
+  "react-advanced-topics:high-order-components": "/roadmaps/103-react/content/101-react-advanced-topics/104-high-order-components.md",
+  "react-advanced-topics:portals": "/roadmaps/103-react/content/101-react-advanced-topics/105-portals.md",
+  "react-advanced-topics:error-boundaries": "/roadmaps/103-react/content/101-react-advanced-topics/106-error-boundaries.md",
+  "react-advanced-topics:fiber-architecture": "/roadmaps/103-react/content/101-react-advanced-topics/107-fiber-architecture.md",
+  "react-fundamental-topics": "/roadmaps/103-react/content/100-react-fundamental-topics/readme.md",
+  "react-fundamental-topics:create-react-app": "/roadmaps/103-react/content/100-react-fundamental-topics/100-create-react-app.md",
+  "react-fundamental-topics:jsx": "/roadmaps/103-react/content/100-react-fundamental-topics/101-jsx.md",
+  "react-fundamental-topics:components": "/roadmaps/103-react/content/100-react-fundamental-topics/102-components/readme.md",
+  "react-fundamental-topics:components:functional-components": "/roadmaps/103-react/content/100-react-fundamental-topics/102-components/100-functional-components.md",
+  "react-fundamental-topics:components:class-components": "/roadmaps/103-react/content/100-react-fundamental-topics/102-components/101-class-components.md",
+  "react-fundamental-topics:props-vs-state": "/roadmaps/103-react/content/100-react-fundamental-topics/103-props-vs-state.md",
+  "react-fundamental-topics:conditional-rendering": "/roadmaps/103-react/content/100-react-fundamental-topics/104-conditional-rendering.md",
+  "react-fundamental-topics:component-life-cycle": "/roadmaps/103-react/content/100-react-fundamental-topics/105-component-life-cycle.md",
+  "react-fundamental-topics:lists-and-keys": "/roadmaps/103-react/content/100-react-fundamental-topics/106-lists-and-keys.md",
+  "react-fundamental-topics:composition-vs-inheritance": "/roadmaps/103-react/content/100-react-fundamental-topics/107-composition-vs-inheritance.md",
+  "react-fundamental-topics:basic-hooks": "/roadmaps/103-react/content/100-react-fundamental-topics/108-basic-hooks/readme.md",
+  "react-fundamental-topics:basic-hooks:use-state": "/roadmaps/103-react/content/100-react-fundamental-topics/108-basic-hooks/100-use-state.md",
+  "react-fundamental-topics:basic-hooks:use-effect": "/roadmaps/103-react/content/100-react-fundamental-topics/108-basic-hooks/101-use-effect.md",
+  "react-ecosystem": "/roadmaps/103-react/content/102-react-ecosystem/readme.md",
+  "react-ecosystem:routers": "/roadmaps/103-react/content/102-react-ecosystem/100-routers/readme.md",
+  "react-ecosystem:routers:react-router": "/roadmaps/103-react/content/102-react-ecosystem/100-routers/100-react-router.md",
+  "react-ecosystem:routers:reach-router": "/roadmaps/103-react/content/102-react-ecosystem/100-routers/101-reach-router.md",
+  "react-ecosystem:ssr": "/roadmaps/103-react/content/102-react-ecosystem/101-ssr/readme.md",
+  "react-ecosystem:ssr:next-js": "/roadmaps/103-react/content/102-react-ecosystem/101-ssr/100-next-js.md",
+  "react-ecosystem:ssg": "/roadmaps/103-react/content/102-react-ecosystem/102-ssg/readme.md",
+  "react-ecosystem:ssg:gatsby": "/roadmaps/103-react/content/102-react-ecosystem/102-ssg/101-gatsby.md",
+  "react-ecosystem:api-calls": "/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/readme.md",
+  "react-ecosystem:api-calls:react-query": "/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/100-react-query.md",
+  "react-ecosystem:api-calls:use-http": "/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/101-use-http.md",
+  "react-ecosystem:api-calls:apollo": "/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/102-apollo.md",
+  "react-ecosystem:api-calls:relay-modern": "/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/103-relay-modern.md",
+  "react-ecosystem:api-calls:axios": "/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/104-axios.md",
+  "react-ecosystem:api-calls:unfetch": "/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/105-unfetch.md",
+  "react-ecosystem:api-calls:superagent": "/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/106-superagent.md",
+  "react-ecosystem:mobile": "/roadmaps/103-react/content/102-react-ecosystem/104-mobile/readme.md",
+  "react-ecosystem:mobile:react-native": "/roadmaps/103-react/content/102-react-ecosystem/104-mobile/100-react-native.md",
+  "react-ecosystem:forms": "/roadmaps/103-react/content/102-react-ecosystem/105-forms/readme.md",
+  "react-ecosystem:forms:react-hook-form": "/roadmaps/103-react/content/102-react-ecosystem/105-forms/100-react-hook-form.md",
+  "react-ecosystem:forms:formik": "/roadmaps/103-react/content/102-react-ecosystem/105-forms/101-formik.md",
+  "react-ecosystem:forms:final-form": "/roadmaps/103-react/content/102-react-ecosystem/105-forms/102-final-form.md",
+  "react-ecosystem:testing": "/roadmaps/103-react/content/102-react-ecosystem/106-testing/readme.md",
+  "react-ecosystem:testing:jest": "/roadmaps/103-react/content/102-react-ecosystem/106-testing/100-jest.md",
+  "react-ecosystem:testing:react-testing-library": "/roadmaps/103-react/content/102-react-ecosystem/106-testing/101-react-testing-library.md",
+  "react-ecosystem:testing:cypress": "/roadmaps/103-react/content/102-react-ecosystem/106-testing/102-cypress.md",
+  "react-ecosystem:state-management": "/roadmaps/103-react/content/102-react-ecosystem/107-state-management/readme.md",
+  "react-ecosystem:state-management:conext-state": "/roadmaps/103-react/content/102-react-ecosystem/107-state-management/100-conext-state.md",
+  "react-ecosystem:state-management:redux": "/roadmaps/103-react/content/102-react-ecosystem/107-state-management/101-redux.md",
+  "react-ecosystem:state-management:mobx": "/roadmaps/103-react/content/102-react-ecosystem/107-state-management/102-mobx.md",
+  "react-ecosystem:styling": "/roadmaps/103-react/content/102-react-ecosystem/108-styling/readme.md",
+  "react-ecosystem:styling:chakra-ui": "/roadmaps/103-react/content/102-react-ecosystem/108-styling/100-chakra-ui.md",
+  "react-ecosystem:styling:material-ui": "/roadmaps/103-react/content/102-react-ecosystem/108-styling/101-material-ui.md",
+  "react-ecosystem:styling:ant-design": "/roadmaps/103-react/content/102-react-ecosystem/108-styling/102-ant-design.md",
+  "react-ecosystem:styling:styled-components": "/roadmaps/103-react/content/102-react-ecosystem/108-styling/103-styled-components.md",
+  "react-ecosystem:styling:emotion": "/roadmaps/103-react/content/102-react-ecosystem/108-styling/104-emotion.md"
+}
--- a/content/roadmaps/103-react/content/100-react-fundamental-topics/100-create-react-app.md
+++ b/content/roadmaps/103-react/content/100-react-fundamental-topics/100-create-react-app.md
@ -0,0 +1 @@
+# Create react app
--- a/content/roadmaps/103-react/content/100-react-fundamental-topics/101-jsx.md
+++ b/content/roadmaps/103-react/content/100-react-fundamental-topics/101-jsx.md
@ -0,0 +1 @@
+# Jsx
--- a/content/roadmaps/103-react/content/100-react-fundamental-topics/102-components/100-functional-components.md
+++ b/content/roadmaps/103-react/content/100-react-fundamental-topics/102-components/100-functional-components.md
@ -0,0 +1 @@
+# Functional components
--- a/content/roadmaps/103-react/content/100-react-fundamental-topics/102-components/101-class-components.md
+++ b/content/roadmaps/103-react/content/100-react-fundamental-topics/102-components/101-class-components.md
@ -0,0 +1 @@
+# Class components
--- a/content/roadmaps/103-react/content/100-react-fundamental-topics/102-components/readme.md
+++ b/content/roadmaps/103-react/content/100-react-fundamental-topics/102-components/readme.md
@ -0,0 +1 @@
+# Components
--- a/content/roadmaps/103-react/content/100-react-fundamental-topics/103-props-vs-state.md
+++ b/content/roadmaps/103-react/content/100-react-fundamental-topics/103-props-vs-state.md
@ -0,0 +1 @@
+# Props vs state
--- a/content/roadmaps/103-react/content/100-react-fundamental-topics/104-conditional-rendering.md
+++ b/content/roadmaps/103-react/content/100-react-fundamental-topics/104-conditional-rendering.md
@ -0,0 +1 @@
+# Conditional rendering
--- a/content/roadmaps/103-react/content/100-react-fundamental-topics/105-component-life-cycle.md
+++ b/content/roadmaps/103-react/content/100-react-fundamental-topics/105-component-life-cycle.md
@ -0,0 +1 @@
+# Component life cycle
--- a/content/roadmaps/103-react/content/100-react-fundamental-topics/106-lists-and-keys.md
+++ b/content/roadmaps/103-react/content/100-react-fundamental-topics/106-lists-and-keys.md
@ -0,0 +1 @@
+# Lists and keys
--- a/content/roadmaps/103-react/content/100-react-fundamental-topics/107-composition-vs-inheritance.md
+++ b/content/roadmaps/103-react/content/100-react-fundamental-topics/107-composition-vs-inheritance.md
@ -0,0 +1 @@
+# Composition vs inheritance
--- a/content/roadmaps/103-react/content/100-react-fundamental-topics/108-basic-hooks/100-use-state.md
+++ b/content/roadmaps/103-react/content/100-react-fundamental-topics/108-basic-hooks/100-use-state.md
@ -0,0 +1 @@
+# Use state
--- a/content/roadmaps/103-react/content/100-react-fundamental-topics/108-basic-hooks/101-use-effect.md
+++ b/content/roadmaps/103-react/content/100-react-fundamental-topics/108-basic-hooks/101-use-effect.md
@ -0,0 +1 @@
+# Use effect
--- a/content/roadmaps/103-react/content/100-react-fundamental-topics/108-basic-hooks/readme.md
+++ b/content/roadmaps/103-react/content/100-react-fundamental-topics/108-basic-hooks/readme.md
@ -0,0 +1 @@
+# Basic hooks
--- a/content/roadmaps/103-react/content/100-react-fundamental-topics/readme.md
+++ b/content/roadmaps/103-react/content/100-react-fundamental-topics/readme.md
@ -0,0 +1 @@
+# React fundamental topics
--- a/content/roadmaps/103-react/content/101-react-advanced-topics/100-hooks/101-writing-your-own-hooks.md
+++ b/content/roadmaps/103-react/content/101-react-advanced-topics/100-hooks/101-writing-your-own-hooks.md
@ -0,0 +1 @@
+# Writing your own hooks
--- a/content/roadmaps/103-react/content/101-react-advanced-topics/100-hooks/102-common-hooks.md
+++ b/content/roadmaps/103-react/content/101-react-advanced-topics/100-hooks/102-common-hooks.md
@ -0,0 +1 @@
+# Common hooks
--- a/content/roadmaps/103-react/content/101-react-advanced-topics/100-hooks/readme.md
+++ b/content/roadmaps/103-react/content/101-react-advanced-topics/100-hooks/readme.md
@ -0,0 +1 @@
+# Hooks
--- a/content/roadmaps/103-react/content/101-react-advanced-topics/101-context.md
+++ b/content/roadmaps/103-react/content/101-react-advanced-topics/101-context.md
@ -0,0 +1 @@
+# Context
--- a/content/roadmaps/103-react/content/101-react-advanced-topics/102-refs.md
+++ b/content/roadmaps/103-react/content/101-react-advanced-topics/102-refs.md
@ -0,0 +1 @@
+# Refs
--- a/content/roadmaps/103-react/content/101-react-advanced-topics/103-render-props.md
+++ b/content/roadmaps/103-react/content/101-react-advanced-topics/103-render-props.md
@ -0,0 +1 @@
+# Render props
--- a/content/roadmaps/103-react/content/101-react-advanced-topics/104-high-order-components.md
+++ b/content/roadmaps/103-react/content/101-react-advanced-topics/104-high-order-components.md
@ -0,0 +1 @@
+# High order components
--- a/content/roadmaps/103-react/content/101-react-advanced-topics/105-portals.md
+++ b/content/roadmaps/103-react/content/101-react-advanced-topics/105-portals.md
@ -0,0 +1 @@
+# Portals
--- a/content/roadmaps/103-react/content/101-react-advanced-topics/106-error-boundaries.md
+++ b/content/roadmaps/103-react/content/101-react-advanced-topics/106-error-boundaries.md
@ -0,0 +1 @@
+# Error boundaries
--- a/content/roadmaps/103-react/content/101-react-advanced-topics/107-fiber-architecture.md
+++ b/content/roadmaps/103-react/content/101-react-advanced-topics/107-fiber-architecture.md
@ -0,0 +1 @@
+# Fiber architecture
--- a/content/roadmaps/103-react/content/101-react-advanced-topics/readme.md
+++ b/content/roadmaps/103-react/content/101-react-advanced-topics/readme.md
@ -0,0 +1 @@
+# React advanced topics
--- a/content/roadmaps/103-react/content/102-react-ecosystem/100-routers/100-react-router.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/100-routers/100-react-router.md
@ -0,0 +1 @@
+# React router
--- a/content/roadmaps/103-react/content/102-react-ecosystem/100-routers/101-reach-router.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/100-routers/101-reach-router.md
@ -0,0 +1 @@
+# Reach router
--- a/content/roadmaps/103-react/content/102-react-ecosystem/100-routers/readme.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/100-routers/readme.md
@ -0,0 +1 @@
+# Routers
--- a/content/roadmaps/103-react/content/102-react-ecosystem/101-ssr/100-next-js.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/101-ssr/100-next-js.md
@ -0,0 +1 @@
+# Next js
--- a/content/roadmaps/103-react/content/102-react-ecosystem/101-ssr/readme.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/101-ssr/readme.md
@ -0,0 +1 @@
+# Ssr
--- a/content/roadmaps/103-react/content/102-react-ecosystem/102-ssg/101-gatsby.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/102-ssg/101-gatsby.md
@ -0,0 +1 @@
+# Gatsby
--- a/content/roadmaps/103-react/content/102-react-ecosystem/102-ssg/readme.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/102-ssg/readme.md
@ -0,0 +1 @@
+# Ssg
--- a/content/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/100-react-query.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/100-react-query.md
@ -0,0 +1 @@
+# React query
--- a/content/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/101-use-http.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/101-use-http.md
@ -0,0 +1 @@
+# Use http
--- a/content/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/102-apollo.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/102-apollo.md
@ -0,0 +1 @@
+# Apollo
--- a/content/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/103-relay-modern.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/103-relay-modern.md
@ -0,0 +1 @@
+# Relay modern
--- a/content/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/104-axios.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/104-axios.md
@ -0,0 +1 @@
+# Axios
--- a/content/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/105-unfetch.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/105-unfetch.md
@ -0,0 +1 @@
+# Unfetch
--- a/content/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/106-superagent.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/106-superagent.md
@ -0,0 +1 @@
+# Superagent
--- a/content/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/readme.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/103-api-calls/readme.md
@ -0,0 +1 @@
+# Api calls
--- a/content/roadmaps/103-react/content/102-react-ecosystem/104-mobile/100-react-native.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/104-mobile/100-react-native.md
@ -0,0 +1 @@
+# React native
--- a/content/roadmaps/103-react/content/102-react-ecosystem/104-mobile/readme.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/104-mobile/readme.md
@ -0,0 +1 @@
+# Mobile
--- a/content/roadmaps/103-react/content/102-react-ecosystem/105-forms/100-react-hook-form.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/105-forms/100-react-hook-form.md
@ -0,0 +1 @@
+# React hook form
--- a/content/roadmaps/103-react/content/102-react-ecosystem/105-forms/101-formik.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/105-forms/101-formik.md
@ -0,0 +1 @@
+# Formik
--- a/content/roadmaps/103-react/content/102-react-ecosystem/105-forms/102-final-form.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/105-forms/102-final-form.md
@ -0,0 +1 @@
+# Final form
--- a/content/roadmaps/103-react/content/102-react-ecosystem/105-forms/readme.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/105-forms/readme.md
@ -0,0 +1 @@
+# Forms
--- a/content/roadmaps/103-react/content/102-react-ecosystem/106-testing/100-jest.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/106-testing/100-jest.md
@ -0,0 +1 @@
+# Jest
--- a/content/roadmaps/103-react/content/102-react-ecosystem/106-testing/101-react-testing-library.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/106-testing/101-react-testing-library.md
@ -0,0 +1 @@
+# React testing library
--- a/content/roadmaps/103-react/content/102-react-ecosystem/106-testing/102-cypress.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/106-testing/102-cypress.md
@ -0,0 +1 @@
+# Cypress
--- a/content/roadmaps/103-react/content/102-react-ecosystem/106-testing/readme.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/106-testing/readme.md
@ -0,0 +1 @@
+# Testing
--- a/content/roadmaps/103-react/content/102-react-ecosystem/107-state-management/100-conext-state.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/107-state-management/100-conext-state.md
@ -0,0 +1 @@
+# Conext state
--- a/content/roadmaps/103-react/content/102-react-ecosystem/107-state-management/101-redux.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/107-state-management/101-redux.md
@ -0,0 +1 @@
+# Redux
--- a/content/roadmaps/103-react/content/102-react-ecosystem/107-state-management/102-mobx.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/107-state-management/102-mobx.md
@ -0,0 +1 @@
+# Mobx
--- a/content/roadmaps/103-react/content/102-react-ecosystem/107-state-management/readme.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/107-state-management/readme.md
@ -0,0 +1 @@
+# State management
--- a/content/roadmaps/103-react/content/102-react-ecosystem/108-styling/100-chakra-ui.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/108-styling/100-chakra-ui.md
@ -0,0 +1 @@
+# Chakra ui
--- a/content/roadmaps/103-react/content/102-react-ecosystem/108-styling/101-material-ui.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/108-styling/101-material-ui.md
@ -0,0 +1 @@
+# Material ui
--- a/content/roadmaps/103-react/content/102-react-ecosystem/108-styling/102-ant-design.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/108-styling/102-ant-design.md
@ -0,0 +1 @@
+# Ant design
--- a/content/roadmaps/103-react/content/102-react-ecosystem/108-styling/103-styled-components.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/108-styling/103-styled-components.md
@ -0,0 +1 @@
+# Styled components
--- a/content/roadmaps/103-react/content/102-react-ecosystem/108-styling/104-emotion.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/108-styling/104-emotion.md
@ -0,0 +1 @@
+# Emotion
--- a/content/roadmaps/103-react/content/102-react-ecosystem/108-styling/readme.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/108-styling/readme.md
@ -0,0 +1 @@
+# Styling
--- a/content/roadmaps/103-react/content/102-react-ecosystem/readme.md
+++ b/content/roadmaps/103-react/content/102-react-ecosystem/readme.md
@ -0,0 +1 @@
+# React ecosystem
--- a/content/roadmaps/103-react/content/readme.md
+++ b/content/roadmaps/103-react/content/readme.md
@ -0,0 +1 @@
+# 
--- a/content/roadmaps/103-react/landscape.md
+++ b/content/roadmaps/103-react/landscape.md
@ -1,7 +0,0 @@
-The intent of this guide is to give you an idea about the React ecosystem and to help guide your learning if you are confused. We have another [roadmap on the Frontend Development](/frontend) that focuses on the frontend development if you are interested in that.
-
-Also, please note that the list below is exhaustive, and the items are listed in no particular order. You don't need to learn everything listed in the picture, however knowing what you don't know is as important as knowing things.
-
-![](/roadmaps/react.png)
-
-Please note that the list is opinionated, and you might have different opinions than those of the author. Having said that, [we would love to hear your opinions](https://github.com/kamranahmedse/developer-roadmap/issues/new) and incorporate them in the picture if suitable.
--- a/content/roadmaps/103-react/meta.json
+++ b/content/roadmaps/103-react/meta.json
@ -26,7 +26,6 @@
  "isTextHeavy": false,
  "isCommunity": false,
  "featured": true,
-  "landingPath": "./landscape.md",
  "resourcesPath": "./resources.md",
  "jsonUrl": "/project/react.json",
  "versions": [
@ -38,5 +37,6 @@
    "name": "Kamran Ahmed",
    "url": "https://twitter.com/kamranahmedse"
  },
-  "pdfUrl": "/pdfs/react.pdf"
+  "pdfUrl": "/pdfs/react.pdf",
+  "contentPathsFilePath": "./content-paths.json"
 }
--- a/public/project/react.json
+++ b/public/project/react.json
@ -2012,7 +2012,7 @@
          "x": "75",
          "y": "620",
          "properties": {
-            "controlName": "102-advanced-topics:hooks:common-hooks"
+            "controlName": "102-react-advanced-topics:hooks:common-hooks"
          },
          "children": {
            "controls": {
@ -2446,7 +2446,7 @@
          "x": "562",
          "y": "394",
          "properties": {
-            "controlName": "100-fundamental-topics"
+            "controlName": "100-react-fundamental-topics"
          },
          "children": {
            "controls": {
@ -2493,7 +2493,7 @@
          "x": "578",
          "y": "609",
          "properties": {
-            "controlName": "101-advanced-topics"
+            "controlName": "101-react-advanced-topics"
          },
          "children": {
            "controls": {
@ -2540,7 +2540,7 @@
          "x": "534",
          "y": "912",
          "properties": {
-            "controlName": "102-ecosystem"
+            "controlName": "102-react-ecosystem"
          },
          "children": {
            "controls": {
@ -2587,7 +2587,7 @@
          "x": "268",
          "y": "315",
          "properties": {
-            "controlName": "100-fundamental-topics:create-react-app"
+            "controlName": "100-react-fundamental-topics:create-react-app"
          },
          "children": {
            "controls": {
@ -2634,7 +2634,7 @@
          "x": "322",
          "y": "365",
          "properties": {
-            "controlName": "101-fundamental-topics:jsx"
+            "controlName": "101-react-fundamental-topics:jsx"
          },
          "children": {
            "controls": {
@ -2681,7 +2681,7 @@
          "x": "322",
          "y": "415",
          "properties": {
-            "controlName": "102-fundamental-topics:components"
+            "controlName": "102-react-fundamental-topics:components"
          },
          "children": {
            "controls": {
@ -2728,7 +2728,7 @@
          "x": "322",
          "y": "467",
          "properties": {
-            "controlName": "103-fundamental-topics:props-vs-state"
+            "controlName": "103-react-fundamental-topics:props-vs-state"
          },
          "children": {
            "controls": {
@ -2775,7 +2775,7 @@
          "x": "268",
          "y": "517",
          "properties": {
-            "controlName": "104-fundamental-topics:conditional-rendering"
+            "controlName": "104-react-fundamental-topics:conditional-rendering"
          },
          "children": {
            "controls": {
@ -2822,7 +2822,7 @@
          "x": "932",
          "y": "333",
          "properties": {
-            "controlName": "105-fundamental-topics:component-life-cycle"
+            "controlName": "105-react-fundamental-topics:component-life-cycle"
          },
          "children": {
            "controls": {
@ -2869,7 +2869,7 @@
          "x": "932",
          "y": "384",
          "properties": {
-            "controlName": "106-fundamental-topics:lists-and-keys"
+            "controlName": "106-react-fundamental-topics:lists-and-keys"
          },
          "children": {
            "controls": {
@ -2916,7 +2916,7 @@
          "x": "932",
          "y": "433",
          "properties": {
-            "controlName": "107-fundamental-topics:composition-vs-inheritance"
+            "controlName": "107-react-fundamental-topics:composition-vs-inheritance"
          },
          "children": {
            "controls": {
@ -2963,7 +2963,7 @@
          "x": "933",
          "y": "483",
          "properties": {
-            "controlName": "108-fundamental-topics:basic-hooks"
+            "controlName": "108-react-fundamental-topics:basic-hooks"
          },
          "children": {
            "controls": {
@ -3010,7 +3010,7 @@
          "x": "906",
          "y": "551",
          "properties": {
-            "controlName": "100-fundamental-topics:basic-hooks:use-state"
+            "controlName": "100-react-fundamental-topics:basic-hooks:use-state"
          },
          "children": {
            "controls": {
@ -3057,7 +3057,7 @@
          "x": "1066",
          "y": "551",
          "properties": {
-            "controlName": "101-fundamental-topics:basic-hooks:use-effect"
+            "controlName": "101-react-fundamental-topics:basic-hooks:use-effect"
          },
          "children": {
            "controls": {
@ -3104,7 +3104,7 @@
          "x": "73",
          "y": "392",
          "properties": {
-            "controlName": "100-fundamental-topics:components:functional-components"
+            "controlName": "100-react-fundamental-topics:components:functional-components"
          },
          "children": {
            "controls": {
@ -3151,7 +3151,7 @@
          "x": "73",
          "y": "442",
          "properties": {
-            "controlName": "101-fundamental-topics:components:class-components"
+            "controlName": "101-react-fundamental-topics:components:class-components"
          },
          "children": {
            "controls": {
@ -3198,7 +3198,7 @@
          "x": "351",
          "y": "590",
          "properties": {
-            "controlName": "100-advanced-topics:hooks"
+            "controlName": "100-react-advanced-topics:hooks"
          },
          "children": {
            "controls": {
@ -3245,7 +3245,7 @@
          "x": "351",
          "y": "639",
          "properties": {
-            "controlName": "101-advanced-topics:context"
+            "controlName": "101-react-advanced-topics:context"
          },
          "children": {
            "controls": {
@ -3292,7 +3292,7 @@
          "x": "351",
          "y": "689",
          "properties": {
-            "controlName": "102-advanced-topics:refs"
+            "controlName": "102-react-advanced-topics:refs"
          },
          "children": {
            "controls": {
@ -3339,7 +3339,7 @@
          "x": "351",
          "y": "739",
          "properties": {
-            "controlName": "103-advanced-topics:render-props"
+            "controlName": "103-react-advanced-topics:render-props"
          },
          "children": {
            "controls": {
@ -3386,7 +3386,7 @@
          "x": "942",
          "y": "612",
          "properties": {
-            "controlName": "104-advanced-topics:high-order-components"
+            "controlName": "104-react-advanced-topics:high-order-components"
          },
          "children": {
            "controls": {
@ -3433,7 +3433,7 @@
          "x": "942",
          "y": "662",
          "properties": {
-            "controlName": "105-advanced-topics:portals"
+            "controlName": "105-react-advanced-topics:portals"
          },
          "children": {
            "controls": {
@ -3480,7 +3480,7 @@
          "x": "942",
          "y": "711",
          "properties": {
-            "controlName": "106-advanced-topics:error-boundaries"
+            "controlName": "106-react-advanced-topics:error-boundaries"
          },
          "children": {
            "controls": {
@ -3527,7 +3527,7 @@
          "x": "942",
          "y": "760",
          "properties": {
-            "controlName": "107-advanced-topics:fiber-architecture"
+            "controlName": "107-react-advanced-topics:fiber-architecture"
          },
          "children": {
            "controls": {
@ -3574,7 +3574,7 @@
          "x": "75",
          "y": "569",
          "properties": {
-            "controlName": "101-advanced-topics:hooks:writing-your-own-hooks"
+            "controlName": "101-react-advanced-topics:hooks:writing-your-own-hooks"
          },
          "children": {
            "controls": {
@ -3621,7 +3621,7 @@
          "x": "335",
          "y": "911",
          "properties": {
-            "controlName": "100-ecosystem:routers"
+            "controlName": "100-react-ecosystem:routers"
          },
          "children": {
            "controls": {
@ -3668,7 +3668,7 @@
          "x": "334",
          "y": "963",
          "properties": {
-            "controlName": "101-ecosystem:ssr"
+            "controlName": "101-react-ecosystem:ssr"
          },
          "children": {
            "controls": {
@ -3715,7 +3715,7 @@
          "x": "334",
          "y": "1014",
          "properties": {
-            "controlName": "102-ecosystem:ssg"
+            "controlName": "102-react-ecosystem:ssg"
          },
          "children": {
            "controls": {
@ -3762,7 +3762,7 @@
          "x": "335",
          "y": "1157",
          "properties": {
-            "controlName": "103-ecosystem:api-calls"
+            "controlName": "103-react-ecosystem:api-calls"
          },
          "children": {
            "controls": {
@ -3809,7 +3809,7 @@
          "x": "334",
          "y": "1374",
          "properties": {
-            "controlName": "104-ecosystem:mobile"
+            "controlName": "104-react-ecosystem:mobile"
          },
          "children": {
            "controls": {
@ -3856,7 +3856,7 @@
          "x": "780",
          "y": "867",
          "properties": {
-            "controlName": "105-ecosystem:forms"
+            "controlName": "105-react-ecosystem:forms"
          },
          "children": {
            "controls": {
@ -3903,7 +3903,7 @@
          "x": "780",
          "y": "945",
          "properties": {
-            "controlName": "106-ecosystem:testing"
+            "controlName": "106-react-ecosystem:testing"
          },
          "children": {
            "controls": {
@ -3950,7 +3950,7 @@
          "x": "787",
          "y": "1034",
          "properties": {
-            "controlName": "107-ecosystem:state-management"
+            "controlName": "107-react-ecosystem:state-management"
          },
          "children": {
            "controls": {
@ -3997,7 +3997,7 @@
          "x": "843",
          "y": "1277",
          "properties": {
-            "controlName": "108-ecosystem:styling"
+            "controlName": "108-react-ecosystem:styling"
          },
          "children": {
            "controls": {
@ -4044,7 +4044,7 @@
          "x": "109",
          "y": "877",
          "properties": {
-            "controlName": "100-ecosystem:routers:react-router"
+            "controlName": "100-react-ecosystem:routers:react-router"
          },
          "children": {
            "controls": {
@ -4091,7 +4091,7 @@
          "x": "109",
          "y": "927",
          "properties": {
-            "controlName": "101-ecosystem:routers:reach-router"
+            "controlName": "101-react-ecosystem:routers:reach-router"
          },
          "children": {
            "controls": {
@ -4138,7 +4138,7 @@
          "x": "107",
          "y": "984",
          "properties": {
-            "controlName": "100-ecosystem:ssr:next-js"
+            "controlName": "100-react-ecosystem:ssr:next-js"
          },
          "children": {
            "controls": {
@ -4185,7 +4185,7 @@
          "x": "107",
          "y": "1033",
          "properties": {
-            "controlName": "101-ecosystem:ssg:gatsby"
+            "controlName": "101-react-ecosystem:ssg:gatsby"
          },
          "children": {
            "controls": {
@ -4232,7 +4232,7 @@
          "x": "334",
          "y": "1082",
          "properties": {
-            "controlName": "100-ecosystem:api-calls:react-query"
+            "controlName": "100-react-ecosystem:api-calls:react-query"
          },
          "children": {
            "controls": {
@ -4279,7 +4279,7 @@
          "x": "335",
          "y": "1240",
          "properties": {
-            "controlName": "101-ecosystem:api-calls:use-http"
+            "controlName": "101-react-ecosystem:api-calls:use-http"
          },
          "children": {
            "controls": {
@ -4326,7 +4326,7 @@
          "x": "109",
          "y": "1093",
          "properties": {
-            "controlName": "102-ecosystem:api-calls:apollo"
+            "controlName": "102-react-ecosystem:api-calls:apollo"
          },
          "children": {
            "controls": {
@ -4373,7 +4373,7 @@
          "x": "109",
          "y": "1141",
          "properties": {
-            "controlName": "103-ecosystem:api-calls:relay-modern"
+            "controlName": "103-react-ecosystem:api-calls:relay-modern"
          },
          "children": {
            "controls": {
@ -4420,7 +4420,7 @@
          "x": "110",
          "y": "1219",
          "properties": {
-            "controlName": "104-ecosystem:api-calls:axios"
+            "controlName": "104-react-ecosystem:api-calls:axios"
          },
          "children": {
            "controls": {
@ -4467,7 +4467,7 @@
          "x": "109",
          "y": "1269",
          "properties": {
-            "controlName": "105-ecosystem:api-calls:unfetch"
+            "controlName": "105-react-ecosystem:api-calls:unfetch"
          },
          "children": {
            "controls": {
@ -4514,7 +4514,7 @@
          "x": "109",
          "y": "1318",
          "properties": {
-            "controlName": "106-ecosystem:api-calls:superagent"
+            "controlName": "106-react-ecosystem:api-calls:superagent"
          },
          "children": {
            "controls": {
@ -4561,7 +4561,7 @@
          "x": "126",
          "y": "1374",
          "properties": {
-            "controlName": "100-ecosystem:mobile:react-native"
+            "controlName": "100-react-ecosystem:mobile:react-native"
          },
          "children": {
            "controls": {
@ -4608,7 +4608,7 @@
          "x": "1029",
          "y": "819",
          "properties": {
-            "controlName": "100-ecosystem:forms:react-hook-form"
+            "controlName": "100-react-ecosystem:forms:react-hook-form"
          },
          "children": {
            "controls": {
@ -4655,7 +4655,7 @@
          "x": "1029",
          "y": "867",
          "properties": {
-            "controlName": "101-ecosystem:forms:formik"
+            "controlName": "101-react-ecosystem:forms:formik"
          },
          "children": {
            "controls": {
@ -4702,7 +4702,7 @@
          "x": "1029",
          "y": "915",
          "properties": {
-            "controlName": "102-ecosystem:forms:final-form"
+            "controlName": "102-react-ecosystem:forms:final-form"
          },
          "children": {
            "controls": {
@ -4749,7 +4749,7 @@
          "x": "1029",
          "y": "974",
          "properties": {
-            "controlName": "100-ecosystem:testing:jest"
+            "controlName": "100-react-ecosystem:testing:jest"
          },
          "children": {
            "controls": {
@ -4796,7 +4796,7 @@
          "x": "1029",
          "y": "1023",
          "properties": {
-            "controlName": "101-ecosystem:testing:react-testing-library"
+            "controlName": "101-react-ecosystem:testing:react-testing-library"
          },
          "children": {
            "controls": {
@ -4843,7 +4843,7 @@
          "x": "1029",
          "y": "1072",
          "properties": {
-            "controlName": "102-ecosystem:testing:cypress"
+            "controlName": "102-react-ecosystem:testing:cypress"
          },
          "children": {
            "controls": {
@ -4890,7 +4890,7 @@
          "x": "837",
          "y": "1117",
          "properties": {
-            "controlName": "100-ecosystem:state-management:conext-state"
+            "controlName": "100-react-ecosystem:state-management:conext-state"
          },
          "children": {
            "controls": {
@ -4937,7 +4937,7 @@
          "x": "837",
          "y": "1166",
          "properties": {
-            "controlName": "101-ecosystem:state-management:redux"
+            "controlName": "101-react-ecosystem:state-management:redux"
          },
          "children": {
            "controls": {
@ -4984,7 +4984,7 @@
          "x": "837",
          "y": "1214",
          "properties": {
-            "controlName": "102-ecosystem:state-management:mobx"
+            "controlName": "102-react-ecosystem:state-management:mobx"
          },
          "children": {
            "controls": {
@ -5031,7 +5031,7 @@
          "x": "1060",
          "y": "1223",
          "properties": {
-            "controlName": "100-ecosystem:styling:chakra-ui"
+            "controlName": "100-react-ecosystem:styling:chakra-ui"
          },
          "children": {
            "controls": {
@ -5078,7 +5078,7 @@
          "x": "1060",
          "y": "1272",
          "properties": {
-            "controlName": "101-ecosystem:styling:material-ui"
+            "controlName": "101-react-ecosystem:styling:material-ui"
          },
          "children": {
            "controls": {
@ -5125,7 +5125,7 @@
          "x": "1060",
          "y": "1320",
          "properties": {
-            "controlName": "102-ecosystem:styling:ant-design"
+            "controlName": "102-react-ecosystem:styling:ant-design"
          },
          "children": {
            "controls": {
@ -5172,7 +5172,7 @@
          "x": "829",
          "y": "1351",
          "properties": {
-            "controlName": "103-ecosystem:styling:styled-components"
+            "controlName": "103-react-ecosystem:styling:styled-components"
          },
          "children": {
            "controls": {
@ -5219,7 +5219,7 @@
          "x": "829",
          "y": "1400",
          "properties": {
-            "controlName": "104-ecosystem:styling:emotion"
+            "controlName": "104-react-ecosystem:styling:emotion"
          },
          "children": {
            "controls": {
--- a/public/sitemap.xml
+++ b/public/sitemap.xml
@ -21,7 +21,7 @@
 <url>
              <loc>https://roadmap.sh/react</loc>
              <changefreq>monthly</changefreq>
-              <lastmod>2022-08-04T11:37:35.834Z</lastmod>
+              <lastmod>2022-08-11T12:52:57.801Z</lastmod>
              <priority>1.0</priority>
          </url>
 <url>
@ -33,7 +33,7 @@
 <url>
              <loc>https://roadmap.sh/vue</loc>
              <changefreq>monthly</changefreq>
-              <lastmod>2022-08-08T14:56:45.396Z</lastmod>
+              <lastmod>2022-08-08T16:43:49.818Z</lastmod>
              <priority>1.0</priority>
          </url>
 <url>