diff --git a/frontend.md b/frontend.md index 572a23567..4b8239576 100644 --- a/frontend.md +++ b/frontend.md @@ -1,3 +1,5 @@ +> Textual form of the roadmap, feel free to fork and track as you learn + ## Frontend Developer Roadmap – 2018 This file contains the frontend roadmap translated in the checklist form to make it easier for others to contribute and to fork and keep a check on their progress. You can read the commentary on the frontend roadmap [in this medium article](https://medium.com/@kamranahmedse/modern-frontend-developer-in-2018-4c2072fa2b9c) diff --git a/images/frontend.png b/images/frontend.png new file mode 100644 index 000000000..cbe335150 Binary files /dev/null and b/images/frontend.png differ diff --git a/project/frontend-map.json b/project/frontend-map.json index d14ad30b1..c32a53b23 100644 --- a/project/frontend-map.json +++ b/project/frontend-map.json @@ -1 +1 @@ -{"mockup":{"controls":{"control":[{"ID":"0","measuredH":"40","measuredW":"149","properties":{"bold":"true","size":"32","text":"Front-end"},"typeID":"Label","x":"563","y":"121","zOrder":"59"},{"ID":"1","h":"74","measuredH":"73","measuredW":"18","properties":{"color":"2848996","curvature":"-1","direction":"bottom","leftArrow":"false","p0":{"x":8,"y":0,"length":8},"p1":{"x":0.45894941634241254,"y":0.19319066147859923,"length":0.49795300826843075},"p2":{"x":0,"y":73,"length":73},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"19","x":"637","y":"47","zOrder":"60"},{"ID":"2","h":"61","measuredH":"60","measuredW":"15","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"x":2,"y":0,"length":2},"p1":{"x":0.46391752577319545,"y":-0.10309278350515459,"length":0.4752342503759216},"p2":{"x":15,"y":60,"length":61.84658438426491},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"16","x":"626","y":"177","zOrder":"61"},{"ID":"3","measuredH":"26","measuredW":"147","properties":{"bold":"true","size":"18","text":"Learn the Basics"},"typeID":"Label","x":"589","y":"244","zOrder":"62"},{"ID":"21","measuredH":"25","measuredW":"168","properties":{"bold":"true","size":"17","text":"Basics of JavaScript"},"typeID":"Label","x":"589","y":"424","zOrder":"71"},{"ID":"24","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"556","y":"424","zOrder":"72"},{"ID":"25","measuredH":"25","measuredW":"118","properties":{"bold":"true","size":"17","text":"Basics of CSS"},"typeID":"Label","x":"589","y":"378","zOrder":"67"},{"ID":"26","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"555","y":"378","zOrder":"68"},{"ID":"27","measuredH":"25","measuredW":"100","properties":{"bold":"true","size":"17","text":"Learn HTML"},"typeID":"Label","x":"589","y":"330","zOrder":"63"},{"ID":"28","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"555","y":"330","zOrder":"64"},{"ID":"29","measuredH":"21","measuredW":"10","properties":{"bold":"true","color":"16777215","text":"1"},"typeID":"Label","x":"563","y":"332","zOrder":"65"},{"ID":"30","measuredH":"21","measuredW":"10","properties":{"bold":"true","color":"16777215","text":"2"},"typeID":"Label","w":"10","x":"563","y":"380","zOrder":"69"},{"ID":"31","measuredH":"21","measuredW":"10","properties":{"bold":"true","color":"16777215","text":"3"},"typeID":"Label","w":"10","x":"564","y":"426","zOrder":"73"},{"ID":"33","h":"41","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"250","x":"543","y":"322","zOrder":"58"},{"ID":"34","h":"55","measuredH":"54","measuredW":"9","properties":{"color":"2848996","curvature":"-1","direction":"bottom","leftArrow":"false","p0":{"x":3,"y":0,"length":3},"p1":{"x":0.510715363718684,"y":0.13884696649562314,"length":0.529252928988914},"p2":{"x":0,"y":54,"length":54},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"10","x":"655","y":"277","zOrder":"43"},{"ID":"36","h":"41","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"250","x":"543","y":"370","zOrder":"66"},{"ID":"40","h":"41","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"250","x":"544","y":"417","zOrder":"70"},{"ID":"44","h":"23","measuredH":"22","measuredW":"48","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"x":48,"y":0,"length":48},"p1":{"x":0.4652789342214823,"y":-0.001332223147377283,"length":0.46528084148049004},"p2":{"x":0,"y":22,"length":22},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"49","x":"792","y":"320","zOrder":"57"},{"ID":"45","measuredH":"25","measuredW":"322","properties":{"size":"17","text":"Don't worry about making them pretty yet"},"typeID":"Label","x":"858","y":"363","zOrder":"114"},{"ID":"46","h":"4","measuredH":"3","measuredW":"59","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"x":59,"y":0,"length":59},"p1":{"x":0.4929203539823009,"y":-0.006194690265486749,"length":0.4929592777882592},"p2":{"x":0,"y":3,"length":3},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"60","x":"794","y":"347","zOrder":"56"},{"ID":"47","measuredH":"25","measuredW":"514","properties":{"size":"17","text":"Dividing page into sections and how to structure the DOM properly"},"typeID":"Label","x":"854","y":"302","zOrder":"115"},{"ID":"48","h":"49","measuredH":"48","measuredW":"61","properties":{"color":"2848996","curvature":"1","direction":"bottom","leftArrow":"false","p0":{"x":61,"y":0,"length":61},"p1":{"x":0.45522128005575574,"y":-0.054942502032756454,"length":0.45852490918729844},"p2":{"x":0,"y":48,"length":48},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"62","x":"787","y":"285","zOrder":"54"},{"ID":"49","measuredH":"25","measuredW":"390","properties":{"size":"17","text":"Learn the basics and how to write semantic HTML"},"typeID":"Label","x":"858","y":"268","zOrder":"116"},{"ID":"56","h":"19","measuredH":"18","measuredW":"68","properties":{"color":"2848996","curvature":"1","direction":"top","leftArrow":"false","p0":{"x":68,"y":18,"length":70.3420215802759},"p1":{"x":0.45747670462949247,"y":0.021150717349504505,"length":0.45796537873845716},"p2":{"x":0,"y":0,"length":0},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"69","x":"787","y":"356","zOrder":"55"},{"ID":"57","measuredH":"25","measuredW":"386","properties":{"size":"17","text":"Make at least 5 HTML pages – focus on structure"},"typeID":"Label","x":"859","y":"335","zOrder":"117"},{"ID":"59","h":"66","measuredH":"65","measuredW":"112","properties":{"color":"2848996","curvature":"1","direction":"top","leftArrow":"false","p0":{"x":0,"y":0,"length":0},"p1":{"x":0.47200190828314154,"y":0.03285825034289463,"length":0.47314423386375903},"p2":{"x":112,"y":65,"length":129.49517365523704},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"113","x":"438","y":"320","zOrder":"53"},{"ID":"60","measuredH":"25","measuredW":"191","properties":{"size":"17","text":"Learn the basics of CSS"},"typeID":"Label","x":"238","y":"303","zOrder":"74"},{"ID":"63","h":"43","measuredH":"42","measuredW":"124","properties":{"color":"2848996","curvature":"1","direction":"top","leftArrow":"false","p0":{"x":0,"y":0,"length":0},"p1":{"x":0.4346557759626609,"y":0.026254375729288137,"length":0.4354479714301555},"p2":{"x":124,"y":42,"length":130.91982279242512},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"125","x":"436","y":"352","zOrder":"52"},{"ID":"67","h":"13","measuredH":"12","measuredW":"119","properties":{"color":"2848996","curvature":"1","direction":"top","leftArrow":"false","p0":{"x":0,"y":1,"length":1},"p1":{"x":0.42861896838602337,"y":0.022628951747088195,"length":0.42921590082087},"p2":{"x":119,"y":12,"length":119.60351165413162},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"120","x":"440","y":"385","zOrder":"51"},{"ID":"68","measuredH":"25","measuredW":"268","properties":{"size":"17","text":"Learn how to use Grid and Flexbox"},"typeID":"Label","x":"162","y":"338","zOrder":"75"},{"ID":"70","measuredH":"25","measuredW":"318","properties":{"size":"17","text":"Media Queries and Responsive Websites"},"typeID":"Label","x":"113","y":"371","zOrder":"76"},{"ID":"83","h":"20","measuredH":"19","measuredW":"71","properties":{"color":"2848996","curvature":"1","direction":"bottom","leftArrow":"false","p0":{"x":0,"y":19,"length":19},"p1":{"x":0.43817104776008886,"y":-0.04683450573861533,"length":0.4406669241308615},"p2":{"x":71,"y":0,"length":71},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"72","x":"478","y":"397","zOrder":"50"},{"ID":"85","measuredH":"25","measuredW":"378","properties":{"size":"17","text":"Style the HTML Pages that you made in last step"},"typeID":"Label","x":"93","y":"404","zOrder":"77"},{"ID":"86","h":"4","measuredH":"3","measuredW":"53","properties":{"color":"2848996","curvature":"1","direction":"top","leftArrow":"false","p0":{"x":0,"y":3,"length":3},"p1":{"x":0.45839416058394156,"y":0.03941605839416058,"length":0.4600856791042167},"p2":{"x":53,"y":3,"length":53.08483775994799},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"54","x":"797","y":"422","zOrder":"48"},{"ID":"88","measuredH":"25","measuredW":"301","properties":{"size":"17","text":"Learn the syntax and basic constructs"},"typeID":"Label","x":"855","y":"414","zOrder":"118"},{"ID":"89","measuredH":"25","measuredW":"233","properties":{"size":"17","text":"Learn how to manipulate DOM"},"typeID":"Label","x":"855","y":"442","zOrder":"119"},{"ID":"90","h":"16","measuredH":"15","measuredW":"55","properties":{"color":"2848996","curvature":"1","direction":"top","leftArrow":"false","p0":{"x":0,"y":0,"length":0},"p1":{"x":0.45488081725312146,"y":0.03887627695800227,"length":0.45653907041455166},"p2":{"x":55,"y":15,"length":57.0087712549569},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"56","x":"794","y":"437","zOrder":"49"},{"ID":"91","h":"62","measuredH":"61","measuredW":"67","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"x":0,"y":0,"length":0},"p1":{"x":0.5199305086381621,"y":-0.09275166489721069,"length":0.5281388123911577},"p2":{"x":67,"y":61,"length":90.60905032059435},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"68","x":"786","y":"449","zOrder":"46"},{"ID":"92","measuredH":"25","measuredW":"476","properties":{"size":"17","text":"Understand the concepts such as hoisting, event bubbling etc"},"typeID":"Label","x":"850","y":"471","zOrder":"120"},{"ID":"93","h":"38","measuredH":"37","measuredW":"56","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"x":0,"y":0,"length":0},"p1":{"x":0.5300904977375566,"y":-0.03190045248868781,"length":0.5310495030226782},"p2":{"x":56,"y":37,"length":67.11929677819934},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"57","x":"789","y":"441","zOrder":"47"},{"ID":"94","measuredH":"25","measuredW":"445","properties":{"size":"17","text":"Learn ES6+ new features and writing modular JavaScript"},"typeID":"Label","x":"858","y":"535","zOrder":"121"},{"ID":"95","h":"94","measuredH":"93","measuredW":"74","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"x":0,"y":0,"length":0},"p1":{"x":0.5330996249796185,"y":-0.13117560736996578,"length":0.5490011385437095},"p2":{"x":74,"y":93,"length":118.84864324004712},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"75","x":"778","y":"448","zOrder":"45"},{"ID":"96","measuredH":"25","measuredW":"137","properties":{"size":"17","text":"Learn Ajax (XHR)"},"typeID":"Label","x":"858","y":"504","zOrder":"122"},{"ID":"98","h":"41","measuredH":"140","measuredW":"200","properties":{"borderColor":"13576743","color":"16777215"},"typeID":"TextArea","w":"325","x":"153","y":"512","zOrder":"78"},{"ID":"102","measuredH":"25","measuredW":"146","properties":{"bold":"true","color":"0","size":"17","text":"jQuery – Optional"},"typeID":"Label","x":"167","y":"520","zOrder":"79"},{"ID":"108","h":"202","measuredH":"200","measuredW":"48","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"x":15,"y":0,"length":15},"p1":{"x":0.452773248314634,"y":-0.13470758597191462,"length":0.47238728614111325},"p2":{"x":48,"y":200,"length":205.67936211491906},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"50","x":"622","y":"454","zOrder":"44"},{"ID":"109","h":"2","measuredH":"1","measuredW":"136","properties":{"color":"2848996","curvature":"0","direction":"top","leftArrow":"false","p0":{"x":0,"y":0,"length":0},"p1":{"x":0.5073529411764706,"y":-0.007352941176470588,"length":0.5074062205613563},"p2":{"x":136,"y":0,"length":136},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"137","x":"489","y":"531","zOrder":"80"},{"ID":"111","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"613","y":"519","zOrder":"81"},{"ID":"112","h":"41","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"767","x":"314","y":"593","zOrder":"82"},{"ID":"114","measuredH":"25","measuredW":"574","properties":{"size":"17","text":"Make some responsive website and add some interactivity with JavaScript"},"typeID":"Label","x":"356","y":"601","zOrder":"83"},{"ID":"115","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"324","y":"601","zOrder":"84"},{"ID":"116","measuredH":"21","measuredW":"10","properties":{"bold":"true","color":"16777215","text":"4"},"typeID":"Label","w":"10","x":"332","y":"603","zOrder":"85"},{"ID":"117","h":"36","measuredH":"107","measuredW":"205","properties":{"color":"13576743"},"typeID":"ScratchOut","w":"66","x":"409","y":"514","zOrder":"86"},{"ID":"118","h":"178","measuredH":"140","measuredW":"200","properties":{"color":"16777215"},"typeID":"TextArea","w":"767","x":"314","y":"641","zOrder":"87"},{"ID":"119","measuredH":"25","measuredW":"678","properties":{"bold":"true","size":"17","text":"Search projects on Github and open a few PRs. Some of the ideas are listed below :"},"typeID":"Label","x":"356","y":"655","zOrder":"88"},{"ID":"120","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"325","y":"656","zOrder":"89"},{"ID":"121","measuredH":"21","measuredW":"10","properties":{"bold":"true","color":"16777215","text":"5"},"typeID":"Label","w":"10","x":"333","y":"658","zOrder":"90"},{"ID":"125","measuredH":"25","measuredW":"564","properties":{"size":"17","text":"Enhance the UI, make any demo pages responsive or improve the design"},"typeID":"Label","x":"356","y":"684","zOrder":"91"},{"ID":"126","measuredH":"25","measuredW":"339","properties":{"size":"17","text":"Look for any open issues that you can solve"},"typeID":"Label","x":"356","y":"711","zOrder":"92"},{"ID":"127","measuredH":"25","measuredW":"672","properties":{"size":"17","text":"Refactor any of the code or implement the best practices that you learnt along the way"},"typeID":"Label","x":"356","y":"738","zOrder":"93"},{"ID":"129","measuredH":"23","measuredW":"703","properties":{"bold":"true","color":"10027263","size":"15","text":"Link this repo, tell them you are learning and ask for feedback on your PR and how you can improve"},"typeID":"Label","x":"356","y":"777","zOrder":"94"},{"ID":"130","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"lightbulb-o","size":"small"}},"typeID":"Icon","x":"325","y":"776","zOrder":"95"},{"ID":"131","measuredH":"32","measuredW":"32","properties":{"color":"10027263","icon":{"ID":"github","size":"medium"}},"typeID":"Icon","x":"920","y":"81","zOrder":"96"},{"ID":"132","measuredH":"25","measuredW":"295","properties":{"bold":"true","color":"10027263","size":"17","text":"kamranahmedse/developer-roadmap"},"typeID":"Label","x":"959","y":"85","zOrder":"97"},{"ID":"140","h":"135","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"767","x":"314","y":"827","zOrder":"98"},{"ID":"141","measuredH":"25","measuredW":"443","properties":{"bold":"true","size":"17","text":"Give yourself a pat on the back. You are getting there :"},"typeID":"Label","x":"355","y":"842","zOrder":"99"},{"ID":"142","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"325","y":"842","zOrder":"100"},{"ID":"143","measuredH":"21","measuredW":"10","properties":{"bold":"true","color":"16777215","text":"6"},"typeID":"Label","w":"10","x":"333","y":"844","zOrder":"101"},{"ID":"149","measuredH":"25","measuredW":"629","properties":{"size":"17","text":"There are many jobs out there requiring the skillset that you have got till this point"},"typeID":"Label","x":"356","y":"868","zOrder":"102"},{"ID":"150","measuredH":"25","measuredW":"629","properties":{"size":"17","text":"You can easily start getting some freelance work or find yourself a job if you may."},"typeID":"Label","x":"356","y":"893","zOrder":"103"},{"ID":"153","measuredH":"25","measuredW":"690","properties":{"size":"17","text":"However, don't stop here, there is still a long way to go if you want to have a better career"},"typeID":"Label","x":"357","y":"919","zOrder":"104"},{"ID":"155","h":"265","measuredH":"264","measuredW":"76","properties":{"color":"2848996","curvature":"1","direction":"bottom","leftArrow":"false","p0":{"x":76,"y":0,"length":76},"p1":{"x":0.4565573307740078,"y":-0.2215039801275899,"length":0.5074530613720352},"p2":{"x":42,"y":264,"length":267.3200329193456},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"77","x":"237","y":"743","zOrder":"41"},{"ID":"156","measuredH":"25","measuredW":"339","properties":{"bold":"true","size":"17","text":"Optional – Needs some knowledge of `git`"},"typeID":"Label","x":"294","y":"1015","zOrder":"105"},{"ID":"157","measuredH":"25","measuredW":"346","properties":{"size":"17","text":"This part is optional, I added it here because"},"typeID":"Label","x":"295","y":"1043","zOrder":"106"},{"ID":"158","measuredH":"25","measuredW":"384","properties":{"size":"17","text":"it is a great way to learn and find out if you are on"},"typeID":"Label","x":"295","y":"1067","zOrder":"107"},{"ID":"159","measuredH":"25","measuredW":"399","properties":{"size":"17","text":"the right track or not. You will be amazed to find out"},"typeID":"Label","x":"294","y":"1092","zOrder":"108"},{"ID":"160","measuredH":"25","measuredW":"335","properties":{"size":"17","text":"how much people are willing to help you out."},"typeID":"Label","x":"295","y":"1117","zOrder":"109"},{"ID":"161","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"lightbulb-o","size":"small"}},"typeID":"Icon","x":"290","y":"1156","zOrder":"110"},{"ID":"162","measuredH":"23","measuredW":"366","properties":{"bold":"true","color":"10027263","size":"15","text":"Don't be scared of git, it is easiest of all the things"},"typeID":"Label","x":"322","y":"1153","zOrder":"111"},{"ID":"164","measuredH":"23","measuredW":"359","properties":{"bold":"true","color":"10027263","size":"15","text":"that you have learnt above. You can get the basics"},"typeID":"Label","x":"322","y":"1174","zOrder":"112"},{"ID":"165","h":"245","measuredH":"140","measuredW":"200","properties":{"color":"16770457"},"typeID":"TextArea","w":"427","x":"278","y":"1001","zOrder":"42"},{"ID":"167","measuredH":"23","measuredW":"292","properties":{"bold":"true","color":"10027263","size":"15","text":"in the few hours and do the rest later on"},"typeID":"Label","x":"322","y":"1195","zOrder":"113"},{"ID":"169","h":"381","measuredH":"380","measuredW":"68","properties":{"color":"2848996","curvature":"-1","direction":"bottom","leftArrow":"false","p0":{"x":5,"y":0},"p1":{"x":0.51012414933679,"y":0.17392640436254733},"p2":{"x":0,"y":380},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"69","x":"727","y":"917","zOrder":"40"},{"ID":"170","h":"136","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"543","x":"310","y":"1594","zOrder":"123"},{"ID":"172","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"323","y":"1610","zOrder":"124"},{"ID":"173","measuredH":"22","measuredW":"10","properties":{"bold":"true","color":"16777215","size":"14","text":"9"},"typeID":"Label","w":"19","x":"330","y":"1612","zOrder":"125"},{"ID":"174","measuredH":"26","measuredW":"167","properties":{"bold":"true","size":"18","text":"CSS Preprocessors"},"typeID":"Label","w":"199","x":"356","y":"1610","zOrder":"126"},{"ID":"175","measuredH":"32","measuredW":"56","properties":{"align":"center","color":"16776960","size":"18","text":"Sass"},"typeID":"TextInput","w":"136","x":"284","y":"1369","zOrder":"127"},{"ID":"176","measuredH":"32","measuredW":"55","properties":{"align":"center","color":"16777215","size":"18","text":"Less"},"typeID":"TextInput","w":"136","x":"284","y":"1445","zOrder":"128"},{"ID":"177","measuredH":"32","measuredW":"66","properties":{"align":"center","color":"16777215","size":"18","text":"Stylus"},"typeID":"TextInput","w":"136","x":"284","y":"1483","zOrder":"129"},{"ID":"178","measuredH":"32","measuredW":"88","properties":{"align":"center","color":"16776960","size":"18","text":"PostCSS"},"typeID":"TextInput","w":"136","x":"284","y":"1406","zOrder":"130"},{"ID":"180","measuredH":"25","measuredW":"450","properties":{"size":"17","text":"Preprocessors let you add functionality on top of CSS and"},"typeID":"Label","x":"356","y":"1638","zOrder":"131"},{"ID":"181","measuredH":"25","measuredW":"459","properties":{"size":"17","text":"let you do things that CSS can't. Have a look at any of them"},"typeID":"Label","x":"356","y":"1663","zOrder":"132"},{"ID":"182","measuredH":"25","measuredW":"441","properties":{"size":"17","text":"and see what they have to offer and pick the suitable one"},"typeID":"Label","x":"356","y":"1689","zOrder":"133"},{"ID":"184","h":"8","measuredH":"7","measuredW":"204","properties":{"color":"2848996","curvature":"1","direction":"bottom","leftArrow":"false","p0":{"x":204,"y":2,"length":204.00980368599937},"p1":{"x":0.4186861064441723,"y":-0.01606059743144346,"length":0.4189940316033579},"p2":{"x":0,"y":7,"length":7},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"205","x":"815","y":"1655","zOrder":"39"},{"ID":"185","h":"187","measuredH":"140","measuredW":"200","properties":{"color":"16770457"},"typeID":"TextArea","w":"408","x":"915","y":"1564","zOrder":"134"},{"ID":"196","measuredH":"25","measuredW":"157","properties":{"bold":"true","size":"17","text":"Learn Sass for now"},"typeID":"Label","x":"928","y":"1576","zOrder":"135"},{"ID":"197","measuredH":"25","measuredW":"411","properties":{"size":"17","text":"You do not need rollup for now and can do everything"},"typeID":"Label","x":"919","y":"1945","zOrder":"194"},{"ID":"198","measuredH":"25","measuredW":"370","properties":{"size":"17","text":"PostCSS is a nice-to-have and is sort of \"Babel\""},"typeID":"Label","x":"930","y":"1633","zOrder":"136"},{"ID":"199","measuredH":"25","measuredW":"335","properties":{"size":"17","text":"for CSS. You can use it on top of Sass also."},"typeID":"Label","x":"930","y":"1658","zOrder":"137"},{"ID":"200","measuredH":"25","measuredW":"240","properties":{"size":"17","text":"Sass and revisit PostCSS later"},"typeID":"Label","x":"930","y":"1712","zOrder":"138"},{"ID":"202","measuredH":"25","measuredW":"323","properties":{"size":"17","text":"However, I would recommend you to learn "},"typeID":"Label","x":"930","y":"1684","zOrder":"139"},{"ID":"204","h":"97","measuredH":"96","measuredW":"21","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"x":11,"y":0,"length":11},"p1":{"x":0.5354229282954058,"y":-0.15993988836410478,"length":0.5588009305954578},"p2":{"x":21,"y":96,"length":98.2700361249552},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"22","x":"559","y":"1515","zOrder":"38"},{"ID":"210","h":"52","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"344","x":"527","y":"1273","zOrder":"140"},{"ID":"211","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"538","y":"1285","zOrder":"141"},{"ID":"212","measuredH":"22","measuredW":"10","properties":{"bold":"true","color":"16777215","size":"14","text":"7"},"typeID":"Label","w":"12","x":"546","y":"1286","zOrder":"142"},{"ID":"213","measuredH":"26","measuredW":"39","properties":{"bold":"true","size":"18","text":"NPM"},"typeID":"Label","w":"47","x":"901","y":"1286","zOrder":"145"},{"ID":"215","h":"52","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"89","x":"876","y":"1273","zOrder":"143"},{"ID":"216","measuredH":"26","measuredW":"159","properties":{"bold":"true","size":"18","text":"Package Managers"},"typeID":"Label","w":"199","x":"572","y":"1285","zOrder":"144"},{"ID":"217","h":"52","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"89","x":"969","y":"1273","zOrder":"146"},{"ID":"218","measuredH":"26","measuredW":"38","properties":{"bold":"true","size":"18","text":"Yarn"},"typeID":"Label","w":"47","x":"991","y":"1286","zOrder":"147"},{"ID":"219","h":"80","measuredH":"79","measuredW":"67","properties":{"color":"2848996","curvature":"1","direction":"bottom","leftArrow":"false","p0":{"x":67,"y":0,"length":67},"p1":{"x":0.5075471698113209,"y":-0.1264150943396224,"length":0.5230534443633628},"p2":{"x":0,"y":79,"length":79},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"68","x":"805","y":"1202","zOrder":"37"},{"ID":"220","h":"225","measuredH":"140","measuredW":"200","properties":{"color":"16770457"},"typeID":"TextArea","w":"417","x":"845","y":"1001","zOrder":"148"},{"ID":"222","measuredH":"25","measuredW":"334","properties":{"size":"17","text":"Package managers help you bring external "},"typeID":"Label","x":"861","y":"1051","zOrder":"149"},{"ID":"223","measuredH":"25","measuredW":"354","properties":{"size":"17","text":"libraries and plugins into your projects, so that"},"typeID":"Label","x":"861","y":"1077","zOrder":"150"},{"ID":"224","measuredH":"25","measuredW":"386","properties":{"size":"17","text":"you don't have to worry about copying the libraries"},"typeID":"Label","x":"861","y":"1103","zOrder":"151"},{"ID":"226","measuredH":"25","measuredW":"384","properties":{"size":"17","text":"manually or go through the hassle of updating etc"},"typeID":"Label","x":"861","y":"1129","zOrder":"152"},{"ID":"227","measuredH":"25","measuredW":"286","properties":{"size":"17","text":"Both are almost same, there are just "},"typeID":"Label","x":"861","y":"1156","zOrder":"153"},{"ID":"229","measuredH":"25","measuredW":"316","properties":{"size":"17","text":"implementation differences; just pick any."},"typeID":"Label","x":"861","y":"1181","zOrder":"154"},{"ID":"230","h":"202","measuredH":"140","measuredW":"200","properties":{"color":"16777215"},"typeID":"TextArea","w":"759","x":"527","y":"1331","zOrder":"155"},{"ID":"231","measuredH":"25","measuredW":"425","properties":{"bold":"true","size":"17","text":"Install some external dependency in your application"},"typeID":"Label","x":"572","y":"1349","zOrder":"156"},{"ID":"232","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"541","y":"1350","zOrder":"157"},{"ID":"233","measuredH":"21","measuredW":"10","properties":{"bold":"true","color":"16777215","text":"8"},"typeID":"Label","w":"10","x":"549","y":"1352","zOrder":"158"},{"ID":"234","measuredH":"25","measuredW":"622","properties":{"size":"17","text":"Go ahead and install some external library in the webpages that you made above"},"typeID":"Label","x":"572","y":"1376","zOrder":"159"},{"ID":"237","measuredH":"25","measuredW":"683","properties":{"size":"17","text":"e.g. install some toast plugin and when user clicks a button, show him the toast message"},"typeID":"Label","x":"572","y":"1402","zOrder":"160"},{"ID":"238","measuredH":"25","measuredW":"665","properties":{"size":"17","text":"or create a login form and do the form validation using some form validation library and"},"typeID":"Label","x":"572","y":"1429","zOrder":"161"},{"ID":"239","measuredH":"25","measuredW":"510","properties":{"size":"17","text":"play with different options and see how to install different versions"},"typeID":"Label","x":"573","y":"1454","zOrder":"162"},{"ID":"242","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"lightbulb-o","size":"small"}},"typeID":"Icon","x":"545","y":"1489","zOrder":"163"},{"ID":"243","measuredH":"23","measuredW":"230","properties":{"bold":"true","color":"10027263","size":"15","text":"Read about semantic versioning"},"typeID":"Label","x":"573","y":"1490","zOrder":"164"},{"ID":"244","h":"116","measuredH":"115","measuredW":"22","properties":{"color":"2848996","curvature":"1","direction":"top","leftArrow":"false","p0":{"x":22,"y":115,"length":117.08543888972702},"p1":{"x":0.5263097382439734,"y":0.09554286590273256,"length":0.5349115625926845},"p2":{"x":5,"y":0,"length":5},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"23","x":"332","y":"1499","zOrder":"36"},{"ID":"245","h":"105","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"584","x":"543","y":"3164","zOrder":"165"},{"ID":"246","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"557","y":"3190","zOrder":"166"},{"ID":"247","measuredH":"22","measuredW":"15","properties":{"bold":"true","color":"16777215","size":"14","text":"16"},"typeID":"Label","w":"16","x":"561","y":"3192","zOrder":"167"},{"ID":"248","measuredH":"26","measuredW":"282","properties":{"bold":"true","size":"18","text":"CSS Framework – Pick Bootstrap"},"typeID":"Label","w":"293","x":"588","y":"3189","zOrder":"168"},{"ID":"251","measuredH":"25","measuredW":"489","properties":{"size":"17","text":"You really don't need to learn any but still they are good to have"},"typeID":"Label","x":"589","y":"3217","zOrder":"169"},{"ID":"254","measuredH":"32","measuredW":"92","properties":{"align":"center","color":"16776960","size":"18","text":"Bootstrap"},"typeID":"TextInput","w":"149","x":"1134","y":"3164","zOrder":"170"},{"ID":"255","measuredH":"32","measuredW":"146","properties":{"align":"center","color":"16770457","size":"18","text":"Materialize CSS"},"typeID":"TextInput","w":"149","x":"1134","y":"3201","zOrder":"171"},{"ID":"256","measuredH":"32","measuredW":"64","properties":{"align":"center","color":"16770457","size":"18","text":"Bulma"},"typeID":"TextInput","w":"150","x":"1133","y":"3237","zOrder":"172"},{"ID":"260","measuredH":"25","measuredW":"357","properties":{"bold":"true","size":"17","text":"Learn one, you automatically learn the other"},"typeID":"Label","x":"861","y":"1018","zOrder":"173"},{"ID":"267","h":"84","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"543","x":"696","y":"1781","zOrder":"174"},{"ID":"268","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"709","y":"1797","zOrder":"175"},{"ID":"269","measuredH":"22","measuredW":"15","properties":{"bold":"true","color":"16777215","size":"14","text":"10"},"typeID":"Label","w":"19","x":"713","y":"1799","zOrder":"176"},{"ID":"270","measuredH":"26","measuredW":"90","properties":{"bold":"true","size":"18","text":"Build tools"},"typeID":"Label","w":"101","x":"742","y":"1796","zOrder":"177"},{"ID":"271","measuredH":"25","measuredW":"450","properties":{"size":"17","text":"Tools to help you in the building/bundling and development"},"typeID":"Label","x":"742","y":"1822","zOrder":"178"},{"ID":"274","h":"140","measuredH":"139","measuredW":"111","properties":{"color":"2848996","curvature":"1","direction":"top","leftArrow":"false","p0":{"x":0,"y":0,"length":0},"p1":{"x":0.5380822956829531,"y":0.12426521711649069,"length":0.5522448742292186},"p2":{"x":111,"y":139,"length":177.88198334851114},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"112","x":"607","y":"1670","zOrder":"35"},{"ID":"275","h":"12","measuredH":"11","measuredW":"112","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"x":112,"y":11},"p1":{"x":0.6096633663366336,"y":-0.031366336633663366},"p2":{"x":0,"y":2},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"113","x":"603","y":"1803","zOrder":"34"},{"ID":"276","measuredH":"32","measuredW":"116","properties":{"align":"center","color":"16776960","size":"18","text":"NPM Scripts"},"typeID":"TextInput","w":"147","x":"471","y":"1790","zOrder":"179"},{"ID":"278","measuredH":"32","measuredW":"52","properties":{"align":"center","color":"16770457","size":"18","text":"Gulp"},"typeID":"TextInput","w":"147","x":"471","y":"1827","zOrder":"180"},{"ID":"280","h":"188","measuredH":"140","measuredW":"200","properties":{"color":"16770457"},"typeID":"TextArea","w":"261","x":"153","y":"1741","zOrder":"181"},{"ID":"281","measuredH":"25","measuredW":"109","properties":{"bold":"true","size":"17","text":"Task Runners"},"typeID":"Label","x":"167","y":"1756","zOrder":"182"},{"ID":"282","measuredH":"25","measuredW":"352","properties":{"size":"17","text":"I would recommend you to learn Sass for now"},"typeID":"Label","x":"930","y":"1608","zOrder":"183"},{"ID":"283","measuredH":"25","measuredW":"178","properties":{"size":"17","text":"in 2018. However, if you"},"typeID":"Label","x":"167","y":"1810","zOrder":"184"},{"ID":"284","measuredH":"25","measuredW":"216","properties":{"size":"17","text":"want to pick something else"},"typeID":"Label","x":"167","y":"1835","zOrder":"185"},{"ID":"285","measuredH":"25","measuredW":"225","properties":{"size":"17","text":"look at Gulp and see how you"},"typeID":"Label","x":"167","y":"1863","zOrder":"186"},{"ID":"286","measuredH":"25","measuredW":"143","properties":{"size":"17","text":"can benefit from it"},"typeID":"Label","x":"167","y":"1890","zOrder":"187"},{"ID":"287","h":"12","measuredH":"11","measuredW":"142","properties":{"color":"2848996","curvature":"1","direction":"top","leftArrow":"false","p0":{"x":142,"y":10,"length":142.35167719419397},"p1":{"x":0.5196039603960396,"y":0.03603960396039605,"length":0.5208523098853179},"p2":{"x":0,"y":0,"length":0},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"143","x":"340","y":"1796","zOrder":"33"},{"ID":"289","h":"68","measuredH":"67","measuredW":"2","properties":{"color":"2848996","curvature":"-1","direction":"bottom","leftArrow":"false","p0":{"x":1,"y":0,"length":1},"p1":{"x":0.517950123321458,"y":0.023842148533844896,"length":0.5184985808036734},"p2":{"x":0,"y":67,"length":67},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"3","x":"781","y":"1840","zOrder":"32"},{"ID":"290","measuredH":"32","measuredW":"90","properties":{"align":"center","color":"16776960","size":"18","text":"Webpack"},"typeID":"TextInput","w":"147","x":"726","y":"1903","zOrder":"188"},{"ID":"291","measuredH":"32","measuredW":"64","properties":{"align":"center","color":"16770457","size":"18","text":"Rollup"},"typeID":"TextInput","w":"147","x":"726","y":"1940","zOrder":"189"},{"ID":"292","measuredH":"32","measuredW":"64","properties":{"align":"center","color":"16777215","size":"18","text":"Parcel"},"typeID":"TextInput","w":"147","x":"726","y":"1978","zOrder":"190"},{"ID":"293","h":"113","measuredH":"140","measuredW":"200","properties":{"color":"16770457","text":""},"typeID":"TextArea","w":"453","x":"905","y":"1900","zOrder":"191"},{"ID":"295","measuredH":"25","measuredW":"343","properties":{"bold":"true","size":"17","text":"Use Webpack for apps, Rollup for libraries!"},"typeID":"Label","x":"919","y":"1914","zOrder":"192"},{"ID":"296","measuredH":"25","measuredW":"227","properties":{"size":"17","text":"I would just pick NPM Scripts"},"typeID":"Label","x":"167","y":"1784","zOrder":"193"},{"ID":"297","measuredH":"25","measuredW":"369","properties":{"size":"17","text":"with webpack but feel free to revisit Rollup later"},"typeID":"Label","x":"920","y":"1972","zOrder":"195"},{"ID":"298","h":"23","measuredH":"22","measuredW":"146","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"x":146,"y":22,"length":147.648230602334},"p1":{"x":0.4467326732673264,"y":-0.07267326732673271,"length":0.45260521997488556},"p2":{"x":0,"y":3,"length":3},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"147","x":"800","y":"1917","zOrder":"31"},{"ID":"299","h":"244","measuredH":"243","measuredW":"52","properties":{"color":"2848996","curvature":"1","direction":"bottom","leftArrow":"false","p0":{"x":52,"y":0,"length":52},"p1":{"x":0.471276613180796,"y":-0.2026617278284945,"length":0.5130043099795483},"p2":{"x":47,"y":243,"length":247.50353532828578},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"53","x":"657","y":"1848","zOrder":"30"},{"ID":"305","h":"176","measuredH":"140","measuredW":"200","properties":{"color":"16777215"},"typeID":"TextArea","w":"775","x":"484","y":"2085","zOrder":"196"},{"ID":"306","measuredH":"25","measuredW":"291","properties":{"bold":"true","size":"17","text":"Create something – Maybe a library"},"typeID":"Label","x":"530","y":"2104","zOrder":"197"},{"ID":"307","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"499","y":"2105","zOrder":"198"},{"ID":"308","measuredH":"21","measuredW":"11","properties":{"bold":"true","color":"16777215","text":"11"},"typeID":"Label","w":"10","x":"505","y":"2107","zOrder":"199"},{"ID":"309","measuredH":"25","measuredW":"660","properties":{"size":"17","text":"Congrats! You can call yourself 75% modern JavaScript developer now. Now go ahead"},"typeID":"Label","x":"530","y":"2133","zOrder":"200"},{"ID":"310","measuredH":"25","measuredW":"653","properties":{"size":"17","text":"and create something with all that you have learnt. Maybe create some sort of library"},"typeID":"Label","x":"530","y":"2161","zOrder":"201"},{"ID":"315","measuredH":"25","measuredW":"692","properties":{"size":"17","text":"in which you have to use Sass and JavaScript. Then use webpack to convert Sass to CSS"},"typeID":"Label","x":"530","y":"2190","zOrder":"202"},{"ID":"316","measuredH":"25","measuredW":"703","properties":{"size":"17","text":"and use babel to transpile ES6 code. Once you are done with, release it on Github and npm"},"typeID":"Label","x":"530","y":"2217","zOrder":"203"},{"ID":"317","measuredH":"32","measuredW":"32","properties":{"color":"10027263","icon":{"ID":"twitter","size":"medium"}},"typeID":"Icon","x":"920","y":"127","zOrder":"204"},{"ID":"318","measuredH":"25","measuredW":"133","properties":{"bold":"true","color":"10027263","size":"17","text":"kamranahmedse"},"typeID":"Label","x":"960","y":"132","zOrder":"205"},{"ID":"319","h":"82","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"319","x":"534","y":"2299","zOrder":"206"},{"ID":"320","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"547","y":"2315","zOrder":"207"},{"ID":"321","measuredH":"22","measuredW":"15","properties":{"bold":"true","color":"16777215","size":"14","text":"12"},"typeID":"Label","w":"19","x":"551","y":"2317","zOrder":"208"},{"ID":"322","measuredH":"26","measuredW":"149","properties":{"bold":"true","size":"18","text":"Pick a Framework"},"typeID":"Label","w":"175","x":"580","y":"2314","zOrder":"209"},{"ID":"323","measuredH":"25","measuredW":"174","properties":{"size":"17","text":"React, Angular or Vue"},"typeID":"Label","w":"184","x":"580","y":"2340","zOrder":"210"},{"ID":"324","h":"116","measuredH":"115","measuredW":"15","properties":{"color":"2848996","curvature":"-1","direction":"bottom","leftArrow":"false","p0":{"x":1,"y":0,"length":1},"p1":{"x":0.5380311507636474,"y":0.12641766218055345,"length":0.5526834034990115},"p2":{"x":0,"y":115,"length":115},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"16","x":"763","y":"2193","zOrder":"29"},{"ID":"325","h":"11","measuredH":"10","measuredW":"114","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"x":114,"y":0,"length":114},"p1":{"x":0.47388515577275503,"y":0.002290775809407418,"length":0.47389069258171473},"p2":{"x":0,"y":10,"length":10},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"115","x":"460","y":"2313","zOrder":"28"},{"ID":"326","measuredH":"32","measuredW":"82","properties":{"align":"center","color":"16776960","size":"18","text":"React.js"},"typeID":"TextInput","w":"147","x":"324","y":"2307","zOrder":"211"},{"ID":"327","measuredH":"32","measuredW":"67","properties":{"align":"center","color":"16776960","size":"18","text":"Redux"},"typeID":"TextInput","w":"176","x":"167","y":"2049","zOrder":"212"},{"ID":"328","measuredH":"32","measuredW":"58","properties":{"align":"center","color":"16776960","size":"18","text":"Mobx"},"typeID":"TextInput","w":"176","x":"167","y":"2088","zOrder":"213"},{"ID":"329","h":"208","measuredH":"140","measuredW":"200","properties":{"color":"16777215"},"typeID":"TextArea","w":"205","x":"153","y":"2032","zOrder":"27"},{"ID":"330","measuredH":"25","measuredW":"173","properties":{"size":"17","text":"These are not specific"},"typeID":"Label","x":"167","y":"2130","zOrder":"214"},{"ID":"331","measuredH":"25","measuredW":"166","properties":{"size":"17","text":"to React though, you "},"typeID":"Label","x":"167","y":"2153","zOrder":"215"},{"ID":"332","measuredH":"25","measuredW":"161","properties":{"size":"17","text":"can use them in any "},"typeID":"Label","x":"167","y":"2177","zOrder":"216"},{"ID":"333","measuredH":"25","measuredW":"136","properties":{"size":"17","text":"framework or app"},"typeID":"Label","x":"167","y":"2201","zOrder":"217"},{"ID":"334","h":"96","measuredH":"95","measuredW":"88","properties":{"color":"2848996","curvature":"1","direction":"top","leftArrow":"false","p0":{"x":88,"y":95,"length":129.49517365523704},"p1":{"x":0.45524634313777257,"y":0.2454982309763954,"length":0.5172220165005103},"p2":{"x":0,"y":0,"length":0},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"89","x":"238","y":"2227","zOrder":"26"},{"ID":"335","measuredH":"32","measuredW":"63","properties":{"align":"center","color":"16776960","size":"18","text":"Vue.js"},"typeID":"TextInput","w":"147","x":"324","y":"2346","zOrder":"218"},{"ID":"336","measuredH":"32","measuredW":"80","properties":{"align":"center","color":"16776960","size":"18","text":"Angular"},"typeID":"TextInput","w":"147","x":"324","y":"2385","zOrder":"219"},{"ID":"337","h":"41","measuredH":"40","measuredW":"125","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"x":125,"y":0,"length":125},"p1":{"x":0.4738851557727551,"y":0.0022907758094072093,"length":0.4738906925817148},"p2":{"x":0,"y":40,"length":40},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"126","x":"459","y":"2323","zOrder":"25"},{"ID":"338","h":"50","measuredH":"49","measuredW":"110","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"x":110,"y":0,"length":110},"p1":{"x":0.4738851557727549,"y":0.002290775809407395,"length":0.4738906925817146},"p2":{"x":0,"y":49,"length":49},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"111","x":"466","y":"2352","zOrder":"24"},{"ID":"340","h":"123","measuredH":"140","measuredW":"200","properties":{"color":"16770457"},"typeID":"TextArea","w":"276","x":"443","y":"2455","zOrder":"220"},{"ID":"341","measuredH":"32","measuredW":"54","properties":{"align":"center","color":"16776960","size":"18","text":"Rx.js"},"typeID":"TextInput","w":"176","x":"220","y":"2495","zOrder":"221"},{"ID":"342","measuredH":"32","measuredW":"52","properties":{"align":"center","color":"16776960","size":"18","text":"ngrx"},"typeID":"TextInput","w":"176","x":"220","y":"2531","zOrder":"222"},{"ID":"343","measuredH":"25","measuredW":"229","properties":{"size":"17","text":"Even if you don't pick angular"},"typeID":"Label","x":"459","y":"2468","zOrder":"223"},{"ID":"344","measuredH":"25","measuredW":"205","properties":{"size":"17","text":"Rx.js is an amazing library"},"typeID":"Label","x":"459","y":"2491","zOrder":"224"},{"ID":"345","measuredH":"25","measuredW":"245","properties":{"size":"17","text":"and can be used out of angular."},"typeID":"Label","x":"459","y":"2515","zOrder":"225"},{"ID":"346","measuredH":"25","measuredW":"184","properties":{"size":"17","text":"Give it a try afterwards!"},"typeID":"Label","x":"459","y":"2540","zOrder":"226"},{"ID":"347","h":"92","measuredH":"91","measuredW":"8","properties":{"color":"2848996","curvature":"1","direction":"bottom","leftArrow":"false","p0":{"x":8,"y":0,"length":8},"p1":{"x":0.4461538461538461,"y":-0.03076923076923077,"length":0.4472135954999579},"p2":{"x":1,"y":91,"length":91.00549433962765},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"9","x":"377","y":"2424","zOrder":"23"},{"ID":"349","measuredH":"32","measuredW":"95","properties":{"align":"center","borderColor":"13576743","color":"16777215","size":"18","text":"Angular.js"},"typeID":"TextInput","w":"205","x":"81","y":"2431","zOrder":"227"},{"ID":"350","h":"27","measuredH":"107","measuredW":"205","properties":{"color":"13576743"},"typeID":"ScratchOut","w":"44","x":"238","y":"2433","zOrder":"228"},{"ID":"352","h":"158","measuredH":"157","measuredW":"1","properties":{"color":"2848996","curvature":"0","direction":"top","leftArrow":"false","p0":{"x":0,"y":0,"length":0},"p1":{"x":0.46125955702687793,"y":0.009064396626468041,"length":0.4613486124774123},"p2":{"x":0,"y":157,"length":157},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"2","x":"166","y":"2448","zOrder":"22"},{"ID":"353","h":"123","measuredH":"140","measuredW":"200","properties":{"color":"16770457"},"typeID":"TextArea","w":"354","x":"97","y":"2599","zOrder":"229"},{"ID":"354","measuredH":"25","measuredW":"147","properties":{"bold":"true","size":"17","text":"Honorary Mention!"},"typeID":"Label","x":"111","y":"2611","zOrder":"230"},{"ID":"355","measuredH":"25","measuredW":"281","properties":{"size":"17","text":"It isn't used any more except for the"},"typeID":"Label","x":"111","y":"2637","zOrder":"231"},{"ID":"356","measuredH":"25","measuredW":"265","properties":{"size":"17","text":"the old apps. Make sure if you pick"},"typeID":"Label","x":"111","y":"2662","zOrder":"232"},{"ID":"358","measuredH":"25","measuredW":"326","properties":{"size":"17","text":"Angular it is Angular2+ and not angular.js"},"typeID":"Label","x":"111","y":"2685","zOrder":"233"},{"ID":"364","h":"262","measuredH":"140","measuredW":"200","properties":{"color":"16770457","text":""},"typeID":"TextArea","w":"483","x":"891","y":"2288","zOrder":"234"},{"ID":"365","measuredH":"25","measuredW":"135","properties":{"bold":"true","size":"17","text":"Personal Opinion"},"typeID":"Label","x":"905","y":"2302","zOrder":"235"},{"ID":"366","measuredH":"25","measuredW":"436","properties":{"size":"17","text":"There is more and more demand for React.js these days"},"typeID":"Label","x":"905","y":"2333","zOrder":"236"},{"ID":"367","measuredH":"25","measuredW":"421","properties":{"size":"17","text":"You can pick any of the listed ones and you will be fine"},"typeID":"Label","x":"905","y":"2360","zOrder":"237"},{"ID":"368","measuredH":"25","measuredW":"452","properties":{"size":"17","text":"Personally I would pick React or Angular. Just a quick note"},"typeID":"Label","x":"905","y":"2386","zOrder":"238"},{"ID":"369","measuredH":"25","measuredW":"458","properties":{"size":"17","text":"here, if you are looking for the *easier* one among react and"},"typeID":"Label","x":"905","y":"2414","zOrder":"239"},{"ID":"370","measuredH":"25","measuredW":"421","properties":{"size":"17","text":"angular then Angular is much more simpler and easier"},"typeID":"Label","x":"905","y":"2444","zOrder":"240"},{"ID":"376","measuredH":"25","measuredW":"435","properties":{"size":"17","text":"but that is just my opinion, have a look at both, weigh the"},"typeID":"Label","x":"905","y":"2471","zOrder":"241"},{"ID":"377","measuredH":"25","measuredW":"402","properties":{"size":"17","text":"pros and cons and see what is more suitable for you"},"typeID":"Label","x":"905","y":"2501","zOrder":"242"},{"ID":"378","h":"3","measuredH":"2","measuredW":"216","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"x":0,"y":2,"length":2},"p1":{"x":0.47388515577275514,"y":0.00229077580940742,"length":0.47389069258171485},"p2":{"x":216,"y":1,"length":216.00231480241132},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"217","x":"846","y":"2327","zOrder":"21"},{"ID":"379","h":"315","measuredH":"314","measuredW":"76","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"x":7,"y":0,"length":7},"p1":{"x":0.5032750563580599,"y":-0.10103814932708961,"length":0.5133171436564842},"p2":{"x":76,"y":314,"length":323.066556610244},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"77","x":"750","y":"2358","zOrder":"20"},{"ID":"380","h":"193","measuredH":"140","measuredW":"200","properties":{"color":"16777215"},"typeID":"TextArea","w":"740","x":"541","y":"2615","zOrder":"243"},{"ID":"381","measuredH":"25","measuredW":"114","properties":{"bold":"true","size":"17","text":"Practical time"},"typeID":"Label","x":"588","y":"2628","zOrder":"244"},{"ID":"382","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"557","y":"2629","zOrder":"245"},{"ID":"383","measuredH":"21","measuredW":"14","properties":{"bold":"true","color":"16777215","text":"13"},"typeID":"Label","w":"17","x":"562","y":"2631","zOrder":"246"},{"ID":"384","measuredH":"25","measuredW":"670","properties":{"size":"17","text":"Now you know _everything_ that one might need to build a modern JavaScript application."},"typeID":"Label","x":"588","y":"2657","zOrder":"247"},{"ID":"388","measuredH":"25","measuredW":"674","properties":{"size":"17","text":"Go ahead and make some application with whatever framework you picked. You can find"},"typeID":"Label","x":"588","y":"2687","zOrder":"248"},{"ID":"389","measuredH":"25","measuredW":"506","properties":{"size":"17","text":"some of the ideas in the `ideas` directory. Pick anything and start!"},"typeID":"Label","x":"588","y":"2714","zOrder":"249"},{"ID":"391","h":"213","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"740","x":"543","y":"2815","zOrder":"250"},{"ID":"392","measuredH":"32","measuredW":"54","properties":{"align":"center","color":"16776960","size":"18","text":"vuex"},"typeID":"TextInput","w":"176","x":"79","y":"2356","zOrder":"251"},{"ID":"393","h":"11","measuredH":"10","measuredW":"93","properties":{"color":"2848996","curvature":"1","direction":"bottom","leftArrow":"false","p0":{"x":93,"y":2,"length":93.02150289046077},"p1":{"x":0.40573434757167937,"y":-0.03639555295494441,"length":0.4073634704711659},"p2":{"x":0,"y":10,"length":10},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"94","x":"235","y":"2362","zOrder":"19"},{"ID":"394","measuredH":"25","measuredW":"146","properties":{"bold":"true","size":"17","text":"Testing your Apps"},"typeID":"Label","x":"592","y":"2834","zOrder":"252"},{"ID":"395","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"561","y":"2834","zOrder":"253"},{"ID":"396","measuredH":"21","measuredW":"14","properties":{"bold":"true","color":"16777215","text":"14"},"typeID":"Label","w":"17","x":"566","y":"2836","zOrder":"254"},{"ID":"397","h":"3","measuredH":"2","measuredW":"131","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"x":131,"y":0,"length":131},"p1":{"x":0.46052631578947356,"y":-1.821373747360583e-17,"length":0.46052631578947356},"p2":{"x":0,"y":2,"length":2},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"132","x":"374","y":"2508","zOrder":"18"},{"ID":"398","h":"1","measuredH":"0","measuredW":"175","properties":{"color":"2848996","curvature":"0","direction":"top","leftArrow":"false","p0":{"x":175,"y":0,"length":175},"p1":{"x":0.5395167379813742,"y":0.0033979360684621178,"length":0.5395274381637954},"p2":{"x":0,"y":0,"length":0},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"176","x":"384","y":"2846","zOrder":"17"},{"ID":"399","measuredH":"32","measuredW":"50","properties":{"align":"center","color":"16770457","size":"18","text":"Jest"},"typeID":"TextInput","w":"162","x":"220","y":"2796","zOrder":"255"},{"ID":"400","measuredH":"32","measuredW":"67","properties":{"align":"center","color":"16770457","size":"18","text":"Mocha"},"typeID":"TextInput","w":"162","x":"220","y":"2831","zOrder":"256"},{"ID":"401","measuredH":"32","measuredW":"69","properties":{"align":"center","color":"16770457","size":"18","text":"Karma"},"typeID":"TextInput","w":"162","x":"220","y":"2906","zOrder":"257"},{"ID":"402","measuredH":"32","measuredW":"81","properties":{"align":"center","color":"16770457","size":"18","text":"Enzyme"},"typeID":"TextInput","w":"162","x":"220","y":"2942","zOrder":"258"},{"ID":"403","measuredH":"25","measuredW":"647","properties":{"size":"17","text":"There are lots and lots of different tools for *different purposes*. I mostly find myself"},"typeID":"Label","x":"594","y":"2865","zOrder":"259"},{"ID":"404","measuredH":"25","measuredW":"652","properties":{"size":"17","text":"using the ones listed on the left. However, before you learn them, I would recommend"},"typeID":"Label","x":"594","y":"2888","zOrder":"260"},{"ID":"405","measuredH":"25","measuredW":"667","properties":{"size":"17","text":"you to first understand the different test types, look at all the options available and use"},"typeID":"Label","x":"594","y":"2912","zOrder":"261"},{"ID":"406","measuredH":"32","measuredW":"97","properties":{"align":"center","color":"16770457","size":"18","text":"Protractor"},"typeID":"TextInput","w":"162","x":"220","y":"2868","zOrder":"262"},{"ID":"407","measuredH":"25","measuredW":"294","properties":{"size":"17","text":"the ones most suitable for your needs."},"typeID":"Label","x":"594","y":"2936","zOrder":"263"},{"ID":"409","measuredH":"25","measuredW":"520","properties":{"color":"13576743","size":"17","text":"Here is a good summary to get you started : https://goo.gl/D77a4K"},"typeID":"Label","x":"594","y":"2978","zOrder":"264"},{"ID":"410","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"lightbulb-o","size":"small"}},"typeID":"Icon","x":"562","y":"2979","zOrder":"265"},{"ID":"411","h":"122","measuredH":"140","measuredW":"200","properties":{"color":"16777215"},"typeID":"TextArea","w":"740","x":"543","y":"3034","zOrder":"266"},{"ID":"412","measuredH":"25","measuredW":"174","properties":{"bold":"true","size":"17","text":"Static Type Checkers"},"typeID":"Label","x":"587","y":"3053","zOrder":"267"},{"ID":"413","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"557","y":"3053","zOrder":"268"},{"ID":"414","measuredH":"21","measuredW":"14","properties":{"bold":"true","color":"16777215","text":"15"},"typeID":"Label","w":"17","x":"562","y":"3055","zOrder":"269"},{"ID":"415","measuredH":"25","measuredW":"682","properties":{"size":"17","text":"You don't need to learn these but they really give you superpowers and can be mastered"},"typeID":"Label","x":"589","y":"3083","zOrder":"270"},{"ID":"423","measuredH":"32","measuredW":"104","properties":{"align":"center","color":"16776960","size":"18","text":"TypeScript"},"typeID":"TextInput","w":"162","x":"221","y":"3040","zOrder":"271"},{"ID":"424","measuredH":"32","measuredW":"50","properties":{"align":"center","color":"16770457","size":"18","text":"Flow"},"typeID":"TextInput","w":"162","x":"221","y":"3076","zOrder":"272"},{"ID":"425","h":"15","measuredH":"14","measuredW":"191","properties":{"color":"2848996","curvature":"0","direction":"top","leftArrow":"false","p0":{"x":191,"y":14,"length":191.51240168720145},"p1":{"x":0.5395167379813742,"y":0.0033979360684618654,"length":0.5395274381637954},"p2":{"x":0,"y":0,"length":0},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"192","x":"376","y":"3055","zOrder":"16"},{"ID":"426","h":"15","measuredH":"14","measuredW":"207","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"x":207,"y":0,"length":207},"p1":{"x":0.5395167379813742,"y":0.0033979360684621147,"length":0.5395274381637954},"p2":{"x":0,"y":14,"length":14},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"208","x":"370","y":"3079","zOrder":"15"},{"ID":"427","measuredH":"25","measuredW":"576","properties":{"size":"17","text":"in a few hours. I would pick TypeScript but feel free to check both and pick."},"typeID":"Label","x":"589","y":"3108","zOrder":"273"},{"ID":"428","h":"105","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"739","x":"543","y":"3274","zOrder":"274"},{"ID":"429","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"557","y":"3289","zOrder":"275"},{"ID":"430","measuredH":"22","measuredW":"15","properties":{"bold":"true","color":"16777215","size":"14","text":"17"},"typeID":"Label","w":"16","x":"561","y":"3291","zOrder":"276"},{"ID":"431","measuredH":"26","measuredW":"150","properties":{"bold":"true","size":"18","text":"CSS Architecture"},"typeID":"Label","w":"293","x":"588","y":"3288","zOrder":"277"},{"ID":"432","measuredH":"25","measuredW":"671","properties":{"size":"17","text":"There are multiple ways to structure your CSS better and to make it more maintainable"},"typeID":"Label","x":"589","y":"3316","zOrder":"278"},{"ID":"436","measuredH":"25","measuredW":"626","properties":{"size":"17","text":"You should know about the differences – personally I find myself using BEM more"},"typeID":"Label","x":"590","y":"3341","zOrder":"279"},{"ID":"438","h":"51","measuredH":"50","measuredW":"201","properties":{"color":"2848996","curvature":"0","direction":"top","leftArrow":"false","p0":{"x":201,"y":50,"length":207.12556578076016},"p1":{"x":0.5395167379813742,"y":0.0033979360684621043,"length":0.5395274381637954},"p2":{"x":0,"y":0,"length":0},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"202","x":"386","y":"3279","zOrder":"11"},{"ID":"439","h":"73","measuredH":"72","measuredW":"184","properties":{"color":"2848996","curvature":"0","direction":"top","leftArrow":"false","p0":{"x":184,"y":72,"length":197.5854245636555},"p1":{"x":0.5479508196721311,"y":0.0024590163934426227,"length":0.5479563372577997},"p2":{"x":0,"y":0,"length":0},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"185","x":"393","y":"3247","zOrder":"12"},{"ID":"440","measuredH":"32","measuredW":"51","properties":{"align":"center","color":"16776960","size":"18","text":"BEM"},"typeID":"TextInput","w":"162","x":"231","y":"3229","zOrder":"13"},{"ID":"441","measuredH":"32","measuredW":"80","properties":{"align":"center","color":"16770457","size":"18","text":"OOCSS"},"typeID":"TextInput","w":"162","x":"231","y":"3266","zOrder":"14"},{"ID":"442","measuredH":"32","measuredW":"89","properties":{"align":"center","color":"16770457","size":"18","text":"SMACSS"},"typeID":"TextInput","w":"162","x":"231","y":"3303","zOrder":"280"},{"ID":"443","measuredH":"32","measuredW":"95","properties":{"align":"center","color":"16770457","size":"18","text":"SUITCSS"},"typeID":"TextInput","w":"162","x":"231","y":"3340","zOrder":"281"},{"ID":"444","measuredH":"32","measuredW":"69","properties":{"align":"center","color":"16770457","size":"18","text":"Atomic"},"typeID":"TextInput","w":"162","x":"232","y":"3376","zOrder":"282"},{"ID":"445","h":"16","measuredH":"15","measuredW":"181","properties":{"color":"2848996","curvature":"0","direction":"top","leftArrow":"false","p0":{"x":181,"y":15,"length":181.62048342629197},"p1":{"x":0.5395167379813742,"y":0.0033979360684621134,"length":0.5395274381637954},"p2":{"x":0,"y":0,"length":0},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"182","x":"381","y":"3315","zOrder":"10"},{"ID":"446","h":"16","measuredH":"15","measuredW":"189","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"x":189,"y":0,"length":189},"p1":{"x":0.5395167379813742,"y":0.0033979360684621165,"length":0.5395274381637954},"p2":{"x":0,"y":15,"length":15},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"190","x":"381","y":"3339","zOrder":"9"},{"ID":"447","h":"42","measuredH":"41","measuredW":"198","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"x":198,"y":0,"length":198},"p1":{"x":0.5395167379813743,"y":0.003397936068462093,"length":0.5395274381637957},"p2":{"x":0,"y":41,"length":41},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"199","x":"382","y":"3349","zOrder":"8"},{"ID":"448","h":"105","measuredH":"140","measuredW":"200","properties":{"color":"16770457"},"typeID":"TextArea","w":"739","x":"543","y":"3387","zOrder":"283"},{"ID":"451","measuredH":"26","measuredW":"187","properties":{"bold":"true","size":"18","text":"Stuff Below this point"},"typeID":"Label","w":"293","x":"562","y":"3400","zOrder":"284"},{"ID":"452","measuredH":"25","measuredW":"624","properties":{"size":"17","text":"The skills that you have got till this point should be sufficient to get you a position"},"typeID":"Label","x":"563","y":"3427","zOrder":"285"},{"ID":"453","measuredH":"25","measuredW":"486","properties":{"size":"17","text":"for any of the \"Frontend Engineering\" roles. But don't stop here!"},"typeID":"Label","x":"563","y":"3453","zOrder":"286"},{"ID":"455","h":"81","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"739","x":"544","y":"3498","zOrder":"287"},{"ID":"456","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"558","y":"3512","zOrder":"288"},{"ID":"457","measuredH":"22","measuredW":"15","properties":{"bold":"true","color":"16777215","size":"14","text":"18"},"typeID":"Label","w":"16","x":"563","y":"3514","zOrder":"289"},{"ID":"458","measuredH":"26","measuredW":"195","properties":{"bold":"true","size":"18","text":"Server Side Rendering"},"typeID":"Label","w":"293","x":"589","y":"3511","zOrder":"290"},{"ID":"459","measuredH":"25","measuredW":"531","properties":{"size":"17","text":"Learn about server side rendering in whatever framework you picked"},"typeID":"Label","x":"590","y":"3538","zOrder":"291"},{"ID":"461","measuredH":"32","measuredW":"64","properties":{"align":"center","color":"16770457","size":"18","text":"React"},"typeID":"TextInput","w":"135","x":"258","y":"3478","zOrder":"292"},{"ID":"462","h":"30","measuredH":"29","measuredW":"176","properties":{"color":"2848996","curvature":"0","direction":"top","leftArrow":"false","p0":{"x":176,"y":29,"length":178.3732042656632},"p1":{"x":0.5395167379813742,"y":0.0033979360684620896,"length":0.5395274381637954},"p2":{"x":0,"y":0,"length":0},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"177","x":"383","y":"3493","zOrder":"7"},{"ID":"463","measuredH":"32","measuredW":"80","properties":{"align":"center","color":"16770457","size":"18","text":"Angular"},"typeID":"TextInput","w":"135","x":"258","y":"3516","zOrder":"293"},{"ID":"464","h":"2","measuredH":"1","measuredW":"190","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"x":190,"y":0,"length":190},"p1":{"x":0.5395167379813743,"y":0.003397936068462092,"length":0.5395274381637957},"p2":{"x":0,"y":1,"length":1},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"191","x":"379","y":"3532","zOrder":"6"},{"ID":"465","measuredH":"32","measuredW":"71","properties":{"align":"center","color":"16776960","size":"18","text":"Next.js"},"typeID":"TextInput","w":"135","x":"91","y":"3433","zOrder":"294"},{"ID":"466","h":"36","measuredH":"35","measuredW":"89","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"x":89,"y":35,"length":95.63472172804185},"p1":{"x":0.3787677176742842,"y":-0.1675441133931154,"length":0.41416906437452733},"p2":{"x":0,"y":1,"length":1},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"90","x":"182","y":"3448","zOrder":"5"},{"ID":"467","measuredH":"32","measuredW":"72","properties":{"align":"center","color":"16770457","size":"18","text":"After.js"},"typeID":"TextInput","w":"135","x":"91","y":"3470","zOrder":"295"},{"ID":"468","h":"7","measuredH":"6","measuredW":"81","properties":{"color":"2848996","curvature":"0","direction":"top","leftArrow":"false","p0":{"x":81,"y":6,"length":81.2219182240853},"p1":{"x":0.3956343792633015,"y":-0.007730786721236948,"length":0.39570990272974865},"p2":{"x":0,"y":0,"length":0},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"82","x":"193","y":"3490","zOrder":"4"},{"ID":"469","measuredH":"32","measuredW":"90","properties":{"align":"center","color":"16770457","size":"18","text":"Universal"},"typeID":"TextInput","w":"135","x":"93","y":"3516","zOrder":"296"},{"ID":"470","h":"5","measuredH":"4","measuredW":"75","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"x":75,"y":4,"length":75.1065909225016},"p1":{"x":0.36110618684630386,"y":-0.020741003368197126,"length":0.3617013511163557},"p2":{"x":0,"y":0,"length":0},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"76","x":"199","y":"3531","zOrder":"3"},{"ID":"471","measuredH":"32","measuredW":"63","properties":{"align":"center","color":"16770457","size":"18","text":"Vue.js"},"typeID":"TextInput","w":"135","x":"259","y":"3554","zOrder":"297"},{"ID":"472","h":"29","measuredH":"28","measuredW":"204","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"x":204,"y":0,"length":204},"p1":{"x":0.539516737981374,"y":0.0033979360684621034,"length":0.5395274381637952},"p2":{"x":0,"y":28,"length":28},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"205","x":"375","y":"3542","zOrder":"2"},{"ID":"473","measuredH":"32","measuredW":"71","properties":{"align":"center","color":"16770457","size":"18","text":"Nuxt.js"},"typeID":"TextInput","w":"135","x":"93","y":"3554","zOrder":"298"},{"ID":"474","h":"4","measuredH":"3","measuredW":"75","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"x":75,"y":3,"length":75.05997601918082},"p1":{"x":0.36110618684630386,"y":-0.02074100336819713,"length":0.3617013511163557},"p2":{"x":0,"y":1,"length":1},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"76","x":"210","y":"3570","zOrder":"1"},{"ID":"475","h":"96","measuredH":"95","measuredW":"138","properties":{"color":"2848996","curvature":"1","direction":"bottom","leftArrow":"false","p0":{"x":138,"y":0},"p1":{"x":0.4996889295516926,"y":-0.07513266239707228},"p2":{"x":0,"y":95},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"139","x":"569","y":"1833","zOrder":"299"},{"ID":"476","measuredH":"32","measuredW":"69","properties":{"align":"center","color":"16776960","size":"18","text":"ESLint"},"typeID":"TextInput","w":"147","x":"449","y":"1908","zOrder":"300"},{"ID":"477","measuredH":"32","measuredW":"68","properties":{"align":"center","color":"16770457","size":"18","text":"JSLint"},"typeID":"TextInput","w":"147","x":"449","y":"1945","zOrder":"301"},{"ID":"478","measuredH":"32","measuredW":"70","properties":{"align":"center","color":"16770457","size":"18","text":"JSHint"},"typeID":"TextInput","w":"147","x":"449","y":"1983","zOrder":"302"},{"ID":"479","measuredH":"32","measuredW":"63","properties":{"align":"center","color":"16770457","size":"18","text":"JSCS"},"typeID":"TextInput","w":"147","x":"449","y":"2021","zOrder":"303"},{"ID":"480","h":"81","measuredH":"140","measuredW":"200","properties":{"color":"16777215"},"typeID":"TextArea","w":"739","x":"544","y":"3584","zOrder":"304"},{"ID":"481","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"558","y":"3598","zOrder":"305"},{"ID":"482","measuredH":"22","measuredW":"14","properties":{"bold":"true","color":"16777215","size":"14","text":"19"},"typeID":"Label","w":"16","x":"562","y":"3600","zOrder":"306"},{"ID":"483","measuredH":"26","measuredW":"185","properties":{"bold":"true","size":"18","text":"Progressive WebApps"},"typeID":"Label","w":"293","x":"589","y":"3597","zOrder":"307"},{"ID":"484","measuredH":"25","measuredW":"509","properties":{"size":"17","text":"Learn about service workers and how to make progress web apps"},"typeID":"Label","x":"590","y":"3624","zOrder":"308"},{"ID":"491","measuredH":"25","measuredW":"551","properties":{"color":"13576743","size":"17","text":"Learn how to measure and improve the performance of your application"},"typeID":"Label","x":"588","y":"2747","zOrder":"309"},{"ID":"492","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"lightbulb-o","size":"small"}},"typeID":"Icon","x":"556","y":"2751","zOrder":"310"},{"ID":"493","measuredH":"25","measuredW":"491","properties":{"color":"13576743","size":"17","text":"e.g. Interactivity Time, Page Speed Index, Lighthouse Score etc"},"typeID":"Label","x":"587","y":"2772","zOrder":"311"},{"ID":"494","h":"173","measuredH":"172","measuredW":"16","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"x":16,"y":0},"p1":{"x":0.586461126005362,"y":0.00804289544235925},"p2":{"x":0,"y":172},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"17","x":"863","y":"3637","zOrder":"0"},{"ID":"498","measuredH":"32","measuredW":"170","properties":{"bold":"true","size":"24","text":"Keep Exploring"},"typeID":"Label","x":"777","y":"3827","zOrder":"312"}]},"measuredH":"3859","measuredW":"1374","mockupH":"3812","mockupW":"1295","version":"1.0"}} \ No newline at end of file +{"mockup":{"controls":{"control":[{"ID":"0","measuredH":"40","measuredW":"149","properties":{"bold":"true","size":"32","text":"Front-end"},"typeID":"Label","x":"563","y":"121","zOrder":"59"},{"ID":"1","h":"74","measuredH":"73","measuredW":"18","properties":{"color":"2848996","curvature":"-1","direction":"bottom","leftArrow":"false","p0":{"length":8,"x":8,"y":0},"p1":{"length":0.4979530082684307,"x":0.45894941634241254,"y":0.19319066147859923},"p2":{"length":73,"x":0,"y":73},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"19","x":"637","y":"47","zOrder":"60"},{"ID":"2","h":"61","measuredH":"60","measuredW":"15","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"length":2,"x":2,"y":0},"p1":{"length":0.4752342503759216,"x":0.46391752577319545,"y":-0.1030927835051546},"p2":{"length":61.84658438426491,"x":15,"y":60},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"16","x":"626","y":"177","zOrder":"61"},{"ID":"3","measuredH":"26","measuredW":"147","properties":{"bold":"true","size":"18","text":"Learn the Basics"},"typeID":"Label","x":"589","y":"244","zOrder":"62"},{"ID":"21","measuredH":"25","measuredW":"168","properties":{"bold":"true","size":"17","text":"Basics of JavaScript"},"typeID":"Label","x":"589","y":"424","zOrder":"71"},{"ID":"24","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"556","y":"424","zOrder":"72"},{"ID":"25","measuredH":"25","measuredW":"118","properties":{"bold":"true","size":"17","text":"Basics of CSS"},"typeID":"Label","x":"589","y":"378","zOrder":"67"},{"ID":"26","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"555","y":"378","zOrder":"68"},{"ID":"27","measuredH":"25","measuredW":"100","properties":{"bold":"true","size":"17","text":"Learn HTML"},"typeID":"Label","x":"589","y":"330","zOrder":"63"},{"ID":"28","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"555","y":"330","zOrder":"64"},{"ID":"29","measuredH":"21","measuredW":"10","properties":{"bold":"true","color":"16777215","text":"1"},"typeID":"Label","x":"563","y":"332","zOrder":"65"},{"ID":"30","measuredH":"21","measuredW":"10","properties":{"bold":"true","color":"16777215","text":"2"},"typeID":"Label","w":"10","x":"563","y":"380","zOrder":"69"},{"ID":"31","measuredH":"21","measuredW":"10","properties":{"bold":"true","color":"16777215","text":"3"},"typeID":"Label","w":"10","x":"564","y":"426","zOrder":"73"},{"ID":"33","h":"41","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"250","x":"543","y":"322","zOrder":"58"},{"ID":"34","h":"55","measuredH":"54","measuredW":"9","properties":{"color":"2848996","curvature":"-1","direction":"bottom","leftArrow":"false","p0":{"length":3,"x":3,"y":0},"p1":{"length":0.529252928988914,"x":0.510715363718684,"y":0.13884696649562314},"p2":{"length":54,"x":0,"y":54},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"10","x":"655","y":"277","zOrder":"43"},{"ID":"36","h":"41","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"250","x":"543","y":"370","zOrder":"66"},{"ID":"40","h":"41","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"250","x":"544","y":"417","zOrder":"70"},{"ID":"44","h":"23","measuredH":"22","measuredW":"48","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"length":48,"x":48,"y":0},"p1":{"length":0.4652808414804901,"x":0.4652789342214823,"y":-0.001332223147377283},"p2":{"length":22,"x":0,"y":22},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"49","x":"792","y":"320","zOrder":"57"},{"ID":"45","measuredH":"25","measuredW":"322","properties":{"size":"17","text":"Don't worry about making them pretty yet"},"typeID":"Label","x":"858","y":"363","zOrder":"114"},{"ID":"46","h":"4","measuredH":"3","measuredW":"59","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"length":59,"x":59,"y":0},"p1":{"length":0.4929592777882592,"x":0.4929203539823009,"y":-0.006194690265486749},"p2":{"length":3,"x":0,"y":3},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"60","x":"794","y":"347","zOrder":"56"},{"ID":"47","measuredH":"25","measuredW":"514","properties":{"size":"17","text":"Dividing page into sections and how to structure the DOM properly"},"typeID":"Label","x":"854","y":"302","zOrder":"115"},{"ID":"48","h":"49","measuredH":"48","measuredW":"61","properties":{"color":"2848996","curvature":"1","direction":"bottom","leftArrow":"false","p0":{"length":61,"x":61,"y":0},"p1":{"length":0.4585249091872984,"x":0.45522128005575574,"y":-0.054942502032756454},"p2":{"length":48,"x":0,"y":48},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"62","x":"787","y":"285","zOrder":"54"},{"ID":"49","measuredH":"25","measuredW":"390","properties":{"size":"17","text":"Learn the basics and how to write semantic HTML"},"typeID":"Label","x":"858","y":"268","zOrder":"116"},{"ID":"56","h":"19","measuredH":"18","measuredW":"68","properties":{"color":"2848996","curvature":"1","direction":"top","leftArrow":"false","p0":{"length":70.3420215802759,"x":68,"y":18},"p1":{"length":0.4579653787384571,"x":0.45747670462949247,"y":0.021150717349504505},"p2":{"length":0,"x":0,"y":0},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"69","x":"787","y":"356","zOrder":"55"},{"ID":"57","measuredH":"25","measuredW":"386","properties":{"size":"17","text":"Make at least 5 HTML pages – focus on structure"},"typeID":"Label","x":"859","y":"335","zOrder":"117"},{"ID":"59","h":"66","measuredH":"65","measuredW":"112","properties":{"color":"2848996","curvature":"1","direction":"top","leftArrow":"false","p0":{"length":0,"x":0,"y":0},"p1":{"length":0.47314423386375903,"x":0.47200190828314154,"y":0.03285825034289463},"p2":{"length":129.49517365523704,"x":112,"y":65},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"113","x":"438","y":"320","zOrder":"53"},{"ID":"60","measuredH":"25","measuredW":"191","properties":{"size":"17","text":"Learn the basics of CSS"},"typeID":"Label","x":"238","y":"303","zOrder":"74"},{"ID":"63","h":"43","measuredH":"42","measuredW":"124","properties":{"color":"2848996","curvature":"1","direction":"top","leftArrow":"false","p0":{"length":0,"x":0,"y":0},"p1":{"length":0.4354479714301555,"x":0.4346557759626609,"y":0.026254375729288137},"p2":{"length":130.91982279242512,"x":124,"y":42},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"125","x":"436","y":"352","zOrder":"52"},{"ID":"67","h":"13","measuredH":"12","measuredW":"119","properties":{"color":"2848996","curvature":"1","direction":"top","leftArrow":"false","p0":{"length":1,"x":0,"y":1},"p1":{"length":0.42921590082087,"x":0.42861896838602337,"y":0.022628951747088195},"p2":{"length":119.60351165413162,"x":119,"y":12},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"120","x":"440","y":"385","zOrder":"51"},{"ID":"68","measuredH":"25","measuredW":"268","properties":{"size":"17","text":"Learn how to use Grid and Flexbox"},"typeID":"Label","x":"162","y":"338","zOrder":"75"},{"ID":"70","measuredH":"25","measuredW":"318","properties":{"size":"17","text":"Media Queries and Responsive Websites"},"typeID":"Label","x":"113","y":"371","zOrder":"76"},{"ID":"83","h":"20","measuredH":"19","measuredW":"71","properties":{"color":"2848996","curvature":"1","direction":"bottom","leftArrow":"false","p0":{"length":19,"x":0,"y":19},"p1":{"length":0.4406669241308615,"x":0.43817104776008886,"y":-0.04683450573861533},"p2":{"length":71,"x":71,"y":0},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"72","x":"478","y":"397","zOrder":"50"},{"ID":"85","measuredH":"25","measuredW":"378","properties":{"size":"17","text":"Style the HTML Pages that you made in last step"},"typeID":"Label","x":"93","y":"404","zOrder":"77"},{"ID":"86","h":"4","measuredH":"3","measuredW":"53","properties":{"color":"2848996","curvature":"1","direction":"top","leftArrow":"false","p0":{"length":3,"x":0,"y":3},"p1":{"length":0.4600856791042167,"x":0.4583941605839416,"y":0.03941605839416058},"p2":{"length":53.08483775994799,"x":53,"y":3},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"54","x":"797","y":"422","zOrder":"48"},{"ID":"88","measuredH":"25","measuredW":"301","properties":{"size":"17","text":"Learn the syntax and basic constructs"},"typeID":"Label","x":"855","y":"414","zOrder":"118"},{"ID":"89","measuredH":"25","measuredW":"233","properties":{"size":"17","text":"Learn how to manipulate DOM"},"typeID":"Label","x":"855","y":"442","zOrder":"119"},{"ID":"90","h":"16","measuredH":"15","measuredW":"55","properties":{"color":"2848996","curvature":"1","direction":"top","leftArrow":"false","p0":{"length":0,"x":0,"y":0},"p1":{"length":0.45653907041455166,"x":0.45488081725312146,"y":0.03887627695800227},"p2":{"length":57.0087712549569,"x":55,"y":15},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"56","x":"794","y":"437","zOrder":"49"},{"ID":"91","h":"62","measuredH":"61","measuredW":"67","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"length":0,"x":0,"y":0},"p1":{"length":0.5281388123911577,"x":0.5199305086381621,"y":-0.09275166489721068},"p2":{"length":90.60905032059436,"x":67,"y":61},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"68","x":"786","y":"449","zOrder":"46"},{"ID":"92","measuredH":"25","measuredW":"476","properties":{"size":"17","text":"Understand the concepts such as hoisting, event bubbling etc"},"typeID":"Label","x":"850","y":"471","zOrder":"120"},{"ID":"93","h":"38","measuredH":"37","measuredW":"56","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"length":0,"x":0,"y":0},"p1":{"length":0.5310495030226782,"x":0.5300904977375566,"y":-0.03190045248868781},"p2":{"length":67.11929677819934,"x":56,"y":37},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"57","x":"789","y":"441","zOrder":"47"},{"ID":"94","measuredH":"25","measuredW":"445","properties":{"size":"17","text":"Learn ES6+ new features and writing modular JavaScript"},"typeID":"Label","x":"858","y":"535","zOrder":"121"},{"ID":"95","h":"94","measuredH":"93","measuredW":"74","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"length":0,"x":0,"y":0},"p1":{"length":0.5490011385437095,"x":0.5330996249796185,"y":-0.13117560736996578},"p2":{"length":118.84864324004712,"x":74,"y":93},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"75","x":"778","y":"448","zOrder":"45"},{"ID":"96","measuredH":"25","measuredW":"137","properties":{"size":"17","text":"Learn Ajax (XHR)"},"typeID":"Label","x":"858","y":"504","zOrder":"122"},{"ID":"98","h":"41","measuredH":"140","measuredW":"200","properties":{"borderColor":"13576743","color":"16777215"},"typeID":"TextArea","w":"325","x":"153","y":"512","zOrder":"78"},{"ID":"102","measuredH":"25","measuredW":"146","properties":{"bold":"true","color":"0","size":"17","text":"jQuery – Optional"},"typeID":"Label","x":"167","y":"520","zOrder":"79"},{"ID":"108","h":"202","measuredH":"200","measuredW":"48","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"length":15,"x":15,"y":0},"p1":{"length":0.4723872861411133,"x":0.452773248314634,"y":-0.13470758597191462},"p2":{"length":205.67936211491903,"x":48,"y":200},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"50","x":"622","y":"454","zOrder":"44"},{"ID":"109","h":"2","measuredH":"1","measuredW":"136","properties":{"color":"2848996","curvature":"0","direction":"top","leftArrow":"false","p0":{"length":0,"x":0,"y":0},"p1":{"length":0.5074062205613563,"x":0.5073529411764706,"y":-0.007352941176470588},"p2":{"length":136,"x":136,"y":0},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"137","x":"489","y":"531","zOrder":"80"},{"ID":"111","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"613","y":"519","zOrder":"81"},{"ID":"112","h":"41","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"767","x":"314","y":"593","zOrder":"82"},{"ID":"114","measuredH":"25","measuredW":"574","properties":{"size":"17","text":"Make some responsive website and add some interactivity with JavaScript"},"typeID":"Label","x":"356","y":"601","zOrder":"83"},{"ID":"115","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"324","y":"601","zOrder":"84"},{"ID":"116","measuredH":"21","measuredW":"10","properties":{"bold":"true","color":"16777215","text":"4"},"typeID":"Label","w":"10","x":"332","y":"603","zOrder":"85"},{"ID":"117","h":"36","measuredH":"107","measuredW":"205","properties":{"color":"13576743"},"typeID":"ScratchOut","w":"66","x":"409","y":"514","zOrder":"86"},{"ID":"118","h":"178","measuredH":"140","measuredW":"200","properties":{"color":"16777215"},"typeID":"TextArea","w":"767","x":"314","y":"641","zOrder":"87"},{"ID":"119","measuredH":"25","measuredW":"678","properties":{"bold":"true","size":"17","text":"Search projects on Github and open a few PRs. Some of the ideas are listed below :"},"typeID":"Label","x":"356","y":"655","zOrder":"88"},{"ID":"120","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"325","y":"656","zOrder":"89"},{"ID":"121","measuredH":"21","measuredW":"10","properties":{"bold":"true","color":"16777215","text":"5"},"typeID":"Label","w":"10","x":"333","y":"658","zOrder":"90"},{"ID":"125","measuredH":"25","measuredW":"564","properties":{"size":"17","text":"Enhance the UI, make any demo pages responsive or improve the design"},"typeID":"Label","x":"356","y":"684","zOrder":"91"},{"ID":"126","measuredH":"25","measuredW":"339","properties":{"size":"17","text":"Look for any open issues that you can solve"},"typeID":"Label","x":"356","y":"711","zOrder":"92"},{"ID":"127","measuredH":"25","measuredW":"672","properties":{"size":"17","text":"Refactor any of the code or implement the best practices that you learnt along the way"},"typeID":"Label","x":"356","y":"738","zOrder":"93"},{"ID":"129","measuredH":"23","measuredW":"703","properties":{"bold":"true","color":"10027263","size":"15","text":"Link this repo, tell them you are learning and ask for feedback on your PR and how you can improve"},"typeID":"Label","x":"356","y":"777","zOrder":"94"},{"ID":"130","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"lightbulb-o","size":"small"}},"typeID":"Icon","x":"325","y":"776","zOrder":"95"},{"ID":"131","measuredH":"32","measuredW":"32","properties":{"color":"10027263","icon":{"ID":"github","size":"medium"}},"typeID":"Icon","x":"920","y":"81","zOrder":"96"},{"ID":"132","measuredH":"25","measuredW":"295","properties":{"bold":"true","color":"10027263","size":"17","text":"kamranahmedse/developer-roadmap"},"typeID":"Label","x":"959","y":"85","zOrder":"97"},{"ID":"140","h":"135","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"767","x":"314","y":"827","zOrder":"98"},{"ID":"141","measuredH":"25","measuredW":"443","properties":{"bold":"true","size":"17","text":"Give yourself a pat on the back. You are getting there :"},"typeID":"Label","x":"355","y":"842","zOrder":"99"},{"ID":"142","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"325","y":"842","zOrder":"100"},{"ID":"143","measuredH":"21","measuredW":"10","properties":{"bold":"true","color":"16777215","text":"6"},"typeID":"Label","w":"10","x":"333","y":"844","zOrder":"101"},{"ID":"149","measuredH":"25","measuredW":"629","properties":{"size":"17","text":"There are many jobs out there requiring the skillset that you have got till this point"},"typeID":"Label","x":"356","y":"868","zOrder":"102"},{"ID":"150","measuredH":"25","measuredW":"629","properties":{"size":"17","text":"You can easily start getting some freelance work or find yourself a job if you may."},"typeID":"Label","x":"356","y":"893","zOrder":"103"},{"ID":"153","measuredH":"25","measuredW":"690","properties":{"size":"17","text":"However, don't stop here, there is still a long way to go if you want to have a better career"},"typeID":"Label","x":"357","y":"919","zOrder":"104"},{"ID":"155","h":"265","measuredH":"264","measuredW":"76","properties":{"color":"2848996","curvature":"1","direction":"bottom","leftArrow":"false","p0":{"length":76,"x":76,"y":0},"p1":{"length":0.5074530613720352,"x":0.4565573307740078,"y":-0.2215039801275899},"p2":{"length":267.3200329193456,"x":42,"y":264},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"77","x":"237","y":"743","zOrder":"41"},{"ID":"156","measuredH":"25","measuredW":"339","properties":{"bold":"true","size":"17","text":"Optional – Needs some knowledge of `git`"},"typeID":"Label","x":"294","y":"1015","zOrder":"105"},{"ID":"157","measuredH":"25","measuredW":"346","properties":{"size":"17","text":"This part is optional, I added it here because"},"typeID":"Label","x":"295","y":"1043","zOrder":"106"},{"ID":"158","measuredH":"25","measuredW":"384","properties":{"size":"17","text":"it is a great way to learn and find out if you are on"},"typeID":"Label","x":"295","y":"1067","zOrder":"107"},{"ID":"159","measuredH":"25","measuredW":"399","properties":{"size":"17","text":"the right track or not. You will be amazed to find out"},"typeID":"Label","x":"294","y":"1092","zOrder":"108"},{"ID":"160","measuredH":"25","measuredW":"335","properties":{"size":"17","text":"how much people are willing to help you out."},"typeID":"Label","x":"295","y":"1117","zOrder":"109"},{"ID":"161","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"lightbulb-o","size":"small"}},"typeID":"Icon","x":"290","y":"1156","zOrder":"110"},{"ID":"162","measuredH":"23","measuredW":"366","properties":{"bold":"true","color":"10027263","size":"15","text":"Don't be scared of git, it is easiest of all the things"},"typeID":"Label","x":"322","y":"1153","zOrder":"111"},{"ID":"164","measuredH":"23","measuredW":"359","properties":{"bold":"true","color":"10027263","size":"15","text":"that you have learnt above. You can get the basics"},"typeID":"Label","x":"322","y":"1174","zOrder":"112"},{"ID":"165","h":"245","measuredH":"140","measuredW":"200","properties":{"color":"16770457"},"typeID":"TextArea","w":"427","x":"278","y":"1001","zOrder":"42"},{"ID":"167","measuredH":"23","measuredW":"292","properties":{"bold":"true","color":"10027263","size":"15","text":"in the few hours and do the rest later on"},"typeID":"Label","x":"322","y":"1195","zOrder":"113"},{"ID":"169","h":"381","measuredH":"380","measuredW":"68","properties":{"color":"2848996","curvature":"-1","direction":"bottom","leftArrow":"false","p0":{"x":5,"y":0},"p1":{"x":0.51012414933679,"y":0.17392640436254733},"p2":{"x":0,"y":380},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"69","x":"727","y":"917","zOrder":"40"},{"ID":"170","h":"136","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"543","x":"310","y":"1594","zOrder":"123"},{"ID":"172","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"323","y":"1610","zOrder":"124"},{"ID":"173","measuredH":"22","measuredW":"10","properties":{"bold":"true","color":"16777215","size":"14","text":"9"},"typeID":"Label","w":"19","x":"330","y":"1612","zOrder":"125"},{"ID":"174","measuredH":"26","measuredW":"167","properties":{"bold":"true","size":"18","text":"CSS Preprocessors"},"typeID":"Label","w":"199","x":"356","y":"1610","zOrder":"126"},{"ID":"175","measuredH":"32","measuredW":"56","properties":{"align":"center","color":"16776960","size":"18","text":"Sass"},"typeID":"TextInput","w":"136","x":"284","y":"1369","zOrder":"127"},{"ID":"176","measuredH":"32","measuredW":"55","properties":{"align":"center","color":"16777215","size":"18","text":"Less"},"typeID":"TextInput","w":"136","x":"284","y":"1445","zOrder":"128"},{"ID":"177","measuredH":"32","measuredW":"66","properties":{"align":"center","color":"16777215","size":"18","text":"Stylus"},"typeID":"TextInput","w":"136","x":"284","y":"1483","zOrder":"129"},{"ID":"178","measuredH":"32","measuredW":"88","properties":{"align":"center","color":"16776960","size":"18","text":"PostCSS"},"typeID":"TextInput","w":"136","x":"284","y":"1406","zOrder":"130"},{"ID":"180","measuredH":"25","measuredW":"450","properties":{"size":"17","text":"Preprocessors let you add functionality on top of CSS and"},"typeID":"Label","x":"356","y":"1638","zOrder":"131"},{"ID":"181","measuredH":"25","measuredW":"459","properties":{"size":"17","text":"let you do things that CSS can't. Have a look at any of them"},"typeID":"Label","x":"356","y":"1663","zOrder":"132"},{"ID":"182","measuredH":"25","measuredW":"441","properties":{"size":"17","text":"and see what they have to offer and pick the suitable one"},"typeID":"Label","x":"356","y":"1689","zOrder":"133"},{"ID":"184","h":"8","measuredH":"7","measuredW":"204","properties":{"color":"2848996","curvature":"1","direction":"bottom","leftArrow":"false","p0":{"length":204.00980368599937,"x":204,"y":2},"p1":{"length":0.4189940316033579,"x":0.4186861064441723,"y":-0.01606059743144346},"p2":{"length":7,"x":0,"y":7},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"205","x":"815","y":"1655","zOrder":"39"},{"ID":"185","h":"187","measuredH":"140","measuredW":"200","properties":{"color":"16770457"},"typeID":"TextArea","w":"408","x":"915","y":"1564","zOrder":"134"},{"ID":"196","measuredH":"25","measuredW":"157","properties":{"bold":"true","size":"17","text":"Learn Sass for now"},"typeID":"Label","x":"928","y":"1576","zOrder":"135"},{"ID":"197","measuredH":"25","measuredW":"411","properties":{"size":"17","text":"You do not need rollup for now and can do everything"},"typeID":"Label","x":"919","y":"1945","zOrder":"194"},{"ID":"198","measuredH":"25","measuredW":"370","properties":{"size":"17","text":"PostCSS is a nice-to-have and is sort of \"Babel\""},"typeID":"Label","x":"930","y":"1633","zOrder":"136"},{"ID":"199","measuredH":"25","measuredW":"335","properties":{"size":"17","text":"for CSS. You can use it on top of Sass also."},"typeID":"Label","x":"930","y":"1658","zOrder":"137"},{"ID":"200","measuredH":"25","measuredW":"240","properties":{"size":"17","text":"Sass and revisit PostCSS later"},"typeID":"Label","x":"930","y":"1712","zOrder":"138"},{"ID":"202","measuredH":"25","measuredW":"323","properties":{"size":"17","text":"However, I would recommend you to learn "},"typeID":"Label","x":"930","y":"1684","zOrder":"139"},{"ID":"204","h":"97","measuredH":"96","measuredW":"21","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"length":11,"x":11,"y":0},"p1":{"length":0.5588009305954578,"x":0.5354229282954058,"y":-0.15993988836410478},"p2":{"length":98.2700361249552,"x":21,"y":96},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"22","x":"559","y":"1515","zOrder":"38"},{"ID":"210","h":"52","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"344","x":"527","y":"1273","zOrder":"140"},{"ID":"211","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"538","y":"1285","zOrder":"141"},{"ID":"212","measuredH":"22","measuredW":"10","properties":{"bold":"true","color":"16777215","size":"14","text":"7"},"typeID":"Label","w":"12","x":"546","y":"1286","zOrder":"142"},{"ID":"213","measuredH":"26","measuredW":"39","properties":{"bold":"true","size":"18","text":"NPM"},"typeID":"Label","w":"47","x":"901","y":"1286","zOrder":"145"},{"ID":"215","h":"52","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"89","x":"876","y":"1273","zOrder":"143"},{"ID":"216","measuredH":"26","measuredW":"159","properties":{"bold":"true","size":"18","text":"Package Managers"},"typeID":"Label","w":"199","x":"572","y":"1285","zOrder":"144"},{"ID":"217","h":"52","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"89","x":"969","y":"1273","zOrder":"146"},{"ID":"218","measuredH":"26","measuredW":"38","properties":{"bold":"true","size":"18","text":"Yarn"},"typeID":"Label","w":"47","x":"991","y":"1286","zOrder":"147"},{"ID":"219","h":"80","measuredH":"79","measuredW":"67","properties":{"color":"2848996","curvature":"1","direction":"bottom","leftArrow":"false","p0":{"length":67,"x":67,"y":0},"p1":{"length":0.5230534443633628,"x":0.5075471698113209,"y":-0.1264150943396224},"p2":{"length":79,"x":0,"y":79},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"68","x":"805","y":"1202","zOrder":"37"},{"ID":"220","h":"225","measuredH":"140","measuredW":"200","properties":{"color":"16770457"},"typeID":"TextArea","w":"417","x":"845","y":"1001","zOrder":"148"},{"ID":"222","measuredH":"25","measuredW":"334","properties":{"size":"17","text":"Package managers help you bring external "},"typeID":"Label","x":"861","y":"1051","zOrder":"149"},{"ID":"223","measuredH":"25","measuredW":"354","properties":{"size":"17","text":"libraries and plugins into your projects, so that"},"typeID":"Label","x":"861","y":"1077","zOrder":"150"},{"ID":"224","measuredH":"25","measuredW":"386","properties":{"size":"17","text":"you don't have to worry about copying the libraries"},"typeID":"Label","x":"861","y":"1103","zOrder":"151"},{"ID":"226","measuredH":"25","measuredW":"384","properties":{"size":"17","text":"manually or go through the hassle of updating etc"},"typeID":"Label","x":"861","y":"1129","zOrder":"152"},{"ID":"227","measuredH":"25","measuredW":"286","properties":{"size":"17","text":"Both are almost same, there are just "},"typeID":"Label","x":"861","y":"1156","zOrder":"153"},{"ID":"229","measuredH":"25","measuredW":"316","properties":{"size":"17","text":"implementation differences; just pick any."},"typeID":"Label","x":"861","y":"1181","zOrder":"154"},{"ID":"230","h":"202","measuredH":"140","measuredW":"200","properties":{"color":"16777215"},"typeID":"TextArea","w":"759","x":"527","y":"1331","zOrder":"155"},{"ID":"231","measuredH":"25","measuredW":"425","properties":{"bold":"true","size":"17","text":"Install some external dependency in your application"},"typeID":"Label","x":"572","y":"1349","zOrder":"156"},{"ID":"232","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"541","y":"1350","zOrder":"157"},{"ID":"233","measuredH":"21","measuredW":"10","properties":{"bold":"true","color":"16777215","text":"8"},"typeID":"Label","w":"10","x":"549","y":"1352","zOrder":"158"},{"ID":"234","measuredH":"25","measuredW":"622","properties":{"size":"17","text":"Go ahead and install some external library in the webpages that you made above"},"typeID":"Label","x":"572","y":"1376","zOrder":"159"},{"ID":"237","measuredH":"25","measuredW":"683","properties":{"size":"17","text":"e.g. install some toast plugin and when user clicks a button, show him the toast message"},"typeID":"Label","x":"572","y":"1402","zOrder":"160"},{"ID":"238","measuredH":"25","measuredW":"665","properties":{"size":"17","text":"or create a login form and do the form validation using some form validation library and"},"typeID":"Label","x":"572","y":"1429","zOrder":"161"},{"ID":"239","measuredH":"25","measuredW":"510","properties":{"size":"17","text":"play with different options and see how to install different versions"},"typeID":"Label","x":"573","y":"1454","zOrder":"162"},{"ID":"242","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"lightbulb-o","size":"small"}},"typeID":"Icon","x":"545","y":"1489","zOrder":"163"},{"ID":"243","measuredH":"23","measuredW":"230","properties":{"bold":"true","color":"10027263","size":"15","text":"Read about semantic versioning"},"typeID":"Label","x":"573","y":"1490","zOrder":"164"},{"ID":"244","h":"116","measuredH":"115","measuredW":"22","properties":{"color":"2848996","curvature":"1","direction":"top","leftArrow":"false","p0":{"length":117.08543888972702,"x":22,"y":115},"p1":{"length":0.5349115625926845,"x":0.5263097382439734,"y":0.09554286590273256},"p2":{"length":5,"x":5,"y":0},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"23","x":"332","y":"1499","zOrder":"36"},{"ID":"245","h":"105","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"584","x":"543","y":"3164","zOrder":"165"},{"ID":"246","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"557","y":"3190","zOrder":"166"},{"ID":"247","measuredH":"22","measuredW":"15","properties":{"bold":"true","color":"16777215","size":"14","text":"16"},"typeID":"Label","w":"16","x":"561","y":"3192","zOrder":"167"},{"ID":"248","measuredH":"26","measuredW":"282","properties":{"bold":"true","size":"18","text":"CSS Framework – Pick Bootstrap"},"typeID":"Label","w":"293","x":"588","y":"3189","zOrder":"168"},{"ID":"251","measuredH":"25","measuredW":"489","properties":{"size":"17","text":"You really don't need to learn any but still they are good to have"},"typeID":"Label","x":"589","y":"3217","zOrder":"169"},{"ID":"254","measuredH":"32","measuredW":"92","properties":{"align":"center","color":"16776960","size":"18","text":"Bootstrap"},"typeID":"TextInput","w":"149","x":"1134","y":"3164","zOrder":"170"},{"ID":"255","measuredH":"32","measuredW":"146","properties":{"align":"center","color":"16770457","size":"18","text":"Materialize CSS"},"typeID":"TextInput","w":"149","x":"1134","y":"3201","zOrder":"171"},{"ID":"256","measuredH":"32","measuredW":"64","properties":{"align":"center","color":"16770457","size":"18","text":"Bulma"},"typeID":"TextInput","w":"150","x":"1133","y":"3237","zOrder":"172"},{"ID":"260","measuredH":"25","measuredW":"357","properties":{"bold":"true","size":"17","text":"Learn one, you automatically learn the other"},"typeID":"Label","x":"861","y":"1018","zOrder":"173"},{"ID":"267","h":"84","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"543","x":"696","y":"1781","zOrder":"174"},{"ID":"268","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"709","y":"1797","zOrder":"175"},{"ID":"269","measuredH":"22","measuredW":"15","properties":{"bold":"true","color":"16777215","size":"14","text":"10"},"typeID":"Label","w":"19","x":"713","y":"1799","zOrder":"176"},{"ID":"270","measuredH":"26","measuredW":"90","properties":{"bold":"true","size":"18","text":"Build tools"},"typeID":"Label","w":"101","x":"742","y":"1796","zOrder":"177"},{"ID":"271","measuredH":"25","measuredW":"450","properties":{"size":"17","text":"Tools to help you in the building/bundling and development"},"typeID":"Label","x":"742","y":"1822","zOrder":"178"},{"ID":"274","h":"140","measuredH":"139","measuredW":"111","properties":{"color":"2848996","curvature":"1","direction":"top","leftArrow":"false","p0":{"length":0,"x":0,"y":0},"p1":{"length":0.5522448742292186,"x":0.5380822956829531,"y":0.12426521711649068},"p2":{"length":177.88198334851114,"x":111,"y":139},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"112","x":"607","y":"1670","zOrder":"35"},{"ID":"275","h":"12","measuredH":"11","measuredW":"112","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"x":112,"y":11},"p1":{"x":0.6096633663366336,"y":-0.031366336633663366},"p2":{"x":0,"y":2},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"113","x":"603","y":"1803","zOrder":"34"},{"ID":"276","measuredH":"32","measuredW":"116","properties":{"align":"center","color":"16776960","size":"18","text":"NPM Scripts"},"typeID":"TextInput","w":"147","x":"471","y":"1790","zOrder":"179"},{"ID":"278","measuredH":"32","measuredW":"52","properties":{"align":"center","color":"16770457","size":"18","text":"Gulp"},"typeID":"TextInput","w":"147","x":"471","y":"1827","zOrder":"180"},{"ID":"280","h":"188","measuredH":"140","measuredW":"200","properties":{"color":"16770457"},"typeID":"TextArea","w":"261","x":"153","y":"1741","zOrder":"181"},{"ID":"281","measuredH":"25","measuredW":"109","properties":{"bold":"true","size":"17","text":"Task Runners"},"typeID":"Label","x":"167","y":"1756","zOrder":"182"},{"ID":"282","measuredH":"25","measuredW":"352","properties":{"size":"17","text":"I would recommend you to learn Sass for now"},"typeID":"Label","x":"930","y":"1608","zOrder":"183"},{"ID":"283","measuredH":"25","measuredW":"178","properties":{"size":"17","text":"in 2018. However, if you"},"typeID":"Label","x":"167","y":"1810","zOrder":"184"},{"ID":"284","measuredH":"25","measuredW":"216","properties":{"size":"17","text":"want to pick something else"},"typeID":"Label","x":"167","y":"1835","zOrder":"185"},{"ID":"285","measuredH":"25","measuredW":"225","properties":{"size":"17","text":"look at Gulp and see how you"},"typeID":"Label","x":"167","y":"1863","zOrder":"186"},{"ID":"286","measuredH":"25","measuredW":"143","properties":{"size":"17","text":"can benefit from it"},"typeID":"Label","x":"167","y":"1890","zOrder":"187"},{"ID":"287","h":"12","measuredH":"11","measuredW":"142","properties":{"color":"2848996","curvature":"1","direction":"top","leftArrow":"false","p0":{"length":142.35167719419397,"x":142,"y":10},"p1":{"length":0.5208523098853179,"x":0.5196039603960396,"y":0.03603960396039605},"p2":{"length":0,"x":0,"y":0},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"143","x":"340","y":"1796","zOrder":"33"},{"ID":"289","h":"68","measuredH":"67","measuredW":"2","properties":{"color":"2848996","curvature":"-1","direction":"bottom","leftArrow":"false","p0":{"length":1,"x":1,"y":0},"p1":{"length":0.5184985808036734,"x":0.517950123321458,"y":0.023842148533844896},"p2":{"length":67,"x":0,"y":67},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"3","x":"781","y":"1840","zOrder":"32"},{"ID":"290","measuredH":"32","measuredW":"90","properties":{"align":"center","color":"16776960","size":"18","text":"Webpack"},"typeID":"TextInput","w":"147","x":"726","y":"1903","zOrder":"188"},{"ID":"291","measuredH":"32","measuredW":"64","properties":{"align":"center","color":"16770457","size":"18","text":"Rollup"},"typeID":"TextInput","w":"147","x":"726","y":"1940","zOrder":"189"},{"ID":"292","measuredH":"32","measuredW":"64","properties":{"align":"center","color":"16777215","size":"18","text":"Parcel"},"typeID":"TextInput","w":"147","x":"726","y":"1978","zOrder":"190"},{"ID":"293","h":"113","measuredH":"140","measuredW":"200","properties":{"color":"16770457","text":""},"typeID":"TextArea","w":"453","x":"905","y":"1900","zOrder":"191"},{"ID":"295","measuredH":"25","measuredW":"343","properties":{"bold":"true","size":"17","text":"Use Webpack for apps, Rollup for libraries!"},"typeID":"Label","x":"919","y":"1914","zOrder":"192"},{"ID":"296","measuredH":"25","measuredW":"227","properties":{"size":"17","text":"I would just pick NPM Scripts"},"typeID":"Label","x":"167","y":"1784","zOrder":"193"},{"ID":"297","measuredH":"25","measuredW":"369","properties":{"size":"17","text":"with webpack but feel free to revisit Rollup later"},"typeID":"Label","x":"920","y":"1972","zOrder":"195"},{"ID":"298","h":"23","measuredH":"22","measuredW":"146","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"length":147.648230602334,"x":146,"y":22},"p1":{"length":0.4526052199748856,"x":0.4467326732673264,"y":-0.07267326732673271},"p2":{"length":3,"x":0,"y":3},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"147","x":"800","y":"1917","zOrder":"31"},{"ID":"299","h":"244","measuredH":"243","measuredW":"52","properties":{"color":"2848996","curvature":"1","direction":"bottom","leftArrow":"false","p0":{"length":52,"x":52,"y":0},"p1":{"length":0.5130043099795483,"x":0.471276613180796,"y":-0.2026617278284945},"p2":{"length":247.50353532828575,"x":47,"y":243},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"53","x":"657","y":"1848","zOrder":"30"},{"ID":"305","h":"176","measuredH":"140","measuredW":"200","properties":{"color":"16777215"},"typeID":"TextArea","w":"775","x":"484","y":"2085","zOrder":"196"},{"ID":"306","measuredH":"25","measuredW":"291","properties":{"bold":"true","size":"17","text":"Create something – Maybe a library"},"typeID":"Label","x":"530","y":"2104","zOrder":"197"},{"ID":"307","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"499","y":"2105","zOrder":"198"},{"ID":"308","measuredH":"21","measuredW":"11","properties":{"bold":"true","color":"16777215","text":"11"},"typeID":"Label","w":"10","x":"505","y":"2107","zOrder":"199"},{"ID":"309","measuredH":"25","measuredW":"660","properties":{"size":"17","text":"Congrats! You can call yourself 75% modern JavaScript developer now. Now go ahead"},"typeID":"Label","x":"530","y":"2133","zOrder":"200"},{"ID":"310","measuredH":"25","measuredW":"653","properties":{"size":"17","text":"and create something with all that you have learnt. Maybe create some sort of library"},"typeID":"Label","x":"530","y":"2161","zOrder":"201"},{"ID":"315","measuredH":"25","measuredW":"692","properties":{"size":"17","text":"in which you have to use Sass and JavaScript. Then use webpack to convert Sass to CSS"},"typeID":"Label","x":"530","y":"2190","zOrder":"202"},{"ID":"316","measuredH":"25","measuredW":"703","properties":{"size":"17","text":"and use babel to transpile ES6 code. Once you are done with, release it on Github and npm"},"typeID":"Label","x":"530","y":"2217","zOrder":"203"},{"ID":"317","measuredH":"32","measuredW":"32","properties":{"color":"10027263","icon":{"ID":"twitter","size":"medium"}},"typeID":"Icon","x":"920","y":"127","zOrder":"204"},{"ID":"318","measuredH":"25","measuredW":"133","properties":{"bold":"true","color":"10027263","size":"17","text":"kamranahmedse"},"typeID":"Label","x":"960","y":"132","zOrder":"205"},{"ID":"319","h":"82","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"319","x":"534","y":"2299","zOrder":"206"},{"ID":"320","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"547","y":"2315","zOrder":"207"},{"ID":"321","measuredH":"22","measuredW":"15","properties":{"bold":"true","color":"16777215","size":"14","text":"12"},"typeID":"Label","w":"19","x":"551","y":"2317","zOrder":"208"},{"ID":"322","measuredH":"26","measuredW":"149","properties":{"bold":"true","size":"18","text":"Pick a Framework"},"typeID":"Label","w":"175","x":"580","y":"2314","zOrder":"209"},{"ID":"323","measuredH":"25","measuredW":"174","properties":{"size":"17","text":"React, Angular or Vue"},"typeID":"Label","w":"184","x":"580","y":"2340","zOrder":"210"},{"ID":"324","h":"116","measuredH":"115","measuredW":"15","properties":{"color":"2848996","curvature":"-1","direction":"bottom","leftArrow":"false","p0":{"length":1,"x":1,"y":0},"p1":{"length":0.5526834034990115,"x":0.5380311507636474,"y":0.12641766218055345},"p2":{"length":115,"x":0,"y":115},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"16","x":"763","y":"2193","zOrder":"29"},{"ID":"325","h":"11","measuredH":"10","measuredW":"114","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"length":114,"x":114,"y":0},"p1":{"length":0.47389069258171473,"x":0.47388515577275503,"y":0.002290775809407418},"p2":{"length":10,"x":0,"y":10},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"115","x":"460","y":"2313","zOrder":"28"},{"ID":"326","measuredH":"32","measuredW":"82","properties":{"align":"center","color":"16776960","size":"18","text":"React.js"},"typeID":"TextInput","w":"147","x":"324","y":"2307","zOrder":"211"},{"ID":"327","measuredH":"32","measuredW":"67","properties":{"align":"center","color":"16776960","size":"18","text":"Redux"},"typeID":"TextInput","w":"176","x":"167","y":"2049","zOrder":"212"},{"ID":"328","measuredH":"32","measuredW":"58","properties":{"align":"center","color":"16776960","size":"18","text":"Mobx"},"typeID":"TextInput","w":"176","x":"167","y":"2088","zOrder":"213"},{"ID":"329","h":"208","measuredH":"140","measuredW":"200","properties":{"color":"16777215"},"typeID":"TextArea","w":"205","x":"153","y":"2032","zOrder":"27"},{"ID":"330","measuredH":"25","measuredW":"173","properties":{"size":"17","text":"These are not specific"},"typeID":"Label","x":"167","y":"2130","zOrder":"214"},{"ID":"331","measuredH":"25","measuredW":"166","properties":{"size":"17","text":"to React though, you "},"typeID":"Label","x":"167","y":"2153","zOrder":"215"},{"ID":"332","measuredH":"25","measuredW":"161","properties":{"size":"17","text":"can use them in any "},"typeID":"Label","x":"167","y":"2177","zOrder":"216"},{"ID":"333","measuredH":"25","measuredW":"136","properties":{"size":"17","text":"framework or app"},"typeID":"Label","x":"167","y":"2201","zOrder":"217"},{"ID":"334","h":"96","measuredH":"95","measuredW":"88","properties":{"color":"2848996","curvature":"1","direction":"top","leftArrow":"false","p0":{"length":129.49517365523704,"x":88,"y":95},"p1":{"length":0.5172220165005103,"x":0.45524634313777257,"y":0.2454982309763954},"p2":{"length":0,"x":0,"y":0},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"89","x":"238","y":"2227","zOrder":"26"},{"ID":"335","measuredH":"32","measuredW":"63","properties":{"align":"center","color":"16776960","size":"18","text":"Vue.js"},"typeID":"TextInput","w":"147","x":"324","y":"2346","zOrder":"218"},{"ID":"336","measuredH":"32","measuredW":"80","properties":{"align":"center","color":"16776960","size":"18","text":"Angular"},"typeID":"TextInput","w":"147","x":"324","y":"2385","zOrder":"219"},{"ID":"337","h":"41","measuredH":"40","measuredW":"125","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"length":125,"x":125,"y":0},"p1":{"length":0.4738906925817148,"x":0.4738851557727551,"y":0.0022907758094072093},"p2":{"length":40,"x":0,"y":40},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"126","x":"459","y":"2323","zOrder":"25"},{"ID":"338","h":"50","measuredH":"49","measuredW":"110","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"length":110,"x":110,"y":0},"p1":{"length":0.4738906925817146,"x":0.4738851557727549,"y":0.002290775809407395},"p2":{"length":49,"x":0,"y":49},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"111","x":"466","y":"2352","zOrder":"24"},{"ID":"340","h":"123","measuredH":"140","measuredW":"200","properties":{"color":"16770457"},"typeID":"TextArea","w":"276","x":"443","y":"2455","zOrder":"220"},{"ID":"341","measuredH":"32","measuredW":"54","properties":{"align":"center","color":"16776960","size":"18","text":"Rx.js"},"typeID":"TextInput","w":"176","x":"220","y":"2495","zOrder":"221"},{"ID":"342","measuredH":"32","measuredW":"52","properties":{"align":"center","color":"16776960","size":"18","text":"ngrx"},"typeID":"TextInput","w":"176","x":"220","y":"2531","zOrder":"222"},{"ID":"343","measuredH":"25","measuredW":"229","properties":{"size":"17","text":"Even if you don't pick angular"},"typeID":"Label","x":"459","y":"2468","zOrder":"223"},{"ID":"344","measuredH":"25","measuredW":"205","properties":{"size":"17","text":"Rx.js is an amazing library"},"typeID":"Label","x":"459","y":"2491","zOrder":"224"},{"ID":"345","measuredH":"25","measuredW":"245","properties":{"size":"17","text":"and can be used out of angular."},"typeID":"Label","x":"459","y":"2515","zOrder":"225"},{"ID":"346","measuredH":"25","measuredW":"184","properties":{"size":"17","text":"Give it a try afterwards!"},"typeID":"Label","x":"459","y":"2540","zOrder":"226"},{"ID":"347","h":"92","measuredH":"91","measuredW":"8","properties":{"color":"2848996","curvature":"1","direction":"bottom","leftArrow":"false","p0":{"length":8,"x":8,"y":0},"p1":{"length":0.4472135954999579,"x":0.4461538461538461,"y":-0.03076923076923077},"p2":{"length":91.00549433962765,"x":1,"y":91},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"9","x":"377","y":"2424","zOrder":"23"},{"ID":"349","measuredH":"32","measuredW":"95","properties":{"align":"center","borderColor":"13576743","color":"16777215","size":"18","text":"Angular.js"},"typeID":"TextInput","w":"205","x":"81","y":"2431","zOrder":"227"},{"ID":"350","h":"27","measuredH":"107","measuredW":"205","properties":{"color":"13576743"},"typeID":"ScratchOut","w":"44","x":"238","y":"2433","zOrder":"228"},{"ID":"352","h":"158","measuredH":"157","measuredW":"1","properties":{"color":"2848996","curvature":"0","direction":"top","leftArrow":"false","p0":{"length":0,"x":0,"y":0},"p1":{"length":0.4613486124774123,"x":0.46125955702687793,"y":0.00906439662646804},"p2":{"length":157,"x":0,"y":157},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"2","x":"166","y":"2448","zOrder":"22"},{"ID":"353","h":"123","measuredH":"140","measuredW":"200","properties":{"color":"16770457"},"typeID":"TextArea","w":"354","x":"97","y":"2599","zOrder":"229"},{"ID":"354","measuredH":"25","measuredW":"147","properties":{"bold":"true","size":"17","text":"Honorary Mention!"},"typeID":"Label","x":"111","y":"2611","zOrder":"230"},{"ID":"355","measuredH":"25","measuredW":"281","properties":{"size":"17","text":"It isn't used any more except for the"},"typeID":"Label","x":"111","y":"2637","zOrder":"231"},{"ID":"356","measuredH":"25","measuredW":"265","properties":{"size":"17","text":"the old apps. Make sure if you pick"},"typeID":"Label","x":"111","y":"2662","zOrder":"232"},{"ID":"358","measuredH":"25","measuredW":"326","properties":{"size":"17","text":"Angular it is Angular2+ and not angular.js"},"typeID":"Label","x":"111","y":"2685","zOrder":"233"},{"ID":"364","h":"143","measuredH":"140","measuredW":"200","properties":{"color":"16770457","text":""},"typeID":"TextArea","w":"483","x":"891","y":"2288","zOrder":"234"},{"ID":"365","measuredH":"25","measuredW":"135","properties":{"bold":"true","size":"17","text":"Personal Opinion"},"typeID":"Label","x":"905","y":"2302","zOrder":"235"},{"ID":"366","measuredH":"25","measuredW":"436","properties":{"size":"17","text":"There is more and more demand for React.js these days"},"typeID":"Label","x":"905","y":"2333","zOrder":"236"},{"ID":"367","measuredH":"25","measuredW":"421","properties":{"size":"17","text":"You can pick any of the listed ones and you will be fine"},"typeID":"Label","x":"905","y":"2360","zOrder":"237"},{"ID":"368","measuredH":"25","measuredW":"314","properties":{"size":"17","text":"Personally I would pick React or Angular."},"typeID":"Label","x":"905","y":"2386","zOrder":"238"},{"ID":"378","h":"3","measuredH":"2","measuredW":"216","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"length":2,"x":0,"y":2},"p1":{"length":0.4738906925817149,"x":0.47388515577275514,"y":0.00229077580940742},"p2":{"length":216.00231480241132,"x":216,"y":1},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"217","x":"846","y":"2327","zOrder":"21"},{"ID":"379","h":"315","measuredH":"314","measuredW":"76","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"length":7,"x":7,"y":0},"p1":{"length":0.5133171436564842,"x":0.5032750563580599,"y":-0.1010381493270896},"p2":{"length":323.066556610244,"x":76,"y":314},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"77","x":"750","y":"2358","zOrder":"20"},{"ID":"380","h":"193","measuredH":"140","measuredW":"200","properties":{"color":"16777215"},"typeID":"TextArea","w":"740","x":"541","y":"2615","zOrder":"239"},{"ID":"381","measuredH":"25","measuredW":"114","properties":{"bold":"true","size":"17","text":"Practical time"},"typeID":"Label","x":"588","y":"2628","zOrder":"240"},{"ID":"382","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"557","y":"2629","zOrder":"241"},{"ID":"383","measuredH":"21","measuredW":"14","properties":{"bold":"true","color":"16777215","text":"13"},"typeID":"Label","w":"17","x":"562","y":"2631","zOrder":"242"},{"ID":"384","measuredH":"25","measuredW":"670","properties":{"size":"17","text":"Now you know _everything_ that one might need to build a modern JavaScript application."},"typeID":"Label","x":"588","y":"2657","zOrder":"243"},{"ID":"388","measuredH":"25","measuredW":"674","properties":{"size":"17","text":"Go ahead and make some application with whatever framework you picked. You can find"},"typeID":"Label","x":"588","y":"2687","zOrder":"244"},{"ID":"389","measuredH":"25","measuredW":"506","properties":{"size":"17","text":"some of the ideas in the `ideas` directory. Pick anything and start!"},"typeID":"Label","x":"588","y":"2714","zOrder":"245"},{"ID":"391","h":"213","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"740","x":"543","y":"2815","zOrder":"246"},{"ID":"392","measuredH":"32","measuredW":"54","properties":{"align":"center","color":"16776960","size":"18","text":"vuex"},"typeID":"TextInput","w":"176","x":"79","y":"2356","zOrder":"247"},{"ID":"393","h":"11","measuredH":"10","measuredW":"93","properties":{"color":"2848996","curvature":"1","direction":"bottom","leftArrow":"false","p0":{"length":93.02150289046077,"x":93,"y":2},"p1":{"length":0.4073634704711659,"x":0.40573434757167937,"y":-0.03639555295494441},"p2":{"length":10,"x":0,"y":10},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"94","x":"235","y":"2362","zOrder":"19"},{"ID":"394","measuredH":"25","measuredW":"146","properties":{"bold":"true","size":"17","text":"Testing your Apps"},"typeID":"Label","x":"592","y":"2834","zOrder":"248"},{"ID":"395","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"561","y":"2834","zOrder":"249"},{"ID":"396","measuredH":"21","measuredW":"14","properties":{"bold":"true","color":"16777215","text":"14"},"typeID":"Label","w":"17","x":"566","y":"2836","zOrder":"250"},{"ID":"397","h":"3","measuredH":"2","measuredW":"131","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"length":131,"x":131,"y":0},"p1":{"length":0.4605263157894736,"x":0.4605263157894736,"y":-1.821373747360583e-17},"p2":{"length":2,"x":0,"y":2},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"132","x":"374","y":"2508","zOrder":"18"},{"ID":"398","h":"1","measuredH":"0","measuredW":"175","properties":{"color":"2848996","curvature":"0","direction":"top","leftArrow":"false","p0":{"length":175,"x":175,"y":0},"p1":{"length":0.5395274381637954,"x":0.5395167379813742,"y":0.0033979360684621178},"p2":{"length":0,"x":0,"y":0},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"176","x":"384","y":"2846","zOrder":"17"},{"ID":"399","measuredH":"32","measuredW":"50","properties":{"align":"center","color":"16770457","size":"18","text":"Jest"},"typeID":"TextInput","w":"162","x":"220","y":"2796","zOrder":"251"},{"ID":"400","measuredH":"32","measuredW":"67","properties":{"align":"center","color":"16770457","size":"18","text":"Mocha"},"typeID":"TextInput","w":"162","x":"220","y":"2831","zOrder":"252"},{"ID":"401","measuredH":"32","measuredW":"69","properties":{"align":"center","color":"16770457","size":"18","text":"Karma"},"typeID":"TextInput","w":"162","x":"220","y":"2906","zOrder":"253"},{"ID":"402","measuredH":"32","measuredW":"81","properties":{"align":"center","color":"16770457","size":"18","text":"Enzyme"},"typeID":"TextInput","w":"162","x":"220","y":"2942","zOrder":"254"},{"ID":"403","measuredH":"25","measuredW":"647","properties":{"size":"17","text":"There are lots and lots of different tools for *different purposes*. I mostly find myself"},"typeID":"Label","x":"594","y":"2865","zOrder":"255"},{"ID":"404","measuredH":"25","measuredW":"652","properties":{"size":"17","text":"using the ones listed on the left. However, before you learn them, I would recommend"},"typeID":"Label","x":"594","y":"2888","zOrder":"256"},{"ID":"405","measuredH":"25","measuredW":"667","properties":{"size":"17","text":"you to first understand the different test types, look at all the options available and use"},"typeID":"Label","x":"594","y":"2912","zOrder":"257"},{"ID":"406","measuredH":"32","measuredW":"97","properties":{"align":"center","color":"16770457","size":"18","text":"Protractor"},"typeID":"TextInput","w":"162","x":"220","y":"2868","zOrder":"258"},{"ID":"407","measuredH":"25","measuredW":"294","properties":{"size":"17","text":"the ones most suitable for your needs."},"typeID":"Label","x":"594","y":"2936","zOrder":"259"},{"ID":"409","measuredH":"25","measuredW":"520","properties":{"color":"13576743","size":"17","text":"Here is a good summary to get you started : https://goo.gl/D77a4K"},"typeID":"Label","x":"594","y":"2978","zOrder":"260"},{"ID":"410","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"lightbulb-o","size":"small"}},"typeID":"Icon","x":"562","y":"2979","zOrder":"261"},{"ID":"411","h":"122","measuredH":"140","measuredW":"200","properties":{"color":"16777215"},"typeID":"TextArea","w":"740","x":"543","y":"3034","zOrder":"262"},{"ID":"412","measuredH":"25","measuredW":"174","properties":{"bold":"true","size":"17","text":"Static Type Checkers"},"typeID":"Label","x":"587","y":"3053","zOrder":"263"},{"ID":"413","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"557","y":"3053","zOrder":"264"},{"ID":"414","measuredH":"21","measuredW":"14","properties":{"bold":"true","color":"16777215","text":"15"},"typeID":"Label","w":"17","x":"562","y":"3055","zOrder":"265"},{"ID":"415","measuredH":"25","measuredW":"682","properties":{"size":"17","text":"You don't need to learn these but they really give you superpowers and can be mastered"},"typeID":"Label","x":"589","y":"3083","zOrder":"266"},{"ID":"423","measuredH":"32","measuredW":"104","properties":{"align":"center","color":"16776960","size":"18","text":"TypeScript"},"typeID":"TextInput","w":"162","x":"221","y":"3040","zOrder":"267"},{"ID":"424","measuredH":"32","measuredW":"50","properties":{"align":"center","color":"16770457","size":"18","text":"Flow"},"typeID":"TextInput","w":"162","x":"221","y":"3076","zOrder":"268"},{"ID":"425","h":"15","measuredH":"14","measuredW":"191","properties":{"color":"2848996","curvature":"0","direction":"top","leftArrow":"false","p0":{"length":191.51240168720145,"x":191,"y":14},"p1":{"length":0.5395274381637954,"x":0.5395167379813742,"y":0.003397936068461866},"p2":{"length":0,"x":0,"y":0},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"192","x":"376","y":"3055","zOrder":"16"},{"ID":"426","h":"15","measuredH":"14","measuredW":"207","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"length":207,"x":207,"y":0},"p1":{"length":0.5395274381637954,"x":0.5395167379813742,"y":0.0033979360684621147},"p2":{"length":14,"x":0,"y":14},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"208","x":"370","y":"3079","zOrder":"15"},{"ID":"427","measuredH":"25","measuredW":"576","properties":{"size":"17","text":"in a few hours. I would pick TypeScript but feel free to check both and pick."},"typeID":"Label","x":"589","y":"3108","zOrder":"269"},{"ID":"428","h":"105","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"739","x":"543","y":"3274","zOrder":"270"},{"ID":"429","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"557","y":"3289","zOrder":"271"},{"ID":"430","measuredH":"22","measuredW":"15","properties":{"bold":"true","color":"16777215","size":"14","text":"17"},"typeID":"Label","w":"16","x":"561","y":"3291","zOrder":"272"},{"ID":"431","measuredH":"26","measuredW":"150","properties":{"bold":"true","size":"18","text":"CSS Architecture"},"typeID":"Label","w":"293","x":"588","y":"3288","zOrder":"273"},{"ID":"432","measuredH":"25","measuredW":"671","properties":{"size":"17","text":"There are multiple ways to structure your CSS better and to make it more maintainable"},"typeID":"Label","x":"589","y":"3316","zOrder":"274"},{"ID":"436","measuredH":"25","measuredW":"626","properties":{"size":"17","text":"You should know about the differences – personally I find myself using BEM more"},"typeID":"Label","x":"590","y":"3341","zOrder":"275"},{"ID":"438","h":"51","measuredH":"50","measuredW":"201","properties":{"color":"2848996","curvature":"0","direction":"top","leftArrow":"false","p0":{"length":207.12556578076016,"x":201,"y":50},"p1":{"length":0.5395274381637954,"x":0.5395167379813742,"y":0.0033979360684621043},"p2":{"length":0,"x":0,"y":0},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"202","x":"386","y":"3279","zOrder":"11"},{"ID":"439","h":"73","measuredH":"72","measuredW":"184","properties":{"color":"2848996","curvature":"0","direction":"top","leftArrow":"false","p0":{"length":197.5854245636555,"x":184,"y":72},"p1":{"length":0.5479563372577997,"x":0.5479508196721311,"y":0.0024590163934426227},"p2":{"length":0,"x":0,"y":0},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"185","x":"393","y":"3247","zOrder":"12"},{"ID":"440","measuredH":"32","measuredW":"51","properties":{"align":"center","color":"16776960","size":"18","text":"BEM"},"typeID":"TextInput","w":"162","x":"231","y":"3229","zOrder":"13"},{"ID":"441","measuredH":"32","measuredW":"80","properties":{"align":"center","color":"16770457","size":"18","text":"OOCSS"},"typeID":"TextInput","w":"162","x":"231","y":"3266","zOrder":"14"},{"ID":"442","measuredH":"32","measuredW":"89","properties":{"align":"center","color":"16770457","size":"18","text":"SMACSS"},"typeID":"TextInput","w":"162","x":"231","y":"3303","zOrder":"276"},{"ID":"443","measuredH":"32","measuredW":"95","properties":{"align":"center","color":"16770457","size":"18","text":"SUITCSS"},"typeID":"TextInput","w":"162","x":"231","y":"3340","zOrder":"277"},{"ID":"444","measuredH":"32","measuredW":"69","properties":{"align":"center","color":"16770457","size":"18","text":"Atomic"},"typeID":"TextInput","w":"162","x":"232","y":"3376","zOrder":"278"},{"ID":"445","h":"16","measuredH":"15","measuredW":"181","properties":{"color":"2848996","curvature":"0","direction":"top","leftArrow":"false","p0":{"length":181.62048342629197,"x":181,"y":15},"p1":{"length":0.5395274381637954,"x":0.5395167379813742,"y":0.0033979360684621134},"p2":{"length":0,"x":0,"y":0},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"182","x":"381","y":"3315","zOrder":"10"},{"ID":"446","h":"16","measuredH":"15","measuredW":"189","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"length":189,"x":189,"y":0},"p1":{"length":0.5395274381637954,"x":0.5395167379813742,"y":0.0033979360684621165},"p2":{"length":15,"x":0,"y":15},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"190","x":"381","y":"3339","zOrder":"9"},{"ID":"447","h":"42","measuredH":"41","measuredW":"198","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"length":198,"x":198,"y":0},"p1":{"length":0.5395274381637957,"x":0.5395167379813743,"y":0.003397936068462093},"p2":{"length":41,"x":0,"y":41},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"199","x":"382","y":"3349","zOrder":"8"},{"ID":"448","h":"105","measuredH":"140","measuredW":"200","properties":{"color":"16770457"},"typeID":"TextArea","w":"739","x":"543","y":"3387","zOrder":"279"},{"ID":"451","measuredH":"26","measuredW":"187","properties":{"bold":"true","size":"18","text":"Stuff Below this point"},"typeID":"Label","w":"293","x":"562","y":"3400","zOrder":"280"},{"ID":"452","measuredH":"25","measuredW":"624","properties":{"size":"17","text":"The skills that you have got till this point should be sufficient to get you a position"},"typeID":"Label","x":"563","y":"3427","zOrder":"281"},{"ID":"453","measuredH":"25","measuredW":"486","properties":{"size":"17","text":"for any of the \"Frontend Engineering\" roles. But don't stop here!"},"typeID":"Label","x":"563","y":"3453","zOrder":"282"},{"ID":"455","h":"81","measuredH":"140","measuredW":"200","properties":{"color":"16776960"},"typeID":"TextArea","w":"739","x":"544","y":"3498","zOrder":"283"},{"ID":"456","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"558","y":"3512","zOrder":"284"},{"ID":"457","measuredH":"22","measuredW":"15","properties":{"bold":"true","color":"16777215","size":"14","text":"18"},"typeID":"Label","w":"16","x":"563","y":"3514","zOrder":"285"},{"ID":"458","measuredH":"26","measuredW":"195","properties":{"bold":"true","size":"18","text":"Server Side Rendering"},"typeID":"Label","w":"293","x":"589","y":"3511","zOrder":"286"},{"ID":"459","measuredH":"25","measuredW":"531","properties":{"size":"17","text":"Learn about server side rendering in whatever framework you picked"},"typeID":"Label","x":"590","y":"3538","zOrder":"287"},{"ID":"461","measuredH":"32","measuredW":"64","properties":{"align":"center","color":"16770457","size":"18","text":"React"},"typeID":"TextInput","w":"135","x":"258","y":"3478","zOrder":"288"},{"ID":"462","h":"30","measuredH":"29","measuredW":"176","properties":{"color":"2848996","curvature":"0","direction":"top","leftArrow":"false","p0":{"length":178.3732042656632,"x":176,"y":29},"p1":{"length":0.5395274381637954,"x":0.5395167379813742,"y":0.0033979360684620896},"p2":{"length":0,"x":0,"y":0},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"177","x":"383","y":"3493","zOrder":"7"},{"ID":"463","measuredH":"32","measuredW":"80","properties":{"align":"center","color":"16770457","size":"18","text":"Angular"},"typeID":"TextInput","w":"135","x":"258","y":"3516","zOrder":"289"},{"ID":"464","h":"2","measuredH":"1","measuredW":"190","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"length":190,"x":190,"y":0},"p1":{"length":0.5395274381637957,"x":0.5395167379813743,"y":0.003397936068462092},"p2":{"length":1,"x":0,"y":1},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"191","x":"379","y":"3532","zOrder":"6"},{"ID":"465","measuredH":"32","measuredW":"71","properties":{"align":"center","color":"16776960","size":"18","text":"Next.js"},"typeID":"TextInput","w":"135","x":"91","y":"3433","zOrder":"290"},{"ID":"466","h":"36","measuredH":"35","measuredW":"89","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"length":95.63472172804184,"x":89,"y":35},"p1":{"length":0.4141690643745274,"x":0.3787677176742842,"y":-0.1675441133931154},"p2":{"length":1,"x":0,"y":1},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"90","x":"182","y":"3448","zOrder":"5"},{"ID":"467","measuredH":"32","measuredW":"72","properties":{"align":"center","color":"16770457","size":"18","text":"After.js"},"typeID":"TextInput","w":"135","x":"91","y":"3470","zOrder":"291"},{"ID":"468","h":"7","measuredH":"6","measuredW":"81","properties":{"color":"2848996","curvature":"0","direction":"top","leftArrow":"false","p0":{"length":81.2219182240853,"x":81,"y":6},"p1":{"length":0.39570990272974865,"x":0.3956343792633015,"y":-0.007730786721236948},"p2":{"length":0,"x":0,"y":0},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"82","x":"193","y":"3490","zOrder":"4"},{"ID":"469","measuredH":"32","measuredW":"90","properties":{"align":"center","color":"16770457","size":"18","text":"Universal"},"typeID":"TextInput","w":"135","x":"93","y":"3516","zOrder":"292"},{"ID":"470","h":"5","measuredH":"4","measuredW":"75","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"length":75.1065909225016,"x":75,"y":4},"p1":{"length":0.3617013511163557,"x":0.36110618684630386,"y":-0.020741003368197126},"p2":{"length":0,"x":0,"y":0},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"76","x":"199","y":"3531","zOrder":"3"},{"ID":"471","measuredH":"32","measuredW":"63","properties":{"align":"center","color":"16770457","size":"18","text":"Vue.js"},"typeID":"TextInput","w":"135","x":"259","y":"3554","zOrder":"293"},{"ID":"472","h":"29","measuredH":"28","measuredW":"204","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"length":204,"x":204,"y":0},"p1":{"length":0.5395274381637952,"x":0.539516737981374,"y":0.003397936068462103},"p2":{"length":28,"x":0,"y":28},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"205","x":"375","y":"3542","zOrder":"2"},{"ID":"473","measuredH":"32","measuredW":"71","properties":{"align":"center","color":"16770457","size":"18","text":"Nuxt.js"},"typeID":"TextInput","w":"135","x":"93","y":"3554","zOrder":"294"},{"ID":"474","h":"4","measuredH":"3","measuredW":"75","properties":{"color":"2848996","curvature":"-1","direction":"top","leftArrow":"false","p0":{"length":75.05997601918082,"x":75,"y":3},"p1":{"length":0.3617013511163557,"x":0.36110618684630386,"y":-0.02074100336819713},"p2":{"length":1,"x":0,"y":1},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"76","x":"210","y":"3570","zOrder":"1"},{"ID":"475","h":"96","measuredH":"95","measuredW":"138","properties":{"color":"2848996","curvature":"1","direction":"bottom","leftArrow":"false","p0":{"x":138,"y":0},"p1":{"x":0.4996889295516926,"y":-0.07513266239707228},"p2":{"x":0,"y":95},"rightArrow":"false","shape":"bezier","stroke":"dotted"},"typeID":"Arrow","w":"139","x":"569","y":"1833","zOrder":"295"},{"ID":"476","measuredH":"32","measuredW":"69","properties":{"align":"center","color":"16776960","size":"18","text":"ESLint"},"typeID":"TextInput","w":"147","x":"449","y":"1908","zOrder":"296"},{"ID":"477","measuredH":"32","measuredW":"68","properties":{"align":"center","color":"16770457","size":"18","text":"JSLint"},"typeID":"TextInput","w":"147","x":"449","y":"1945","zOrder":"297"},{"ID":"478","measuredH":"32","measuredW":"70","properties":{"align":"center","color":"16770457","size":"18","text":"JSHint"},"typeID":"TextInput","w":"147","x":"449","y":"1983","zOrder":"298"},{"ID":"479","measuredH":"32","measuredW":"63","properties":{"align":"center","color":"16770457","size":"18","text":"JSCS"},"typeID":"TextInput","w":"147","x":"449","y":"2021","zOrder":"299"},{"ID":"480","h":"81","measuredH":"140","measuredW":"200","properties":{"color":"16777215"},"typeID":"TextArea","w":"739","x":"544","y":"3584","zOrder":"300"},{"ID":"481","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"circle","size":"small"}},"typeID":"Icon","x":"558","y":"3598","zOrder":"301"},{"ID":"482","measuredH":"22","measuredW":"14","properties":{"bold":"true","color":"16777215","size":"14","text":"19"},"typeID":"Label","w":"16","x":"562","y":"3600","zOrder":"302"},{"ID":"483","measuredH":"26","measuredW":"185","properties":{"bold":"true","size":"18","text":"Progressive WebApps"},"typeID":"Label","w":"293","x":"589","y":"3597","zOrder":"303"},{"ID":"484","measuredH":"25","measuredW":"509","properties":{"size":"17","text":"Learn about service workers and how to make progress web apps"},"typeID":"Label","x":"590","y":"3624","zOrder":"304"},{"ID":"491","measuredH":"25","measuredW":"551","properties":{"color":"13576743","size":"17","text":"Learn how to measure and improve the performance of your application"},"typeID":"Label","x":"588","y":"2747","zOrder":"305"},{"ID":"492","measuredH":"24","measuredW":"24","properties":{"color":"10027263","icon":{"ID":"lightbulb-o","size":"small"}},"typeID":"Icon","x":"556","y":"2751","zOrder":"306"},{"ID":"493","measuredH":"25","measuredW":"491","properties":{"color":"13576743","size":"17","text":"e.g. Interactivity Time, Page Speed Index, Lighthouse Score etc"},"typeID":"Label","x":"587","y":"2772","zOrder":"307"},{"ID":"494","h":"173","measuredH":"172","measuredW":"16","properties":{"color":"2848996","curvature":"0","direction":"bottom","leftArrow":"false","p0":{"x":16,"y":0},"p1":{"x":0.586461126005362,"y":0.00804289544235925},"p2":{"x":0,"y":172},"rightArrow":"false","shape":"bezier"},"typeID":"Arrow","w":"17","x":"863","y":"3637","zOrder":"0"},{"ID":"498","measuredH":"32","measuredW":"170","properties":{"bold":"true","size":"24","text":"Keep Exploring"},"typeID":"Label","x":"777","y":"3827","zOrder":"308"}]},"measuredH":"3859","measuredW":"1374","mockupH":"3812","mockupW":"1295","version":"1.0"}} \ No newline at end of file diff --git a/readme.md b/readme.md index 385cf3922..69884065f 100644 --- a/readme.md +++ b/readme.md @@ -18,9 +18,9 @@ If you think that these can be improved in anyway, please do suggest. ![](https://i.imgur.com/OZUOUtI.png) -## 🎨 Front-end Roadmap +## 🎨 Frontend Roadmap -![](./images/frontend-v2.png) +![](./images/frontend.png) ## 👽 Back-end Roadmap