From f956ecd7b03d70760f613c5eab392fff58f81c7e Mon Sep 17 00:00:00 2001 From: Kamran Ahmed Date: Wed, 5 Oct 2022 18:47:51 +0400 Subject: [PATCH] Fix blurriness of react roadmap --- public/project/react.json | 2501 ++++++++++++++++++------------------- 1 file changed, 1250 insertions(+), 1251 deletions(-) diff --git a/public/project/react.json b/public/project/react.json index 753e64bee..30953cd71 100644 --- a/public/project/react.json +++ b/public/project/react.json @@ -3,15 +3,15 @@ "controls": { "control": [ { - "ID": "2609", + "ID": "9050", "typeID": "Arrow", "zOrder": "0", "w": "24", "h": "77", "measuredW": "150", "measuredH": "100", - "x": "618", - "y": "183", + "x": "628", + "y": "193", "properties": { "curvature": "0", "leftArrow": "false", @@ -32,27 +32,27 @@ } }, { - "ID": "2610", + "ID": "9051", "typeID": "Label", "zOrder": "1", "measuredW": "76", "measuredH": "36", - "x": "647", - "y": "267", + "x": "657", + "y": "277", "properties": { "size": "28", "text": "React" } }, { - "ID": "2611", + "ID": "9052", "typeID": "Arrow", "zOrder": "2", "w": "27", "measuredW": "150", "measuredH": "100", - "x": "638", - "y": "27", + "x": "648", + "y": "37", "properties": { "curvature": "0", "leftArrow": "false", @@ -74,15 +74,15 @@ } }, { - "ID": "2612", + "ID": "9053", "typeID": "Arrow", "zOrder": "3", "w": "2", "h": "96", "measuredW": "150", "measuredH": "100", - "x": "411", - "y": "1091", + "x": "421", + "y": "1101", "properties": { "color": "2848996", "curvature": "0", @@ -108,15 +108,15 @@ } }, { - "ID": "2613", + "ID": "9054", "typeID": "Arrow", "zOrder": "4", "w": "105", "h": "15", "measuredW": "150", "measuredH": "100", - "x": "248", - "y": "1040", + "x": "258", + "y": "1050", "properties": { "color": "2848996", "curvature": "-1", @@ -139,15 +139,15 @@ } }, { - "ID": "2614", + "ID": "9055", "typeID": "Arrow", "zOrder": "5", "w": "92", "h": "22", "measuredW": "150", "measuredH": "100", - "x": "259", - "y": "1012", + "x": "269", + "y": "1022", "properties": { "color": "2848996", "curvature": "0", @@ -170,15 +170,15 @@ } }, { - "ID": "2615", + "ID": "9056", "typeID": "Arrow", "zOrder": "6", "w": "89", "h": "19", "measuredW": "150", "measuredH": "100", - "x": "255", - "y": "983", + "x": "265", + "y": "993", "properties": { "color": "2848996", "curvature": "-1", @@ -201,15 +201,15 @@ } }, { - "ID": "2616", + "ID": "9057", "typeID": "Arrow", "zOrder": "7", "w": "6", "h": "75", "measuredW": "150", "measuredH": "100", - "x": "908", - "y": "1063", + "x": "918", + "y": "1073", "properties": { "color": "2848996", "curvature": "1", @@ -235,15 +235,15 @@ } }, { - "ID": "2617", + "ID": "9058", "typeID": "Arrow", "zOrder": "8", "w": "155", "h": "517", "measuredW": "150", "measuredH": "100", - "x": "477", - "y": "953", + "x": "487", + "y": "963", "properties": { "color": "2848996", "curvature": "-1", @@ -266,15 +266,15 @@ } }, { - "ID": "2618", + "ID": "9059", "typeID": "Arrow", "zOrder": "9", "w": "95", "h": "1", "measuredW": "150", "measuredH": "100", - "x": "251", - "y": "1466", + "x": "261", + "y": "1476", "properties": { "color": "2848996", "curvature": "0", @@ -300,15 +300,15 @@ } }, { - "ID": "2619", + "ID": "9060", "typeID": "Arrow", "zOrder": "10", "w": "101", "h": "33", "measuredW": "150", "measuredH": "100", - "x": "984", - "y": "1311", + "x": "994", + "y": "1321", "properties": { "color": "2848996", "curvature": "-1", @@ -334,15 +334,15 @@ } }, { - "ID": "2620", + "ID": "9061", "typeID": "Arrow", "zOrder": "11", "w": "88", "h": "7", "measuredW": "150", "measuredH": "100", - "x": "987", - "y": "1293", + "x": "997", + "y": "1303", "properties": { "color": "2848996", "curvature": "1", @@ -368,15 +368,15 @@ } }, { - "ID": "2621", + "ID": "9062", "typeID": "Arrow", "zOrder": "12", "w": "86", "h": "55", "measuredW": "150", "measuredH": "100", - "x": "987", - "y": "1242", + "x": "997", + "y": "1252", "properties": { "color": "2848996", "curvature": "1", @@ -402,15 +402,15 @@ } }, { - "ID": "2622", + "ID": "9063", "typeID": "Arrow", "zOrder": "13", "w": "7", "h": "622", "measuredW": "150", "measuredH": "100", - "x": "672", - "y": "955", + "x": "682", + "y": "965", "properties": { "color": "2848996", "curvature": "0", @@ -432,15 +432,15 @@ } }, { - "ID": "2623", + "ID": "9064", "typeID": "Arrow", "zOrder": "14", "w": "1", "h": "82", "measuredW": "150", "measuredH": "100", - "x": "925", - "y": "1297", + "x": "935", + "y": "1307", "properties": { "color": "2848996", "curvature": "-1", @@ -466,15 +466,15 @@ } }, { - "ID": "2624", + "ID": "9065", "typeID": "Arrow", "zOrder": "15", "w": "170", "h": "343", "measuredW": "150", "measuredH": "100", - "x": "702", - "y": "957", + "x": "712", + "y": "967", "properties": { "color": "2848996", "curvature": "-1", @@ -497,15 +497,15 @@ } }, { - "ID": "2625", + "ID": "9066", "typeID": "Arrow", "zOrder": "16", "w": "65", "h": "99", "measuredW": "150", "measuredH": "100", - "x": "480", - "y": "939", + "x": "490", + "y": "949", "properties": { "color": "2848996", "curvature": "-1", @@ -528,15 +528,15 @@ } }, { - "ID": "2626", + "ID": "9067", "typeID": "Arrow", "zOrder": "17", "w": "64", "h": "109", "measuredW": "150", "measuredH": "100", - "x": "728", - "y": "948", + "x": "738", + "y": "958", "properties": { "color": "2848996", "curvature": "-1", @@ -559,15 +559,15 @@ } }, { - "ID": "2627", + "ID": "9068", "typeID": "Arrow", "zOrder": "18", "w": "58", "h": "42", "measuredW": "150", "measuredH": "100", - "x": "976", - "y": "841", + "x": "986", + "y": "851", "properties": { "color": "2848996", "curvature": "1", @@ -590,15 +590,15 @@ } }, { - "ID": "2628", + "ID": "9069", "typeID": "Arrow", "zOrder": "19", "w": "67", "h": "3", "measuredW": "150", "measuredH": "100", - "x": "972", - "y": "885", + "x": "982", + "y": "895", "properties": { "color": "2848996", "curvature": "1", @@ -621,15 +621,15 @@ } }, { - "ID": "2629", + "ID": "9070", "typeID": "Arrow", "zOrder": "20", "w": "60", "h": "103", "measuredW": "150", "measuredH": "100", - "x": "976", - "y": "980", + "x": "986", + "y": "990", "properties": { "color": "2848996", "curvature": "1", @@ -652,15 +652,15 @@ } }, { - "ID": "2630", + "ID": "9071", "typeID": "Arrow", "zOrder": "21", "w": "66", "h": "75", "measuredW": "150", "measuredH": "100", - "x": "975", - "y": "971", + "x": "985", + "y": "981", "properties": { "color": "2848996", "curvature": "-1", @@ -683,15 +683,15 @@ } }, { - "ID": "2631", + "ID": "9072", "typeID": "Arrow", "zOrder": "22", "w": "74", "h": "27", "measuredW": "150", "measuredH": "100", - "x": "974", - "y": "965", + "x": "984", + "y": "975", "properties": { "color": "2848996", "curvature": "-1", @@ -714,15 +714,15 @@ } }, { - "ID": "2632", + "ID": "9073", "typeID": "Arrow", "zOrder": "23", "w": "63", "h": "24", "measuredW": "150", "measuredH": "100", - "x": "730", - "y": "945", + "x": "740", + "y": "955", "properties": { "color": "2848996", "curvature": "-1", @@ -745,15 +745,15 @@ } }, { - "ID": "2633", + "ID": "9074", "typeID": "Arrow", "zOrder": "24", "w": "74", "h": "44", "measuredW": "150", "measuredH": "100", - "x": "974", - "y": "896", + "x": "984", + "y": "906", "properties": { "color": "2848996", "curvature": "-1", @@ -776,15 +776,15 @@ } }, { - "ID": "2634", + "ID": "9075", "typeID": "Arrow", "zOrder": "25", "w": "95", "h": "18", "measuredW": "150", "measuredH": "100", - "x": "251", - "y": "1162", + "x": "261", + "y": "1172", "properties": { "color": "2848996", "curvature": "1", @@ -810,15 +810,15 @@ } }, { - "ID": "2635", + "ID": "9076", "typeID": "Arrow", "zOrder": "26", "w": "94", "h": "59", "measuredW": "150", "measuredH": "100", - "x": "251", - "y": "1116", + "x": "261", + "y": "1126", "properties": { "color": "2848996", "curvature": "1", @@ -844,15 +844,15 @@ } }, { - "ID": "2636", + "ID": "9077", "typeID": "Arrow", "zOrder": "27", "w": "2", "h": "96", "measuredW": "150", "measuredH": "100", - "x": "411", - "y": "1181", + "x": "421", + "y": "1191", "properties": { "color": "2848996", "curvature": "0", @@ -878,15 +878,15 @@ } }, { - "ID": "2637", + "ID": "9078", "typeID": "Arrow", "zOrder": "28", "w": "89", "h": "110", "measuredW": "150", "measuredH": "100", - "x": "254", - "y": "1195", + "x": "264", + "y": "1205", "properties": { "color": "2848996", "curvature": "-1", @@ -909,15 +909,15 @@ } }, { - "ID": "2638", + "ID": "9079", "typeID": "Arrow", "zOrder": "29", "w": "102", "h": "170", "measuredW": "150", "measuredH": "100", - "x": "249", - "y": "1185", + "x": "259", + "y": "1195", "properties": { "color": "2848996", "curvature": "1", @@ -940,15 +940,15 @@ } }, { - "ID": "2639", + "ID": "9080", "typeID": "Arrow", "zOrder": "30", "w": "95", "h": "73", "measuredW": "150", "measuredH": "100", - "x": "254", - "y": "1182", + "x": "264", + "y": "1192", "properties": { "color": "2848996", "curvature": "-1", @@ -971,15 +971,15 @@ } }, { - "ID": "2640", + "ID": "9081", "typeID": "Arrow", "zOrder": "31", "w": "68", "h": "51", "measuredW": "150", "measuredH": "100", - "x": "728", - "y": "886", + "x": "738", + "y": "896", "properties": { "color": "2848996", "curvature": "1", @@ -1002,15 +1002,15 @@ } }, { - "ID": "2641", + "ID": "9082", "typeID": "Arrow", "zOrder": "32", "w": "106", "h": "16", "measuredW": "150", "measuredH": "100", - "x": "248", - "y": "937", + "x": "258", + "y": "947", "properties": { "color": "2848996", "curvature": "1", @@ -1033,15 +1033,15 @@ } }, { - "ID": "2642", + "ID": "9083", "typeID": "Arrow", "zOrder": "33", "w": "94", "h": "31", "measuredW": "150", "measuredH": "100", - "x": "251", - "y": "899", + "x": "261", + "y": "909", "properties": { "color": "2848996", "curvature": "1", @@ -1064,15 +1064,15 @@ } }, { - "ID": "2643", + "ID": "9084", "typeID": "Arrow", "zOrder": "34", "w": "109", "h": "5", "measuredW": "150", "measuredH": "100", - "x": "450", - "y": "932", + "x": "460", + "y": "942", "properties": { "color": "2848996", "curvature": "0", @@ -1098,15 +1098,15 @@ } }, { - "ID": "2644", + "ID": "9085", "typeID": "Arrow", "zOrder": "35", "w": "104", "h": "234", "measuredW": "150", "measuredH": "100", - "x": "474", - "y": "947", + "x": "484", + "y": "957", "properties": { "color": "2848996", "curvature": "-1", @@ -1129,15 +1129,15 @@ } }, { - "ID": "2645", + "ID": "9086", "typeID": "Arrow", "zOrder": "36", "w": "103", "h": "132", "measuredW": "150", "measuredH": "100", - "x": "848", - "y": "653", + "x": "858", + "y": "663", "properties": { "color": "2848996", "curvature": "1", @@ -1160,15 +1160,15 @@ } }, { - "ID": "2646", + "ID": "9087", "typeID": "Arrow", "zOrder": "37", "w": "49", "h": "292", "measuredW": "150", "measuredH": "100", - "x": "689", - "y": "641", + "x": "699", + "y": "651", "properties": { "color": "2848996", "curvature": "1", @@ -1190,15 +1190,15 @@ } }, { - "ID": "2647", + "ID": "9088", "typeID": "Arrow", "zOrder": "38", "w": "117", "h": "92", "measuredW": "150", "measuredH": "100", - "x": "838", - "y": "643", + "x": "848", + "y": "653", "properties": { "color": "2848996", "curvature": "1", @@ -1221,15 +1221,15 @@ } }, { - "ID": "2648", + "ID": "9089", "typeID": "Arrow", "zOrder": "39", "w": "111", "h": "53", "measuredW": "150", "measuredH": "100", - "x": "840", - "y": "635", + "x": "850", + "y": "645", "properties": { "color": "2848996", "curvature": "1", @@ -1252,15 +1252,15 @@ } }, { - "ID": "2649", + "ID": "9090", "typeID": "Arrow", "zOrder": "40", "w": "119", "h": "7", "measuredW": "150", "measuredH": "100", - "x": "839", - "y": "627", + "x": "849", + "y": "637", "properties": { "color": "2848996", "curvature": "0", @@ -1283,15 +1283,15 @@ } }, { - "ID": "2650", + "ID": "9091", "typeID": "Arrow", "zOrder": "41", "w": "89", "h": "106", "measuredW": "150", "measuredH": "100", - "x": "498", - "y": "654", + "x": "508", + "y": "664", "properties": { "color": "2848996", "curvature": "-1", @@ -1314,15 +1314,15 @@ } }, { - "ID": "2651", + "ID": "9092", "typeID": "Arrow", "zOrder": "42", "w": "93", "h": "65", "measuredW": "150", "measuredH": "100", - "x": "490", - "y": "650", + "x": "500", + "y": "660", "properties": { "color": "2848996", "curvature": "-1", @@ -1345,15 +1345,15 @@ } }, { - "ID": "2652", + "ID": "9093", "typeID": "Arrow", "zOrder": "43", "w": "69", "h": "35", "measuredW": "150", "measuredH": "100", - "x": "295", - "y": "616", + "x": "305", + "y": "626", "properties": { "color": "2848996", "curvature": "0", @@ -1379,15 +1379,15 @@ } }, { - "ID": "2653", + "ID": "9094", "typeID": "Arrow", "zOrder": "44", "w": "81", "h": "20", "measuredW": "150", "measuredH": "100", - "x": "307", - "y": "593", + "x": "317", + "y": "603", "properties": { "color": "2848996", "curvature": "0", @@ -1410,15 +1410,15 @@ } }, { - "ID": "2654", + "ID": "9095", "typeID": "Arrow", "zOrder": "45", "w": "114", "h": "76", "measuredW": "150", "measuredH": "100", - "x": "828", - "y": "426", + "x": "838", + "y": "436", "properties": { "color": "2848996", "curvature": "1", @@ -1444,15 +1444,15 @@ } }, { - "ID": "2655", + "ID": "9096", "typeID": "Arrow", "zOrder": "46", "w": "88", "h": "21", "measuredW": "150", "measuredH": "100", - "x": "497", - "y": "610", + "x": "507", + "y": "620", "properties": { "color": "2848996", "curvature": "-1", @@ -1475,15 +1475,15 @@ } }, { - "ID": "2656", + "ID": "9097", "typeID": "Arrow", "zOrder": "47", "w": "105", "h": "29", "measuredW": "150", "measuredH": "100", - "x": "487", - "y": "633", + "x": "497", + "y": "643", "properties": { "color": "2848996", "curvature": "-1", @@ -1506,15 +1506,15 @@ } }, { - "ID": "2657", + "ID": "9098", "typeID": "Arrow", "zOrder": "48", "w": "108", "h": "118", "measuredW": "150", "measuredH": "100", - "x": "472", - "y": "425", + "x": "482", + "y": "435", "properties": { "color": "2848996", "curvature": "-1", @@ -1537,15 +1537,15 @@ } }, { - "ID": "2658", + "ID": "9099", "typeID": "Arrow", "zOrder": "49", "w": "102", "h": "66", "measuredW": "150", "measuredH": "100", - "x": "471", - "y": "426", + "x": "481", + "y": "436", "properties": { "color": "2848996", "curvature": "-1", @@ -1568,15 +1568,15 @@ } }, { - "ID": "2659", + "ID": "9100", "typeID": "Arrow", "zOrder": "50", "w": "66", "h": "65", "measuredW": "150", "measuredH": "100", - "x": "1061", - "y": "507", + "x": "1071", + "y": "517", "properties": { "color": "2848996", "curvature": "-1", @@ -1602,15 +1602,15 @@ } }, { - "ID": "2660", + "ID": "9101", "typeID": "Arrow", "zOrder": "51", "w": "114", "h": "32", "measuredW": "150", "measuredH": "100", - "x": "837", - "y": "421", + "x": "847", + "y": "431", "properties": { "color": "2848996", "curvature": "1", @@ -1636,15 +1636,15 @@ } }, { - "ID": "2661", + "ID": "9102", "typeID": "Arrow", "zOrder": "52", "w": "50", "h": "77", "measuredW": "150", "measuredH": "100", - "x": "998", - "y": "504", + "x": "1008", + "y": "514", "properties": { "color": "2848996", "curvature": "-1", @@ -1670,15 +1670,15 @@ } }, { - "ID": "2662", + "ID": "9103", "typeID": "Arrow", "zOrder": "53", "w": "129", "h": "11", "measuredW": "150", "measuredH": "100", - "x": "826", - "y": "404", + "x": "836", + "y": "414", "properties": { "color": "2848996", "curvature": "0", @@ -1704,15 +1704,15 @@ } }, { - "ID": "2663", + "ID": "9104", "typeID": "Arrow", "zOrder": "54", "w": "110", "h": "19", "measuredW": "150", "measuredH": "100", - "x": "462", - "y": "423", + "x": "472", + "y": "433", "properties": { "color": "2848996", "curvature": "-1", @@ -1735,15 +1735,15 @@ } }, { - "ID": "2664", + "ID": "9105", "typeID": "Arrow", "zOrder": "55", "w": "67", "h": "29", "measuredW": "150", "measuredH": "100", - "x": "267", - "y": "438", + "x": "277", + "y": "448", "properties": { "color": "2848996", "curvature": "1", @@ -1769,15 +1769,15 @@ } }, { - "ID": "2665", + "ID": "9106", "typeID": "Arrow", "zOrder": "56", "w": "70", "h": "27", "measuredW": "150", "measuredH": "100", - "x": "268", - "y": "413", + "x": "278", + "y": "423", "properties": { "color": "2848996", "curvature": "1", @@ -1803,15 +1803,15 @@ } }, { - "ID": "2666", + "ID": "9107", "typeID": "Arrow", "zOrder": "57", "w": "38", "h": "210", "measuredW": "150", "measuredH": "100", - "x": "648", - "y": "424", + "x": "658", + "y": "434", "properties": { "color": "2848996", "curvature": "-1", @@ -1833,15 +1833,15 @@ } }, { - "ID": "2667", + "ID": "9108", "typeID": "Arrow", "zOrder": "58", "w": "30", "h": "92", "measuredW": "150", "measuredH": "100", - "x": "676", - "y": "309", + "x": "686", + "y": "319", "properties": { "color": "2848996", "curvature": "-1", @@ -1863,52 +1863,157 @@ } }, { - "ID": "2668", + "ID": "9109", "typeID": "Canvas", "zOrder": "59", "w": "350", "h": "141", "measuredW": "100", "measuredH": "70", - "x": "884", - "y": "74" + "x": "894", + "y": "84" }, { - "ID": "2669", + "ID": "9110", "typeID": "Label", "zOrder": "60", "measuredW": "314", "measuredH": "25", - "x": "898", - "y": "91", + "x": "908", + "y": "101", "properties": { "size": "17", "text": "Find the detailed version of this roadmap" } }, { - "ID": "2670", + "ID": "9111", "typeID": "Label", "zOrder": "61", "measuredW": "319", "measuredH": "25", - "x": "898", - "y": "119", + "x": "908", + "y": "129", "properties": { "size": "17", "text": "along with resources and other roadmaps" } }, { - "ID": "2677", + "ID": "9112", + "typeID": "__group__", + "zOrder": "62", + "measuredW": "320", + "measuredH": "45", + "w": "320", + "h": "45", + "x": "909", + "y": "165", + "properties": { + "controlName": "ext_link:roadmap.sh" + }, + "children": { + "controls": { + "control": [ + { + "ID": "0", + "typeID": "Canvas", + "zOrder": "0", + "w": "320", + "h": "45", + "measuredW": "100", + "measuredH": "70", + "x": "0", + "y": "0", + "properties": { + "borderColor": "4273622", + "color": "4273622" + } + }, + { + "ID": "1", + "typeID": "Label", + "zOrder": "1", + "measuredW": "105", + "measuredH": "28", + "x": "141", + "y": "8", + "properties": { + "color": "16777215", + "size": "20", + "text": "roadmap.sh" + } + }, + { + "ID": "2", + "typeID": "Label", + "zOrder": "2", + "measuredW": "35", + "measuredH": "28", + "x": "76", + "y": "8", + "properties": { + "color": "16777215", + "size": "20", + "text": "http" + } + }, + { + "ID": "3", + "typeID": "Label", + "zOrder": "3", + "measuredW": "5", + "measuredH": "28", + "x": "113", + "y": "8", + "properties": { + "color": "16777215", + "size": "20", + "text": ":" + } + }, + { + "ID": "4", + "typeID": "Label", + "zOrder": "4", + "measuredW": "10", + "measuredH": "28", + "x": "120", + "y": "9", + "properties": { + "color": "16777215", + "size": "20", + "text": "/" + } + }, + { + "ID": "5", + "typeID": "Label", + "zOrder": "5", + "measuredW": "10", + "measuredH": "28", + "x": "128", + "y": "9", + "properties": { + "color": "16777215", + "size": "20", + "text": "/" + } + } + ] + } + } + }, + { + "ID": "9113", "typeID": "Arrow", "zOrder": "63", "w": "118", "h": "51", "measuredW": "150", "measuredH": "100", - "x": "824", - "y": "356", + "x": "834", + "y": "366", "properties": { "color": "2848996", "curvature": "1", @@ -1931,15 +2036,15 @@ } }, { - "ID": "2678", + "ID": "9114", "typeID": "Arrow", "zOrder": "64", "w": "128", "h": "35", "measuredW": "150", "measuredH": "100", - "x": "443", - "y": "385", + "x": "453", + "y": "395", "properties": { "color": "2848996", "curvature": "0", @@ -1962,15 +2067,15 @@ } }, { - "ID": "2679", + "ID": "9115", "typeID": "Arrow", "zOrder": "65", "w": "109", "h": "80", "measuredW": "150", "measuredH": "100", - "x": "462", - "y": "332", + "x": "472", + "y": "342", "properties": { "color": "2848996", "curvature": "-1", @@ -1993,17 +2098,17 @@ } }, { - "ID": "2714", + "ID": "9116", "typeID": "__group__", - "zOrder": "83", - "measuredW": "243", - "measuredH": "248", - "w": "243", - "h": "248", - "x": "75", - "y": "620", + "zOrder": "66", + "measuredW": "272", + "measuredH": "50", + "w": "272", + "h": "50", + "x": "572", + "y": "404", "properties": { - "controlName": "102-react-advanced-topics:hooks:common-hooks" + "controlName": "100-react-fundamental-topics" }, "children": { "controls": { @@ -2012,412 +2117,121 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "243", - "h": "248", + "w": "272", + "h": "50", "measuredW": "200", "measuredH": "140", "x": "0", "y": "0", "properties": { - "color": "16777215" + "color": "16776960" } }, { "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "124", + "measuredW": "155", "measuredH": "25", - "x": "59", - "y": "15", + "x": "55", + "y": "13", "properties": { - "bold": "true", "size": "17", - "text": "Common Hooks" + "text": "Fundamental Topics" } - }, + } + ] + } + } + }, + { + "ID": "9117", + "typeID": "__group__", + "zOrder": "67", + "measuredW": "159", + "measuredH": "44", + "w": "159", + "h": "44", + "x": "332", + "y": "425", + "properties": { + "controlName": "102-react-fundamental-topics:components" + }, + "children": { + "controls": { + "control": [ { - "ID": "2", + "ID": "0", "typeID": "TextArea", - "zOrder": "2", - "w": "93", - "h": "43", + "zOrder": "0", + "w": "159", + "h": "44", "measuredW": "200", "measuredH": "140", - "x": "139", - "y": "49", + "x": "0", + "y": "0", "properties": { "color": "16770457" } }, { - "ID": "3", + "ID": "1", "typeID": "Label", - "zOrder": "3", - "measuredW": "56", + "zOrder": "1", + "measuredW": "99", "measuredH": "25", - "x": "157", - "y": "58", + "x": "29", + "y": "10", "properties": { "size": "17", - "text": "useRef" + "text": "Components" } - }, + } + ] + } + } + }, + { + "ID": "9118", + "typeID": "__group__", + "zOrder": "68", + "measuredW": "255", + "measuredH": "44", + "w": "255", + "h": "44", + "x": "942", + "y": "443", + "properties": { + "controlName": "107-react-fundamental-topics:composition-vs-inheritance" + }, + "children": { + "controls": { + "control": [ { - "ID": "4", + "ID": "0", "typeID": "TextArea", - "zOrder": "4", - "w": "120", + "zOrder": "0", + "w": "255", "h": "44", "measuredW": "200", "measuredH": "140", - "x": "14", - "y": "48", + "x": "0", + "y": "0", "properties": { "color": "16770457" } }, { - "ID": "5", + "ID": "1", "typeID": "Label", - "zOrder": "5", - "measuredW": "94", - "measuredH": "25", - "x": "26", - "y": "58", - "properties": { - "size": "17", - "text": "useCallback" - } - }, - { - "ID": "6", - "typeID": "TextArea", - "zOrder": "6", - "w": "217", - "h": "44", - "measuredW": "200", - "measuredH": "140", - "x": "14", - "y": "96", - "properties": { - "color": "16770457" - } - }, - { - "ID": "7", - "typeID": "Label", - "zOrder": "7", - "measuredW": "77", - "measuredH": "25", - "x": "86", - "y": "106", - "properties": { - "size": "17", - "text": "useMemo" - } - }, - { - "ID": "8", - "typeID": "TextArea", - "zOrder": "8", - "w": "217", - "h": "43", - "measuredW": "200", - "measuredH": "140", - "x": "14", - "y": "145", - "properties": { - "color": "16770457" - } - }, - { - "ID": "9", - "typeID": "Label", - "zOrder": "9", - "measuredW": "95", - "measuredH": "25", - "x": "75", - "y": "154", - "properties": { - "size": "17", - "text": "useReducer" - } - }, - { - "ID": "10", - "typeID": "TextArea", - "zOrder": "10", - "w": "121", - "h": "43", - "measuredW": "200", - "measuredH": "140", - "x": "13", - "y": "193", - "properties": { - "color": "16770457" - } - }, - { - "ID": "11", - "typeID": "Label", - "zOrder": "11", - "measuredW": "88", - "measuredH": "25", - "x": "29", - "y": "202", - "properties": { - "size": "17", - "text": "useContext" - } - }, - { - "ID": "12", - "typeID": "TextArea", - "zOrder": "12", - "w": "92", - "h": "43", - "measuredW": "200", - "measuredH": "140", - "x": "139", - "y": "193", - "properties": { - "color": "16770457" - } - }, - { - "ID": "13", - "typeID": "Label", - "zOrder": "13", - "measuredW": "24", + "zOrder": "1", + "measuredW": "210", "measuredH": "25", - "x": "173", - "y": "202", + "x": "22", + "y": "10", "properties": { "size": "17", - "text": "......." - } - } - ] - } - } - }, - { - "ID": "2753", - "typeID": "Label", - "zOrder": "103", - "measuredW": "117", - "measuredH": "25", - "x": "127", - "y": "1378", - "properties": { - "size": "17", - "text": "REST API Calls" - } - }, - { - "ID": "2760", - "typeID": "Label", - "zOrder": "107", - "measuredW": "71", - "measuredH": "25", - "x": "150", - "y": "1191", - "properties": { - "size": "17", - "text": "GraphQL" - } - }, - { - "ID": "2799", - "typeID": "Arrow", - "zOrder": "127", - "w": "4", - "h": "89", - "measuredW": "150", - "measuredH": "100", - "x": "670", - "y": "1597", - "properties": { - "color": "2848996", - "curvature": "0", - "direction": "bottom", - "leftArrow": "false", - "p0": { - "length": 3, - "x": 3, - "y": 0 - }, - "p1": { - "length": 0.5327426604018495, - "x": 0.5326751848090503, - "y": 0.008478779433645868 - }, - "p2": { - "length": 88, - "x": 0, - "y": 88 - }, - "rightArrow": "false" - } - }, - { - "ID": "2810", - "typeID": "__group__", - "zOrder": "130", - "measuredW": "542", - "measuredH": "96", - "w": "542", - "h": "96", - "x": "295", - "y": "108", - "properties": { - "controlName": "ext_link:roadmap.sh/frontend" - }, - "children": { - "controls": { - "control": [ - { - "ID": "0", - "typeID": "Canvas", - "zOrder": "0", - "w": "542", - "h": "96", - "measuredW": "100", - "measuredH": "70", - "x": "0", - "y": "0" - }, - { - "ID": "1", - "typeID": "Label", - "zOrder": "1", - "measuredW": "475", - "measuredH": "32", - "x": "34", - "y": "18", - "properties": { - "size": "24", - "text": "Frontend Roadmap till Framework Selection" - } - }, - { - "ID": "2", - "typeID": "Label", - "zOrder": "2", - "measuredW": "171", - "measuredH": "26", - "x": "201", - "y": "54", - "properties": { - "size": "18", - "text": "roadmap.sh/frontend", - "color": "10027263" - } - } - ] - } - } - }, - { - "ID": "2811", - "typeID": "__group__", - "zOrder": "62", - "measuredW": "320", - "measuredH": "45", - "w": "320", - "h": "45", - "x": "899", - "y": "155", - "properties": { - "controlName": "ext_link:roadmap.sh" - }, - "children": { - "controls": { - "control": [ - { - "ID": "0", - "typeID": "Canvas", - "zOrder": "0", - "w": "320", - "h": "45", - "measuredW": "100", - "measuredH": "70", - "x": "0", - "y": "0", - "properties": { - "borderColor": "4273622", - "color": "4273622" - } - }, - { - "ID": "1", - "typeID": "Label", - "zOrder": "1", - "measuredW": "105", - "measuredH": "28", - "x": "141", - "y": "8", - "properties": { - "color": "16777215", - "size": "20", - "text": "roadmap.sh" - } - }, - { - "ID": "2", - "typeID": "Label", - "zOrder": "2", - "measuredW": "35", - "measuredH": "28", - "x": "76", - "y": "8", - "properties": { - "color": "16777215", - "size": "20", - "text": "http" - } - }, - { - "ID": "3", - "typeID": "Label", - "zOrder": "3", - "measuredW": "5", - "measuredH": "28", - "x": "113", - "y": "8", - "properties": { - "color": "16777215", - "size": "20", - "text": ":" - } - }, - { - "ID": "4", - "typeID": "Label", - "zOrder": "4", - "measuredW": "10", - "measuredH": "28", - "x": "120", - "y": "9", - "properties": { - "color": "16777215", - "size": "20", - "text": "/" - } - }, - { - "ID": "5", - "typeID": "Label", - "zOrder": "5", - "measuredW": "10", - "measuredH": "28", - "x": "128", - "y": "9", - "properties": { - "color": "16777215", - "size": "20", - "text": "/" + "text": "Composition vs Inheritance" } } ] @@ -2425,17 +2239,17 @@ } }, { - "ID": "2813", + "ID": "9119", "typeID": "__group__", - "zOrder": "66", - "measuredW": "272", - "measuredH": "50", - "w": "272", - "h": "50", - "x": "562", - "y": "394", + "zOrder": "69", + "measuredW": "213", + "measuredH": "44", + "w": "213", + "h": "44", + "x": "83", + "y": "402", "properties": { - "controlName": "100-react-fundamental-topics" + "controlName": "100-react-fundamental-topics:components:functional-components" }, "children": { "controls": { @@ -2444,27 +2258,27 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "272", - "h": "50", + "w": "213", + "h": "44", "measuredW": "200", "measuredH": "140", "x": "0", "y": "0", "properties": { - "color": "16776960" + "color": "16770457" } }, { "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "155", + "measuredW": "183", "measuredH": "25", - "x": "55", - "y": "13", + "x": "16", + "y": "10", "properties": { "size": "17", - "text": "Fundamental Topics" + "text": "Functional Components" } } ] @@ -2472,17 +2286,17 @@ } }, { - "ID": "2814", + "ID": "9120", "typeID": "__group__", - "zOrder": "80", - "measuredW": "272", - "measuredH": "50", - "w": "272", - "h": "50", - "x": "578", - "y": "609", + "zOrder": "70", + "measuredW": "213", + "measuredH": "44", + "w": "213", + "h": "44", + "x": "83", + "y": "452", "properties": { - "controlName": "101-react-advanced-topics" + "controlName": "101-react-fundamental-topics:components:class-components" }, "children": { "controls": { @@ -2491,27 +2305,27 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "272", - "h": "50", + "w": "213", + "h": "44", "measuredW": "200", "measuredH": "140", "x": "0", "y": "0", "properties": { - "color": "16776960" + "color": "16770457" } }, { "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "130", + "measuredW": "146", "measuredH": "25", - "x": "68", - "y": "13", + "x": "33", + "y": "10", "properties": { "size": "17", - "text": "Advanced Topics" + "text": "Class Components" } } ] @@ -2519,17 +2333,17 @@ } }, { - "ID": "2815", + "ID": "9121", "typeID": "__group__", - "zOrder": "91", - "measuredW": "201", - "measuredH": "50", - "w": "201", - "h": "50", - "x": "534", - "y": "912", + "zOrder": "71", + "measuredW": "159", + "measuredH": "44", + "w": "159", + "h": "44", + "x": "332", + "y": "375", "properties": { - "controlName": "102-react-ecosystem" + "controlName": "101-react-fundamental-topics:jsx" }, "children": { "controls": { @@ -2538,27 +2352,27 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "201", - "h": "50", + "w": "159", + "h": "44", "measuredW": "200", "measuredH": "140", "x": "0", "y": "0", "properties": { - "color": "16776960" + "color": "16770457" } }, { "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "84", + "measuredW": "30", "measuredH": "25", - "x": "56", - "y": "12", + "x": "63", + "y": "10", "properties": { "size": "17", - "text": "Ecosystem" + "text": "JSX" } } ] @@ -2566,17 +2380,17 @@ } }, { - "ID": "2816", + "ID": "9122", "typeID": "__group__", - "zOrder": "78", - "measuredW": "214", + "zOrder": "72", + "measuredW": "159", "measuredH": "44", - "w": "214", + "w": "159", "h": "44", - "x": "268", - "y": "315", + "x": "332", + "y": "477", "properties": { - "controlName": "100-react-fundamental-topics:create-react-app" + "controlName": "103-react-fundamental-topics:props-vs-state" }, "children": { "controls": { @@ -2585,7 +2399,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "214", + "w": "159", "h": "44", "measuredW": "200", "measuredH": "140", @@ -2599,13 +2413,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "139", + "measuredW": "110", "measuredH": "25", - "x": "37", + "x": "22", "y": "10", "properties": { "size": "17", - "text": "Create React App" + "text": "Props vs State" } } ] @@ -2613,17 +2427,17 @@ } }, { - "ID": "2817", + "ID": "9123", "typeID": "__group__", - "zOrder": "71", - "measuredW": "159", - "measuredH": "44", - "w": "159", - "h": "44", - "x": "322", - "y": "365", + "zOrder": "73", + "measuredW": "254", + "measuredH": "42", + "w": "254", + "h": "42", + "x": "943", + "y": "493", "properties": { - "controlName": "101-react-fundamental-topics:jsx" + "controlName": "108-react-fundamental-topics:basic-hooks" }, "children": { "controls": { @@ -2632,8 +2446,8 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "159", - "h": "44", + "w": "254", + "h": "42", "measuredW": "200", "measuredH": "140", "x": "0", @@ -2646,13 +2460,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "30", + "measuredW": "96", "measuredH": "25", - "x": "63", - "y": "10", + "x": "80", + "y": "9", "properties": { "size": "17", - "text": "JSX" + "text": "Basic Hooks" } } ] @@ -2660,17 +2474,17 @@ } }, { - "ID": "2818", + "ID": "9124", "typeID": "__group__", - "zOrder": "67", - "measuredW": "159", + "zOrder": "74", + "measuredW": "153", "measuredH": "44", - "w": "159", + "w": "153", "h": "44", - "x": "322", - "y": "415", + "x": "916", + "y": "561", "properties": { - "controlName": "102-react-fundamental-topics:components" + "controlName": "100-react-fundamental-topics:basic-hooks:use-state" }, "children": { "controls": { @@ -2679,7 +2493,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "159", + "w": "153", "h": "44", "measuredW": "200", "measuredH": "140", @@ -2693,13 +2507,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "99", + "measuredW": "69", "measuredH": "25", - "x": "29", + "x": "41", "y": "10", "properties": { "size": "17", - "text": "Components" + "text": "useState" } } ] @@ -2707,17 +2521,17 @@ } }, { - "ID": "2819", + "ID": "9125", "typeID": "__group__", - "zOrder": "72", - "measuredW": "159", + "zOrder": "75", + "measuredW": "153", "measuredH": "44", - "w": "159", + "w": "153", "h": "44", - "x": "322", - "y": "467", + "x": "1076", + "y": "561", "properties": { - "controlName": "103-react-fundamental-topics:props-vs-state" + "controlName": "101-react-fundamental-topics:basic-hooks:use-effect" }, "children": { "controls": { @@ -2726,7 +2540,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "159", + "w": "153", "h": "44", "measuredW": "200", "measuredH": "140", @@ -2740,13 +2554,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "110", + "measuredW": "73", "measuredH": "25", - "x": "22", + "x": "39", "y": "10", "properties": { "size": "17", - "text": "Props vs State" + "text": "useEffect" } } ] @@ -2754,17 +2568,17 @@ } }, { - "ID": "2820", + "ID": "9126", "typeID": "__group__", - "zOrder": "77", - "measuredW": "215", + "zOrder": "76", + "measuredW": "255", "measuredH": "44", - "w": "215", + "w": "255", "h": "44", - "x": "268", - "y": "517", + "x": "942", + "y": "394", "properties": { - "controlName": "104-react-fundamental-topics:conditional-rendering" + "controlName": "106-react-fundamental-topics:lists-and-keys" }, "children": { "controls": { @@ -2773,7 +2587,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "215", + "w": "255", "h": "44", "measuredW": "200", "measuredH": "140", @@ -2787,13 +2601,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "173", + "measuredW": "111", "measuredH": "25", - "x": "23", + "x": "70", "y": "10", "properties": { "size": "17", - "text": "Conditional Rendering" + "text": "Lists and Keys" } } ] @@ -2801,17 +2615,17 @@ } }, { - "ID": "2821", + "ID": "9127", "typeID": "__group__", - "zOrder": "79", - "measuredW": "255", + "zOrder": "77", + "measuredW": "215", "measuredH": "44", - "w": "255", + "w": "215", "h": "44", - "x": "932", - "y": "333", + "x": "278", + "y": "527", "properties": { - "controlName": "105-react-fundamental-topics:component-life-cycle" + "controlName": "104-react-fundamental-topics:conditional-rendering" }, "children": { "controls": { @@ -2820,7 +2634,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "255", + "w": "215", "h": "44", "measuredW": "200", "measuredH": "140", @@ -2834,13 +2648,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "170", + "measuredW": "173", "measuredH": "25", - "x": "42", + "x": "23", "y": "10", "properties": { "size": "17", - "text": "Component Life Cycle" + "text": "Conditional Rendering" } } ] @@ -2848,17 +2662,17 @@ } }, { - "ID": "2822", + "ID": "9128", "typeID": "__group__", - "zOrder": "76", - "measuredW": "255", + "zOrder": "78", + "measuredW": "214", "measuredH": "44", - "w": "255", + "w": "214", "h": "44", - "x": "932", - "y": "384", + "x": "278", + "y": "325", "properties": { - "controlName": "106-react-fundamental-topics:lists-and-keys" + "controlName": "100-react-fundamental-topics:create-react-app" }, "children": { "controls": { @@ -2867,7 +2681,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "255", + "w": "214", "h": "44", "measuredW": "200", "measuredH": "140", @@ -2881,13 +2695,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "111", + "measuredW": "139", "measuredH": "25", - "x": "70", + "x": "37", "y": "10", "properties": { "size": "17", - "text": "Lists and Keys" + "text": "Create React App" } } ] @@ -2895,17 +2709,17 @@ } }, { - "ID": "2823", + "ID": "9129", "typeID": "__group__", - "zOrder": "68", + "zOrder": "79", "measuredW": "255", "measuredH": "44", "w": "255", "h": "44", - "x": "932", - "y": "433", + "x": "942", + "y": "343", "properties": { - "controlName": "107-react-fundamental-topics:composition-vs-inheritance" + "controlName": "105-react-fundamental-topics:component-life-cycle" }, "children": { "controls": { @@ -2928,13 +2742,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "210", + "measuredW": "170", "measuredH": "25", - "x": "22", + "x": "42", "y": "10", "properties": { "size": "17", - "text": "Composition vs Inheritance" + "text": "Component Life Cycle" } } ] @@ -2942,17 +2756,17 @@ } }, { - "ID": "2824", + "ID": "9130", "typeID": "__group__", - "zOrder": "73", - "measuredW": "254", - "measuredH": "42", - "w": "254", - "h": "42", - "x": "933", - "y": "483", + "zOrder": "80", + "measuredW": "272", + "measuredH": "50", + "w": "272", + "h": "50", + "x": "588", + "y": "619", "properties": { - "controlName": "108-react-fundamental-topics:basic-hooks" + "controlName": "101-react-advanced-topics" }, "children": { "controls": { @@ -2961,27 +2775,27 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "254", - "h": "42", + "w": "272", + "h": "50", "measuredW": "200", "measuredH": "140", "x": "0", "y": "0", "properties": { - "color": "16770457" + "color": "16776960" } }, { "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "96", + "measuredW": "130", "measuredH": "25", - "x": "80", - "y": "9", + "x": "68", + "y": "13", "properties": { "size": "17", - "text": "Basic Hooks" + "text": "Advanced Topics" } } ] @@ -2989,17 +2803,17 @@ } }, { - "ID": "2825", + "ID": "9131", "typeID": "__group__", - "zOrder": "74", - "measuredW": "153", + "zOrder": "81", + "measuredW": "157", "measuredH": "44", - "w": "153", + "w": "157", "h": "44", - "x": "906", - "y": "551", + "x": "361", + "y": "600", "properties": { - "controlName": "100-react-fundamental-topics:basic-hooks:use-state" + "controlName": "100-react-advanced-topics:hooks" }, "children": { "controls": { @@ -3008,7 +2822,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "153", + "w": "157", "h": "44", "measuredW": "200", "measuredH": "140", @@ -3022,13 +2836,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "69", + "measuredW": "49", "measuredH": "25", - "x": "41", + "x": "55", "y": "10", "properties": { "size": "17", - "text": "useState" + "text": "Hooks" } } ] @@ -3036,17 +2850,17 @@ } }, { - "ID": "2826", + "ID": "9132", "typeID": "__group__", - "zOrder": "75", - "measuredW": "153", + "zOrder": "82", + "measuredW": "243", "measuredH": "44", - "w": "153", + "w": "243", "h": "44", - "x": "1066", - "y": "551", + "x": "85", + "y": "579", "properties": { - "controlName": "101-react-fundamental-topics:basic-hooks:use-effect" + "controlName": "101-react-advanced-topics:hooks:writing-your-own-hooks" }, "children": { "controls": { @@ -3055,7 +2869,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "153", + "w": "243", "h": "44", "measuredW": "200", "measuredH": "140", @@ -3069,13 +2883,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "73", + "measuredW": "183", "measuredH": "25", - "x": "39", + "x": "28", "y": "10", "properties": { "size": "17", - "text": "useEffect" + "text": "Writing your Own Hooks" } } ] @@ -3083,17 +2897,17 @@ } }, { - "ID": "2827", + "ID": "9133", "typeID": "__group__", - "zOrder": "69", - "measuredW": "213", - "measuredH": "44", - "w": "213", - "h": "44", - "x": "73", - "y": "392", + "zOrder": "83", + "measuredW": "243", + "measuredH": "248", + "w": "243", + "h": "248", + "x": "85", + "y": "630", "properties": { - "controlName": "100-react-fundamental-topics:components:functional-components" + "controlName": "102-react-advanced-topics:hooks:common-hooks" }, "children": { "controls": { @@ -3102,121 +2916,189 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "213", - "h": "44", + "w": "243", + "h": "248", "measuredW": "200", "measuredH": "140", "x": "0", "y": "0", "properties": { - "color": "16770457" + "color": "16777215" } }, { "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "183", + "measuredW": "123", "measuredH": "25", - "x": "16", - "y": "10", + "x": "60", + "y": "15", "properties": { "size": "17", - "text": "Functional Components" + "text": "Common Hooks" } - } - ] - } - } - }, - { - "ID": "2828", - "typeID": "__group__", - "zOrder": "70", - "measuredW": "213", - "measuredH": "44", - "w": "213", - "h": "44", - "x": "73", - "y": "442", - "properties": { - "controlName": "101-react-fundamental-topics:components:class-components" - }, - "children": { - "controls": { - "control": [ + }, { - "ID": "0", + "ID": "2", "typeID": "TextArea", - "zOrder": "0", - "w": "213", + "zOrder": "2", + "w": "93", + "h": "43", + "measuredW": "200", + "measuredH": "140", + "x": "139", + "y": "49", + "properties": { + "color": "16770457" + } + }, + { + "ID": "3", + "typeID": "Label", + "zOrder": "3", + "measuredW": "56", + "measuredH": "25", + "x": "157", + "y": "58", + "properties": { + "size": "17", + "text": "useRef" + } + }, + { + "ID": "4", + "typeID": "TextArea", + "zOrder": "4", + "w": "120", + "h": "44", + "measuredW": "200", + "measuredH": "140", + "x": "14", + "y": "48", + "properties": { + "color": "16770457" + } + }, + { + "ID": "5", + "typeID": "Label", + "zOrder": "5", + "measuredW": "94", + "measuredH": "25", + "x": "26", + "y": "58", + "properties": { + "size": "17", + "text": "useCallback" + } + }, + { + "ID": "6", + "typeID": "TextArea", + "zOrder": "6", + "w": "217", "h": "44", "measuredW": "200", "measuredH": "140", - "x": "0", - "y": "0", + "x": "14", + "y": "96", + "properties": { + "color": "16770457" + } + }, + { + "ID": "7", + "typeID": "Label", + "zOrder": "7", + "measuredW": "77", + "measuredH": "25", + "x": "86", + "y": "106", + "properties": { + "size": "17", + "text": "useMemo" + } + }, + { + "ID": "8", + "typeID": "TextArea", + "zOrder": "8", + "w": "217", + "h": "43", + "measuredW": "200", + "measuredH": "140", + "x": "14", + "y": "145", + "properties": { + "color": "16770457" + } + }, + { + "ID": "9", + "typeID": "Label", + "zOrder": "9", + "measuredW": "95", + "measuredH": "25", + "x": "75", + "y": "154", + "properties": { + "size": "17", + "text": "useReducer" + } + }, + { + "ID": "10", + "typeID": "TextArea", + "zOrder": "10", + "w": "121", + "h": "43", + "measuredW": "200", + "measuredH": "140", + "x": "13", + "y": "193", "properties": { "color": "16770457" } }, { - "ID": "1", + "ID": "11", "typeID": "Label", - "zOrder": "1", - "measuredW": "146", + "zOrder": "11", + "measuredW": "88", "measuredH": "25", - "x": "33", - "y": "10", + "x": "29", + "y": "202", "properties": { "size": "17", - "text": "Class Components" + "text": "useContext" } - } - ] - } - } - }, - { - "ID": "2829", - "typeID": "__group__", - "zOrder": "81", - "measuredW": "157", - "measuredH": "44", - "w": "157", - "h": "44", - "x": "351", - "y": "590", - "properties": { - "controlName": "100-react-advanced-topics:hooks" - }, - "children": { - "controls": { - "control": [ + }, { - "ID": "0", + "ID": "12", "typeID": "TextArea", - "zOrder": "0", - "w": "157", - "h": "44", + "zOrder": "12", + "w": "92", + "h": "43", "measuredW": "200", "measuredH": "140", - "x": "0", - "y": "0", + "x": "139", + "y": "193", "properties": { "color": "16770457" } }, { - "ID": "1", + "ID": "13", "typeID": "Label", - "zOrder": "1", - "measuredW": "49", + "zOrder": "13", + "measuredW": "24", "measuredH": "25", - "x": "55", - "y": "10", + "x": "173", + "y": "202", "properties": { "size": "17", - "text": "Hooks" + "text": "......." } } ] @@ -3224,15 +3106,15 @@ } }, { - "ID": "2830", + "ID": "9134", "typeID": "__group__", "zOrder": "84", "measuredW": "157", "measuredH": "44", "w": "157", "h": "44", - "x": "351", - "y": "639", + "x": "361", + "y": "649", "properties": { "controlName": "101-react-advanced-topics:context" }, @@ -3271,15 +3153,15 @@ } }, { - "ID": "2831", + "ID": "9135", "typeID": "__group__", "zOrder": "85", "measuredW": "157", "measuredH": "44", "w": "157", "h": "44", - "x": "351", - "y": "689", + "x": "361", + "y": "699", "properties": { "controlName": "102-react-advanced-topics:refs" }, @@ -3318,15 +3200,15 @@ } }, { - "ID": "2832", + "ID": "9136", "typeID": "__group__", "zOrder": "86", "measuredW": "157", "measuredH": "44", "w": "157", "h": "44", - "x": "351", - "y": "739", + "x": "361", + "y": "749", "properties": { "controlName": "103-react-advanced-topics:render-props" }, @@ -3365,15 +3247,15 @@ } }, { - "ID": "2833", + "ID": "9137", "typeID": "__group__", "zOrder": "87", "measuredW": "224", "measuredH": "44", "w": "224", "h": "44", - "x": "942", - "y": "612", + "x": "952", + "y": "622", "properties": { "controlName": "104-react-advanced-topics:high-order-components" }, @@ -3412,15 +3294,15 @@ } }, { - "ID": "2834", + "ID": "9138", "typeID": "__group__", "zOrder": "88", "measuredW": "224", "measuredH": "44", "w": "224", "h": "44", - "x": "942", - "y": "662", + "x": "952", + "y": "672", "properties": { "controlName": "105-react-advanced-topics:portals" }, @@ -3459,15 +3341,15 @@ } }, { - "ID": "2835", + "ID": "9139", "typeID": "__group__", "zOrder": "89", "measuredW": "224", "measuredH": "44", "w": "224", "h": "44", - "x": "942", - "y": "711", + "x": "952", + "y": "721", "properties": { "controlName": "106-react-advanced-topics:error-boundaries" }, @@ -3506,15 +3388,15 @@ } }, { - "ID": "2836", + "ID": "9140", "typeID": "__group__", "zOrder": "90", "measuredW": "224", "measuredH": "44", "w": "224", "h": "44", - "x": "942", - "y": "760", + "x": "952", + "y": "770", "properties": { "controlName": "107-react-advanced-topics:fiber-architecture" }, @@ -3553,17 +3435,64 @@ } }, { - "ID": "2837", + "ID": "9141", "typeID": "__group__", - "zOrder": "82", - "measuredW": "243", + "zOrder": "91", + "measuredW": "201", + "measuredH": "50", + "w": "201", + "h": "50", + "x": "544", + "y": "922", + "properties": { + "controlName": "102-react-ecosystem" + }, + "children": { + "controls": { + "control": [ + { + "ID": "0", + "typeID": "TextArea", + "zOrder": "0", + "w": "201", + "h": "50", + "measuredW": "200", + "measuredH": "140", + "x": "0", + "y": "0", + "properties": { + "color": "16776960" + } + }, + { + "ID": "1", + "typeID": "Label", + "zOrder": "1", + "measuredW": "84", + "measuredH": "25", + "x": "56", + "y": "12", + "properties": { + "size": "17", + "text": "Ecosystem" + } + } + ] + } + } + }, + { + "ID": "9142", + "typeID": "__group__", + "zOrder": "92", + "measuredW": "202", "measuredH": "44", - "w": "243", + "w": "202", "h": "44", - "x": "75", - "y": "569", + "x": "790", + "y": "877", "properties": { - "controlName": "101-react-advanced-topics:hooks:writing-your-own-hooks" + "controlName": "105-react-ecosystem:forms" }, "children": { "controls": { @@ -3572,7 +3501,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "243", + "w": "202", "h": "44", "measuredW": "200", "measuredH": "140", @@ -3586,13 +3515,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "183", + "measuredW": "48", "measuredH": "25", - "x": "28", + "x": "77", "y": "10", "properties": { "size": "17", - "text": "Writing your Own Hooks" + "text": "Forms" } } ] @@ -3600,17 +3529,17 @@ } }, { - "ID": "2838", + "ID": "9143", "typeID": "__group__", - "zOrder": "96", - "measuredW": "157", + "zOrder": "93", + "measuredW": "171", "measuredH": "44", - "w": "157", + "w": "171", "h": "44", - "x": "335", - "y": "911", + "x": "1039", + "y": "829", "properties": { - "controlName": "100-react-ecosystem:routers" + "controlName": "100-react-ecosystem:forms:react-hook-form" }, "children": { "controls": { @@ -3619,7 +3548,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "157", + "w": "171", "h": "44", "measuredW": "200", "measuredH": "140", @@ -3633,13 +3562,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "61", + "measuredW": "135", "measuredH": "25", - "x": "48", + "x": "19", "y": "10", "properties": { "size": "17", - "text": "Routers" + "text": "React Hook Form" } } ] @@ -3647,17 +3576,17 @@ } }, { - "ID": "2839", + "ID": "9144", "typeID": "__group__", - "zOrder": "116", - "measuredW": "157", + "zOrder": "94", + "measuredW": "171", "measuredH": "44", - "w": "157", + "w": "171", "h": "44", - "x": "334", - "y": "963", + "x": "1039", + "y": "877", "properties": { - "controlName": "101-react-ecosystem:ssr" + "controlName": "101-react-ecosystem:forms:formik" }, "children": { "controls": { @@ -3666,7 +3595,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "157", + "w": "171", "h": "44", "measuredW": "200", "measuredH": "140", @@ -3680,13 +3609,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "33", + "measuredW": "52", "measuredH": "25", - "x": "61", + "x": "60", "y": "10", "properties": { "size": "17", - "text": "SSR" + "text": "Formik" } } ] @@ -3694,17 +3623,17 @@ } }, { - "ID": "2840", + "ID": "9145", "typeID": "__group__", - "zOrder": "128", - "measuredW": "157", + "zOrder": "95", + "measuredW": "171", "measuredH": "44", - "w": "157", + "w": "171", "h": "44", - "x": "334", - "y": "1014", + "x": "1039", + "y": "925", "properties": { - "controlName": "102-react-ecosystem:ssg" + "controlName": "102-react-ecosystem:forms:final-form" }, "children": { "controls": { @@ -3713,7 +3642,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "157", + "w": "171", "h": "44", "measuredW": "200", "measuredH": "140", @@ -3727,13 +3656,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "34", + "measuredW": "82", "measuredH": "25", - "x": "61", + "x": "46", "y": "10", "properties": { "size": "17", - "text": "SSG" + "text": "Final Form" } } ] @@ -3741,17 +3670,17 @@ } }, { - "ID": "2842", + "ID": "9146", "typeID": "__group__", - "zOrder": "99", + "zOrder": "96", "measuredW": "157", "measuredH": "44", "w": "157", "h": "44", - "x": "335", - "y": "1157", + "x": "345", + "y": "921", "properties": { - "controlName": "103-react-ecosystem:api-calls" + "controlName": "100-react-ecosystem:routers" }, "children": { "controls": { @@ -3774,13 +3703,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "69", + "measuredW": "61", "measuredH": "25", - "x": "43", + "x": "48", "y": "10", "properties": { "size": "17", - "text": "API Calls" + "text": "Routers" } } ] @@ -3788,17 +3717,17 @@ } }, { - "ID": "2843", + "ID": "9147", "typeID": "__group__", - "zOrder": "125", - "measuredW": "159", + "zOrder": "97", + "measuredW": "158", "measuredH": "44", - "w": "159", + "w": "158", "h": "44", - "x": "334", - "y": "1444", + "x": "119", + "y": "887", "properties": { - "controlName": "104-react-ecosystem:mobile" + "controlName": "100-react-ecosystem:routers:react-router" }, "children": { "controls": { @@ -3807,7 +3736,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "159", + "w": "158", "h": "44", "measuredW": "200", "measuredH": "140", @@ -3821,13 +3750,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "52", + "measuredW": "104", "measuredH": "25", - "x": "55", + "x": "27", "y": "10", "properties": { "size": "17", - "text": "Mobile" + "text": "React Router" } } ] @@ -3835,17 +3764,17 @@ } }, { - "ID": "2844", + "ID": "9148", "typeID": "__group__", - "zOrder": "92", - "measuredW": "202", + "zOrder": "98", + "measuredW": "157", "measuredH": "44", - "w": "202", + "w": "157", "h": "44", - "x": "780", - "y": "867", + "x": "119", + "y": "937", "properties": { - "controlName": "105-react-ecosystem:forms" + "controlName": "101-react-ecosystem:routers:reach-router" }, "children": { "controls": { @@ -3854,7 +3783,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "202", + "w": "157", "h": "44", "measuredW": "200", "measuredH": "140", @@ -3868,13 +3797,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "48", + "measuredW": "108", "measuredH": "25", - "x": "77", + "x": "26", "y": "10", "properties": { "size": "17", - "text": "Forms" + "text": "Reach Router" } } ] @@ -3882,17 +3811,17 @@ } }, { - "ID": "2845", + "ID": "9149", "typeID": "__group__", - "zOrder": "108", - "measuredW": "202", + "zOrder": "99", + "measuredW": "157", "measuredH": "44", - "w": "202", + "w": "157", "h": "44", - "x": "780", - "y": "945", + "x": "345", + "y": "1167", "properties": { - "controlName": "106-react-ecosystem:testing" + "controlName": "103-react-ecosystem:api-calls" }, "children": { "controls": { @@ -3901,7 +3830,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "202", + "w": "157", "h": "44", "measuredW": "200", "measuredH": "140", @@ -3915,13 +3844,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "56", + "measuredW": "69", "measuredH": "25", - "x": "72", + "x": "43", "y": "10", "properties": { "size": "17", - "text": "Testing" + "text": "API Calls" } } ] @@ -3929,17 +3858,17 @@ } }, { - "ID": "2846", + "ID": "9150", "typeID": "__group__", - "zOrder": "112", - "measuredW": "202", + "zOrder": "100", + "measuredW": "157", "measuredH": "44", - "w": "202", + "w": "157", "h": "44", - "x": "787", - "y": "1034", + "x": "120", + "y": "1240", "properties": { - "controlName": "107-react-ecosystem:state-management" + "controlName": "104-react-ecosystem:api-calls:axios" }, "children": { "controls": { @@ -3948,7 +3877,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "202", + "w": "157", "h": "44", "measuredW": "200", "measuredH": "140", @@ -3962,13 +3891,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "148", + "measuredW": "41", "measuredH": "25", - "x": "27", + "x": "57", "y": "10", "properties": { "size": "17", - "text": "State Management" + "text": "Axios" } } ] @@ -3976,17 +3905,17 @@ } }, { - "ID": "2847", + "ID": "9151", "typeID": "__group__", - "zOrder": "118", + "zOrder": "101", "measuredW": "157", "measuredH": "44", "w": "157", "h": "44", - "x": "843", - "y": "1277", + "x": "119", + "y": "1290", "properties": { - "controlName": "108-react-ecosystem:styling" + "controlName": "105-react-ecosystem:api-calls:unfetch" }, "children": { "controls": { @@ -4009,13 +3938,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "51", + "measuredW": "61", "measuredH": "25", - "x": "51", + "x": "49", "y": "10", "properties": { "size": "17", - "text": "Styling" + "text": "Unfetch" } } ] @@ -4023,17 +3952,17 @@ } }, { - "ID": "2848", + "ID": "9152", "typeID": "__group__", - "zOrder": "97", - "measuredW": "158", + "zOrder": "102", + "measuredW": "157", "measuredH": "44", - "w": "158", + "w": "157", "h": "44", - "x": "109", - "y": "877", + "x": "119", + "y": "1339", "properties": { - "controlName": "100-react-ecosystem:routers:react-router" + "controlName": "106-react-ecosystem:api-calls:superagent" }, "children": { "controls": { @@ -4042,7 +3971,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "158", + "w": "157", "h": "44", "measuredW": "200", "measuredH": "140", @@ -4056,13 +3985,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "104", + "measuredW": "88", "measuredH": "25", - "x": "27", + "x": "35", "y": "10", "properties": { "size": "17", - "text": "React Router" + "text": "superagent" } } ] @@ -4070,17 +3999,30 @@ } }, { - "ID": "2849", + "ID": "9153", + "typeID": "Label", + "zOrder": "103", + "measuredW": "117", + "measuredH": "25", + "x": "137", + "y": "1388", + "properties": { + "size": "17", + "text": "REST API Calls" + } + }, + { + "ID": "9154", "typeID": "__group__", - "zOrder": "98", + "zOrder": "104", "measuredW": "157", "measuredH": "44", "w": "157", "h": "44", - "x": "109", - "y": "927", + "x": "345", + "y": "1250", "properties": { - "controlName": "101-react-ecosystem:routers:reach-router" + "controlName": "101-react-ecosystem:api-calls:use-http" }, "children": { "controls": { @@ -4103,13 +4045,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "108", + "measuredW": "64", "measuredH": "25", - "x": "26", + "x": "45", "y": "10", "properties": { "size": "17", - "text": "Reach Router" + "text": "use-http" } } ] @@ -4117,17 +4059,17 @@ } }, { - "ID": "2850", + "ID": "9155", "typeID": "__group__", - "zOrder": "117", - "measuredW": "158", + "zOrder": "105", + "measuredW": "156", "measuredH": "44", - "w": "158", + "w": "156", "h": "44", - "x": "107", - "y": "984", + "x": "119", + "y": "1103", "properties": { - "controlName": "100-react-ecosystem:ssr:next-js" + "controlName": "102-react-ecosystem:api-calls:apollo" }, "children": { "controls": { @@ -4136,7 +4078,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "158", + "w": "156", "h": "44", "measuredW": "200", "measuredH": "140", @@ -4150,13 +4092,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "52", + "measuredW": "48", "measuredH": "25", - "x": "52", + "x": "55", "y": "10", "properties": { "size": "17", - "text": "Next.js" + "text": "Apollo" } } ] @@ -4164,17 +4106,17 @@ } }, { - "ID": "2851", + "ID": "9156", "typeID": "__group__", - "zOrder": "124", - "measuredW": "157", + "zOrder": "106", + "measuredW": "156", "measuredH": "44", - "w": "157", + "w": "156", "h": "44", - "x": "107", - "y": "1033", + "x": "119", + "y": "1151", "properties": { - "controlName": "101-react-ecosystem:ssg:gatsby" + "controlName": "103-react-ecosystem:api-calls:relay-modern" }, "children": { "controls": { @@ -4183,7 +4125,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "157", + "w": "156", "h": "44", "measuredW": "200", "measuredH": "140", @@ -4197,13 +4139,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "54", + "measuredW": "107", "measuredH": "25", - "x": "51", + "x": "25", "y": "10", "properties": { "size": "17", - "text": "Gatsby" + "text": "Relay Modern" } } ] @@ -4211,17 +4153,30 @@ } }, { - "ID": "2852", + "ID": "9157", + "typeID": "Label", + "zOrder": "107", + "measuredW": "71", + "measuredH": "25", + "x": "160", + "y": "1201", + "properties": { + "size": "17", + "text": "GraphQL" + } + }, + { + "ID": "9158", "typeID": "__group__", - "zOrder": "129", - "measuredW": "157", + "zOrder": "108", + "measuredW": "202", "measuredH": "44", - "w": "157", + "w": "202", "h": "44", - "x": "334", - "y": "1082", + "x": "790", + "y": "955", "properties": { - "controlName": "100-react-ecosystem:api-calls:react-query" + "controlName": "106-react-ecosystem:testing" }, "children": { "controls": { @@ -4230,7 +4185,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "157", + "w": "202", "h": "44", "measuredW": "200", "measuredH": "140", @@ -4244,13 +4199,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "90", + "measuredW": "56", "measuredH": "25", - "x": "34", - "y": "9", + "x": "72", + "y": "10", "properties": { "size": "17", - "text": "react-query" + "text": "Testing" } } ] @@ -4258,17 +4213,17 @@ } }, { - "ID": "2853", + "ID": "9159", "typeID": "__group__", - "zOrder": "104", - "measuredW": "157", + "zOrder": "109", + "measuredW": "218", "measuredH": "44", - "w": "157", + "w": "218", "h": "44", - "x": "335", - "y": "1240", + "x": "1039", + "y": "984", "properties": { - "controlName": "101-react-ecosystem:api-calls:use-http" + "controlName": "100-react-ecosystem:testing:jest" }, "children": { "controls": { @@ -4277,7 +4232,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "157", + "w": "218", "h": "44", "measuredW": "200", "measuredH": "140", @@ -4291,13 +4246,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "64", + "measuredW": "33", "measuredH": "25", - "x": "45", + "x": "92", "y": "10", "properties": { "size": "17", - "text": "use-http" + "text": "Jest" } } ] @@ -4305,17 +4260,17 @@ } }, { - "ID": "2854", + "ID": "9160", "typeID": "__group__", - "zOrder": "105", - "measuredW": "156", + "zOrder": "110", + "measuredW": "218", "measuredH": "44", - "w": "156", + "w": "218", "h": "44", - "x": "109", - "y": "1093", + "x": "1039", + "y": "1033", "properties": { - "controlName": "102-react-ecosystem:api-calls:apollo" + "controlName": "101-react-ecosystem:testing:react-testing-library" }, "children": { "controls": { @@ -4324,7 +4279,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "156", + "w": "218", "h": "44", "measuredW": "200", "measuredH": "140", @@ -4338,13 +4293,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "48", + "measuredW": "164", "measuredH": "25", - "x": "55", + "x": "25", "y": "10", "properties": { "size": "17", - "text": "Apollo" + "text": "React Testing Library" } } ] @@ -4352,17 +4307,17 @@ } }, { - "ID": "2855", + "ID": "9161", "typeID": "__group__", - "zOrder": "106", - "measuredW": "156", + "zOrder": "111", + "measuredW": "218", "measuredH": "44", - "w": "156", + "w": "218", "h": "44", - "x": "109", - "y": "1141", + "x": "1039", + "y": "1082", "properties": { - "controlName": "103-react-ecosystem:api-calls:relay-modern" + "controlName": "102-react-ecosystem:testing:cypress" }, "children": { "controls": { @@ -4371,7 +4326,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "156", + "w": "218", "h": "44", "measuredW": "200", "measuredH": "140", @@ -4385,13 +4340,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "107", + "measuredW": "63", "measuredH": "25", - "x": "25", + "x": "76", "y": "10", "properties": { "size": "17", - "text": "Relay Modern" + "text": "Cypress" } } ] @@ -4399,17 +4354,17 @@ } }, { - "ID": "2856", + "ID": "9162", "typeID": "__group__", - "zOrder": "100", - "measuredW": "157", + "zOrder": "112", + "measuredW": "202", "measuredH": "44", - "w": "157", + "w": "202", "h": "44", - "x": "110", - "y": "1230", + "x": "797", + "y": "1044", "properties": { - "controlName": "104-react-ecosystem:api-calls:axios" + "controlName": "107-react-ecosystem:state-management" }, "children": { "controls": { @@ -4418,7 +4373,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "157", + "w": "202", "h": "44", "measuredW": "200", "measuredH": "140", @@ -4432,13 +4387,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "41", + "measuredW": "148", "measuredH": "25", - "x": "57", + "x": "27", "y": "10", "properties": { "size": "17", - "text": "Axios" + "text": "State Management" } } ] @@ -4446,17 +4401,17 @@ } }, { - "ID": "2857", + "ID": "9163", "typeID": "__group__", - "zOrder": "101", - "measuredW": "157", + "zOrder": "113", + "measuredW": "155", "measuredH": "44", - "w": "157", + "w": "155", "h": "44", - "x": "109", - "y": "1280", + "x": "847", + "y": "1127", "properties": { - "controlName": "105-react-ecosystem:api-calls:unfetch" + "controlName": "100-react-ecosystem:state-management:conext-state" }, "children": { "controls": { @@ -4465,7 +4420,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "157", + "w": "155", "h": "44", "measuredW": "200", "measuredH": "140", @@ -4479,13 +4434,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "61", + "measuredW": "117", "measuredH": "25", - "x": "49", + "x": "17", "y": "10", "properties": { "size": "17", - "text": "Unfetch" + "text": "Context / State" } } ] @@ -4493,17 +4448,17 @@ } }, { - "ID": "2858", + "ID": "9164", "typeID": "__group__", - "zOrder": "102", - "measuredW": "157", + "zOrder": "114", + "measuredW": "155", "measuredH": "44", - "w": "157", + "w": "155", "h": "44", - "x": "109", - "y": "1329", + "x": "847", + "y": "1176", "properties": { - "controlName": "106-react-ecosystem:api-calls:superagent" + "controlName": "101-react-ecosystem:state-management:redux" }, "children": { "controls": { @@ -4512,7 +4467,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "157", + "w": "155", "h": "44", "measuredW": "200", "measuredH": "140", @@ -4526,13 +4481,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "88", + "measuredW": "50", "measuredH": "25", - "x": "35", + "x": "53", "y": "10", "properties": { "size": "17", - "text": "superagent" + "text": "Redux" } } ] @@ -4540,17 +4495,17 @@ } }, { - "ID": "2859", + "ID": "9165", "typeID": "__group__", - "zOrder": "126", - "measuredW": "159", + "zOrder": "115", + "measuredW": "155", "measuredH": "44", - "w": "159", + "w": "155", "h": "44", - "x": "126", - "y": "1444", + "x": "847", + "y": "1224", "properties": { - "controlName": "100-react-ecosystem:mobile:react-native" + "controlName": "102-react-ecosystem:state-management:mobx" }, "children": { "controls": { @@ -4559,7 +4514,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "159", + "w": "155", "h": "44", "measuredW": "200", "measuredH": "140", @@ -4573,13 +4528,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "100", + "measuredW": "44", "measuredH": "25", - "x": "30", + "x": "56", "y": "10", "properties": { "size": "17", - "text": "React Native" + "text": "MobX" } } ] @@ -4587,17 +4542,17 @@ } }, { - "ID": "2860", + "ID": "9166", "typeID": "__group__", - "zOrder": "93", - "measuredW": "171", + "zOrder": "116", + "measuredW": "157", "measuredH": "44", - "w": "171", + "w": "157", "h": "44", - "x": "1029", - "y": "819", + "x": "344", + "y": "973", "properties": { - "controlName": "100-react-ecosystem:forms:react-hook-form" + "controlName": "101-react-ecosystem:ssr" }, "children": { "controls": { @@ -4606,7 +4561,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "171", + "w": "157", "h": "44", "measuredW": "200", "measuredH": "140", @@ -4620,13 +4575,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "135", + "measuredW": "33", "measuredH": "25", - "x": "19", + "x": "61", "y": "10", "properties": { "size": "17", - "text": "React Hook Form" + "text": "SSR" } } ] @@ -4634,17 +4589,17 @@ } }, { - "ID": "2861", + "ID": "9167", "typeID": "__group__", - "zOrder": "94", - "measuredW": "171", + "zOrder": "117", + "measuredW": "158", "measuredH": "44", - "w": "171", + "w": "158", "h": "44", - "x": "1029", - "y": "867", + "x": "117", + "y": "994", "properties": { - "controlName": "101-react-ecosystem:forms:formik" + "controlName": "100-react-ecosystem:ssr:next-js" }, "children": { "controls": { @@ -4653,7 +4608,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "171", + "w": "158", "h": "44", "measuredW": "200", "measuredH": "140", @@ -4669,11 +4624,11 @@ "zOrder": "1", "measuredW": "52", "measuredH": "25", - "x": "60", + "x": "52", "y": "10", "properties": { "size": "17", - "text": "Formik" + "text": "Next.js" } } ] @@ -4681,17 +4636,17 @@ } }, { - "ID": "2862", - "typeID": "__group__", - "zOrder": "95", - "measuredW": "171", + "ID": "9168", + "typeID": "__group__", + "zOrder": "118", + "measuredW": "157", "measuredH": "44", - "w": "171", + "w": "157", "h": "44", - "x": "1029", - "y": "915", + "x": "853", + "y": "1287", "properties": { - "controlName": "102-react-ecosystem:forms:final-form" + "controlName": "108-react-ecosystem:styling" }, "children": { "controls": { @@ -4700,7 +4655,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "171", + "w": "157", "h": "44", "measuredW": "200", "measuredH": "140", @@ -4714,13 +4669,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "82", + "measuredW": "51", "measuredH": "25", - "x": "46", + "x": "51", "y": "10", "properties": { "size": "17", - "text": "Final Form" + "text": "Styling" } } ] @@ -4728,17 +4683,17 @@ } }, { - "ID": "2863", + "ID": "9169", "typeID": "__group__", - "zOrder": "109", - "measuredW": "218", + "zOrder": "119", + "measuredW": "157", "measuredH": "44", - "w": "218", + "w": "157", "h": "44", - "x": "1029", - "y": "974", + "x": "1070", + "y": "1233", "properties": { - "controlName": "100-react-ecosystem:testing:jest" + "controlName": "100-react-ecosystem:styling:chakra-ui" }, "children": { "controls": { @@ -4747,7 +4702,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "218", + "w": "157", "h": "44", "measuredW": "200", "measuredH": "140", @@ -4761,13 +4716,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "33", + "measuredW": "78", "measuredH": "25", - "x": "92", + "x": "40", "y": "10", "properties": { "size": "17", - "text": "Jest" + "text": "Chakra UI" } } ] @@ -4775,17 +4730,17 @@ } }, { - "ID": "2864", + "ID": "9170", "typeID": "__group__", - "zOrder": "110", - "measuredW": "218", + "zOrder": "120", + "measuredW": "157", "measuredH": "44", - "w": "218", + "w": "157", "h": "44", - "x": "1029", - "y": "1023", + "x": "1070", + "y": "1282", "properties": { - "controlName": "101-react-ecosystem:testing:react-testing-library" + "controlName": "101-react-ecosystem:styling:material-ui" }, "children": { "controls": { @@ -4794,7 +4749,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "218", + "w": "157", "h": "44", "measuredW": "200", "measuredH": "140", @@ -4808,13 +4763,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "164", + "measuredW": "86", "measuredH": "25", - "x": "25", + "x": "36", "y": "10", "properties": { "size": "17", - "text": "React Testing Library" + "text": "Material UI" } } ] @@ -4822,17 +4777,17 @@ } }, { - "ID": "2865", + "ID": "9171", "typeID": "__group__", - "zOrder": "111", - "measuredW": "218", + "zOrder": "121", + "measuredW": "157", "measuredH": "44", - "w": "218", + "w": "157", "h": "44", - "x": "1029", - "y": "1072", + "x": "1070", + "y": "1330", "properties": { - "controlName": "102-react-ecosystem:testing:cypress" + "controlName": "102-react-ecosystem:styling:ant-design" }, "children": { "controls": { @@ -4841,7 +4796,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "218", + "w": "157", "h": "44", "measuredW": "200", "measuredH": "140", @@ -4855,13 +4810,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "63", + "measuredW": "84", "measuredH": "25", - "x": "76", + "x": "35", "y": "10", "properties": { "size": "17", - "text": "Cypress" + "text": "Ant Design" } } ] @@ -4869,17 +4824,17 @@ } }, { - "ID": "2866", + "ID": "9172", "typeID": "__group__", - "zOrder": "113", - "measuredW": "155", + "zOrder": "122", + "measuredW": "191", "measuredH": "44", - "w": "155", + "w": "191", "h": "44", - "x": "837", - "y": "1117", + "x": "839", + "y": "1361", "properties": { - "controlName": "100-react-ecosystem:state-management:conext-state" + "controlName": "103-react-ecosystem:styling:styled-components" }, "children": { "controls": { @@ -4888,7 +4843,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "155", + "w": "191", "h": "44", "measuredW": "200", "measuredH": "140", @@ -4902,13 +4857,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "117", + "measuredW": "150", "measuredH": "25", - "x": "17", + "x": "19", "y": "10", "properties": { "size": "17", - "text": "Context / State" + "text": "Styled Components" } } ] @@ -4916,17 +4871,17 @@ } }, { - "ID": "2867", + "ID": "9173", "typeID": "__group__", - "zOrder": "114", - "measuredW": "155", + "zOrder": "123", + "measuredW": "191", "measuredH": "44", - "w": "155", + "w": "191", "h": "44", - "x": "837", - "y": "1166", + "x": "839", + "y": "1410", "properties": { - "controlName": "101-react-ecosystem:state-management:redux" + "controlName": "104-react-ecosystem:styling:emotion" }, "children": { "controls": { @@ -4935,7 +4890,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "155", + "w": "191", "h": "44", "measuredW": "200", "measuredH": "140", @@ -4949,13 +4904,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "50", + "measuredW": "64", "measuredH": "25", - "x": "53", + "x": "65", "y": "10", "properties": { "size": "17", - "text": "Redux" + "text": "Emotion" } } ] @@ -4963,17 +4918,17 @@ } }, { - "ID": "2868", + "ID": "9174", "typeID": "__group__", - "zOrder": "115", - "measuredW": "155", + "zOrder": "124", + "measuredW": "157", "measuredH": "44", - "w": "155", + "w": "157", "h": "44", - "x": "837", - "y": "1214", + "x": "117", + "y": "1043", "properties": { - "controlName": "102-react-ecosystem:state-management:mobx" + "controlName": "101-react-ecosystem:ssg:gatsby" }, "children": { "controls": { @@ -4982,7 +4937,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "155", + "w": "157", "h": "44", "measuredW": "200", "measuredH": "140", @@ -4996,13 +4951,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "44", + "measuredW": "54", "measuredH": "25", - "x": "56", + "x": "51", "y": "10", "properties": { "size": "17", - "text": "MobX" + "text": "Gatsby" } } ] @@ -5010,17 +4965,17 @@ } }, { - "ID": "2869", + "ID": "9175", "typeID": "__group__", - "zOrder": "119", - "measuredW": "157", + "zOrder": "125", + "measuredW": "159", "measuredH": "44", - "w": "157", + "w": "159", "h": "44", - "x": "1060", - "y": "1223", + "x": "344", + "y": "1454", "properties": { - "controlName": "100-react-ecosystem:styling:chakra-ui" + "controlName": "104-react-ecosystem:mobile" }, "children": { "controls": { @@ -5029,7 +4984,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "157", + "w": "159", "h": "44", "measuredW": "200", "measuredH": "140", @@ -5043,13 +4998,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "78", + "measuredW": "52", "measuredH": "25", - "x": "40", + "x": "55", "y": "10", "properties": { "size": "17", - "text": "Chakra UI" + "text": "Mobile" } } ] @@ -5057,17 +5012,17 @@ } }, { - "ID": "2870", + "ID": "9176", "typeID": "__group__", - "zOrder": "120", - "measuredW": "157", + "zOrder": "126", + "measuredW": "159", "measuredH": "44", - "w": "157", + "w": "159", "h": "44", - "x": "1060", - "y": "1272", + "x": "136", + "y": "1454", "properties": { - "controlName": "101-react-ecosystem:styling:material-ui" + "controlName": "100-react-ecosystem:mobile:react-native" }, "children": { "controls": { @@ -5076,7 +5031,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "157", + "w": "159", "h": "44", "measuredW": "200", "measuredH": "140", @@ -5090,13 +5045,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "86", + "measuredW": "100", "measuredH": "25", - "x": "36", + "x": "30", "y": "10", "properties": { "size": "17", - "text": "Material UI" + "text": "React Native" } } ] @@ -5104,17 +5059,50 @@ } }, { - "ID": "2871", + "ID": "9177", + "typeID": "Arrow", + "zOrder": "127", + "w": "4", + "h": "89", + "measuredW": "150", + "measuredH": "100", + "x": "680", + "y": "1607", + "properties": { + "color": "2848996", + "curvature": "0", + "direction": "bottom", + "leftArrow": "false", + "p0": { + "length": 3, + "x": 3, + "y": 0 + }, + "p1": { + "length": 0.5327426604018495, + "x": 0.5326751848090503, + "y": 0.008478779433645868 + }, + "p2": { + "length": 88, + "x": 0, + "y": 88 + }, + "rightArrow": "false" + } + }, + { + "ID": "9178", "typeID": "__group__", - "zOrder": "121", + "zOrder": "128", "measuredW": "157", "measuredH": "44", "w": "157", "h": "44", - "x": "1060", - "y": "1320", + "x": "344", + "y": "1024", "properties": { - "controlName": "102-react-ecosystem:styling:ant-design" + "controlName": "102-react-ecosystem:ssg" }, "children": { "controls": { @@ -5137,13 +5125,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "84", + "measuredW": "34", "measuredH": "25", - "x": "35", + "x": "61", "y": "10", "properties": { "size": "17", - "text": "Ant Design" + "text": "SSG" } } ] @@ -5151,17 +5139,17 @@ } }, { - "ID": "2872", + "ID": "9179", "typeID": "__group__", - "zOrder": "122", - "measuredW": "191", + "zOrder": "129", + "measuredW": "157", "measuredH": "44", - "w": "191", + "w": "157", "h": "44", - "x": "829", - "y": "1351", + "x": "344", + "y": "1092", "properties": { - "controlName": "103-react-ecosystem:styling:styled-components" + "controlName": "100-react-ecosystem:api-calls:react-query" }, "children": { "controls": { @@ -5170,7 +5158,7 @@ "ID": "0", "typeID": "TextArea", "zOrder": "0", - "w": "191", + "w": "157", "h": "44", "measuredW": "200", "measuredH": "140", @@ -5184,13 +5172,13 @@ "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "150", + "measuredW": "90", "measuredH": "25", - "x": "19", - "y": "10", + "x": "34", + "y": "9", "properties": { "size": "17", - "text": "Styled Components" + "text": "react-query" } } ] @@ -5198,46 +5186,57 @@ } }, { - "ID": "2873", + "ID": "9180", "typeID": "__group__", - "zOrder": "123", - "measuredW": "191", - "measuredH": "44", - "w": "191", - "h": "44", - "x": "829", - "y": "1400", + "zOrder": "130", + "measuredW": "542", + "measuredH": "96", + "w": "542", + "h": "96", + "x": "305", + "y": "118", "properties": { - "controlName": "104-react-ecosystem:styling:emotion" + "controlName": "ext_link:roadmap.sh/frontend" }, "children": { "controls": { "control": [ { "ID": "0", - "typeID": "TextArea", + "typeID": "Canvas", "zOrder": "0", - "w": "191", - "h": "44", - "measuredW": "200", - "measuredH": "140", + "w": "542", + "h": "96", + "measuredW": "100", + "measuredH": "70", "x": "0", - "y": "0", - "properties": { - "color": "16770457" - } + "y": "0" }, { "ID": "1", "typeID": "Label", "zOrder": "1", - "measuredW": "64", - "measuredH": "25", - "x": "65", - "y": "10", + "measuredW": "475", + "measuredH": "32", + "x": "34", + "y": "18", "properties": { - "size": "17", - "text": "Emotion" + "size": "24", + "text": "Frontend Roadmap till Framework Selection" + } + }, + { + "ID": "2", + "typeID": "Label", + "zOrder": "2", + "measuredW": "171", + "measuredH": "26", + "x": "201", + "y": "54", + "properties": { + "size": "18", + "text": "roadmap.sh/frontend", + "color": "10027263" } } ] @@ -5245,15 +5244,15 @@ } }, { - "ID": "2874", + "ID": "9181", "typeID": "__group__", "zOrder": "131", "measuredW": "576", "measuredH": "105", "w": "576", "h": "105", - "x": "351", - "y": "1537", + "x": "361", + "y": "1547", "properties": { "controlName": "ext_link:roadmap.sh/frontend" }, @@ -5305,17 +5304,17 @@ ] }, "attributes": { - "name": "New Wireframe 1 copy", - "order": 1000011.7645389404, + "name": "New Wireframe 1 copy 2", + "order": 1000006.8992828326, "parentID": null, "notes": "" }, "branchID": "Master", - "resourceID": "3DD51A3C-1F09-4BE6-B9FB-6875747EBA53", + "resourceID": "4BE92169-157F-4FC5-8E20-403CBCF7A6C6", "mockupH": "1659", "mockupW": "1174", - "measuredW": "1247", - "measuredH": "1686", + "measuredW": "1257", + "measuredH": "1696", "version": "1.0" }, "groupOffset": {