feat: detailed roadmap preparation

components/detailed-roadmap/index.js

@@ -44,7 +44,7 @@ const DetailedRoadmap = ({ roadmap }) => {
           { sidebar[groupTitle].map(page => {
             const isActivePage = page.url === currentPage.url;
             // e.g. /frontend should mark `/frontend/summary` as active
-            const isSummaryPage = page.url === `${currentPage.url}/summary`;
+            const isSummaryPage = page.url === `${currentPage.url}/landscape`;
 
             return (
               <li className={classNames({ active: isActivePage || isSummaryPage })} key={page.url}>

content/roadmaps.json

@@ -8,7 +8,8 @@
       "url": "https://twitter.com/kamranahmedse"
     },
     "featured": true,
-    "detailed": false,
+    "path": "/roadmaps/1-frontend/0-About/0-Landscape.md",
+    "detailed": true,
     "versions": [
       "latest",
       "2018",
@@ -17,45 +18,27 @@
     "contributorsCount": 1,
     "contributorsUrl": "/frontend/contributors",
     "url": "/frontend",
-    "path": "/roadmaps/1-frontend/0-About/0-Summary.md",
     "sidebar": {
       "About": [
         {
-          "url": "/frontend/summary-detailed",
-          "title": "Summary detailed",
-          "path": "/roadmaps/1-frontend/0-About/0-Summary-detailed.md"
+          "url": "/frontend/landscape",
+          "title": "Landscape",
+          "path": "/roadmaps/1-frontend/0-About/0-Landscape.md"
         },
         {
           "url": "/frontend/summary",
           "title": "Summary",
-          "path": "/roadmaps/1-frontend/0-About/0-Summary.md"
+          "path": "/roadmaps/1-frontend/0-About/1-Summary.md"
         },
         {
-          "url": "/frontend/skill-summary",
-          "title": "Skill Summary",
-          "path": "/roadmaps/1-frontend/0-About/1-Skill-Summary.md"
+          "url": "/frontend/basic-skills",
+          "title": "Basic Skills",
+          "path": "/roadmaps/1-frontend/0-About/2-Basic-Skills.md"
         },
         {
           "url": "/frontend/job-titles",
           "title": "Job Titles",
-          "path": "/roadmaps/1-frontend/0-About/2-Job-Titles.md"
-        }
-      ],
-      "Landscape": [
-        {
-          "url": "/frontend/junior-developer",
-          "title": "Junior Developer",
-          "path": "/roadmaps/1-frontend/1-Landscape/1-Junior-Developer.md"
-        },
-        {
-          "url": "/frontend/mid-level-developer",
-          "title": "Mid Level Developer",
-          "path": "/roadmaps/1-frontend/1-Landscape/2-Mid-Level-Developer.md"
-        },
-        {
-          "url": "/frontend/senior-developer",
-          "title": "Senior Developer",
-          "path": "/roadmaps/1-frontend/1-Landscape/3-Senior-Developer.md"
+          "path": "/roadmaps/1-frontend/0-About/3-Job-Titles.md"
         }
       ],
       "Learn": [
@@ -107,6 +90,7 @@
     "description": "Step by step guide to becoming a modern backend developer",
     "featuredDescription": "Step by step guide to becoming a modern backend developer in 2020",
     "featured": true,
+    "path": "/roadmaps/2-backend/0-About/0-Summary.md",
     "author": {
       "name": "Kamran Ahmed",
       "url": "https://twitter.com/kamranahmedse"
@@ -114,7 +98,6 @@
     "contributorsCount": 1,
     "contributorsUrl": "/backend/contributors",
     "url": "/backend",
-    "path": "/roadmaps/2-backend/0-About/0-Summary.md",
     "sidebar": {
       "About": [
         {
@@ -152,6 +135,7 @@
     "description": "Step by step guide for DevOps or any other Operations Role",
     "featuredDescription": "Step by step guide to become an SRE or for any operations role in 2020",
     "featured": true,
+    "path": "/roadmaps/3-devops/0-About/0-Summary.md",
     "versions": [
       "latest",
       "2018",
@@ -164,7 +148,6 @@
     "contributorsCount": 1,
     "contributorsUrl": "/devops/contributors",
     "url": "/devops",
-    "path": "/roadmaps/3-devops/0-About/0-Summary.md",
     "sidebar": {
       "About": [
         {
@@ -196,6 +179,7 @@
     "title": "Full Stack Developer",
     "description": "Step by step guide to becoming a modern fullstack developer in 2020",
     "featuredDescription": "Step by step guide to becoming a modern fullstack developer in 2020",
+    "path": "/roadmaps/4-fullstack/0-About/0-Summary.md",
     "upcoming": true,
     "author": {
       "name": "Kamran Ahmed",
@@ -204,7 +188,6 @@
     "contributorsCount": 1,
     "contributorsUrl": "/fullstack/contributors",
     "url": "/fullstack",
-    "path": "/roadmaps/4-fullstack/0-About/0-Summary.md",
     "sidebar": {
       "About": [
         {
@@ -220,6 +203,7 @@
     "description": "Steps to follow in order to become a modern QA Engineer in 2020",
     "featuredDescription": "Step by step guide to becoming a modern QA Engineer in 2020",
     "upcoming": true,
+    "path": "/roadmaps/5-qa/0-About/0-Summary.md",
     "author": {
       "name": "Anas Fitiani",
       "url": "https://github.com/anas-qa"
@@ -227,7 +211,6 @@
     "contributorsCount": 1,
     "contributorsUrl": "/qa/contributors",
     "url": "/qa",
-    "path": "/roadmaps/5-qa/0-About/0-Summary.md",
     "sidebar": {
       "About": [
         {

content/roadmaps/1-frontend/1-Landscape/1-Junior-Developer.md

@@ -1,18 +0,0 @@
-#### Technical Skills
-The sections below describe different steps required to become a frontend developer
-
-#### Learning How Things Work
-As a web developer, frontend, backend or fullstack, you should have a good understanding of how the internet works 
-
-![](/roadmaps/frontend/beginner-1.png)
-
-Learn the below listed in the order given below
-* What is Internet and how does it work?
-* What is HTTP, how it evolved and where is it now?
-* How do the browsers work? Engines behind different browsers
-* What is DNS? How a website is found on the internet?
-* What's in a domain name? What is an IP Address?
-* What is Web Hosting?
-
-#### Writing Some Code
-Now that you understand how things work, next step is getting your hands dirty and start actual coding

content/roadmaps/1-frontend/2-Learn/1-Job-Ready.md

@@ -0,0 +1,18 @@
+#### Technical Skills
+The sections below describe different steps required to become a frontend developer
+
+#### Learning How Things Work
+As a web developer, frontend, backend or fullstack, you should have a good understanding of how the internet works 
+
+![](/roadmaps/frontend/beginner-1.png)
+
+Learn the below listed in the order given below
+* What is Internet and how does it work?
+* What is HTTP, how it evolved and where is it now?
+* How do the browsers work? Engines behind different browsers
+* What is DNS? How a website is found on the internet?
+* What's in a domain name? What is an IP Address?
+* What is Web Hosting?
+
+#### Writing Some Code
+Now that you understand how things work, next step is getting your hands dirty and start actual coding

content/roadmaps/1-frontend/meta.json

@@ -7,7 +7,8 @@
     "url": "https://twitter.com/kamranahmedse"
   },
   "featured": true,
-  "detailed": false,
+  "path": "./0-About/0-Landscape.md",
+  "detailed": true,
   "versions": [
     "latest",
     "2018",

content/roadmaps/2-backend/meta.json

@@ -3,6 +3,7 @@
   "description": "Step by step guide to becoming a modern backend developer",
   "featuredDescription": "Step by step guide to becoming a modern backend developer in 2020",
   "featured": true,
+  "path": "./0-About/0-Summary.md",
   "author": {
     "name": "Kamran Ahmed",
     "url": "https://twitter.com/kamranahmedse"

content/roadmaps/3-devops/meta.json

@@ -3,6 +3,7 @@
   "description": "Step by step guide for DevOps or any other Operations Role",
   "featuredDescription": "Step by step guide to become an SRE or for any operations role in 2020",
   "featured": true,
+  "path": "./0-About/0-Summary.md",
   "versions": [
     "latest",
     "2018",

content/roadmaps/4-fullstack/meta.json

@@ -2,6 +2,7 @@
   "title": "Full Stack Developer",
   "description": "Step by step guide to becoming a modern fullstack developer in 2020",
   "featuredDescription": "Step by step guide to becoming a modern fullstack developer in 2020",
+  "path": "./0-About/0-Summary.md",
   "upcoming": true,
   "author": {
     "name": "Kamran Ahmed",

content/roadmaps/5-qa/meta.json

@@ -3,6 +3,7 @@
   "description": "Steps to follow in order to become a modern QA Engineer in 2020",
   "featuredDescription": "Step by step guide to becoming a modern QA Engineer in 2020",
   "upcoming": true,
+  "path": "./0-About/0-Summary.md",
   "author": {
     "name": "Anas Fitiani",
     "url": "https://github.com/anas-qa"

scripts/roadmaps-meta.js

@@ -16,7 +16,7 @@ const roadmapsMeta = roadmapDirs.reduce((metaAcc, roadmapDirName) => {
 
   // We can't use the absolute path in the build e.g. ~/Users/user/where-build-is-running/content
   // So, we remove it and use the path relative to content directory
-  const summaryFilePath = path.join(roadmapDir.replace(STORAGE_PATH, ''), '/0-About/0-Summary.md');
+  const roadmapLandingFilePath = path.join(roadmapDir.replace(STORAGE_PATH, ''), roadmapMeta.path);
 
   const contributors = exec(`git log --pretty=format:"%an%x09" ${roadmapDir} | uniq`)
     .toString()
@@ -76,7 +76,7 @@ const roadmapsMeta = roadmapDirs.reduce((metaAcc, roadmapDirName) => {
       contributorsCount: contributorNames.length,
       contributorsUrl: `/${roadmapSlug}/contributors`,
       url: `/${roadmapSlug}`,
-      path: summaryFilePath,
+      path: roadmapLandingFilePath,
       sidebar,
     },
   ];