Skip to content

Commit a829c40

Browse files
1Marc1Marc
committed
Add generated table of contents
1 parent 1512b99 commit a829c40

File tree

2 files changed

+75
-1
lines changed

2 files changed

+75
-1
lines changed

‎index.html

+75-1
Original file line numberDiff line numberDiff line change
@@ -71,19 +71,93 @@
7171
white-space: nowrap;
7272
width: 1px;
7373
}
74+
.table-of-contents {
75+
max-width: 800px;
76+
margin: auto;
77+
padding: 50px;
78+
}
79+
.table-of-contents li {
80+
line-height: 150%;
81+
}
7482
</style>
7583
<title>The Front-End Developer Learning Roadmap by Frontend Masters</title>
7684
<meta name="description" content="Guides to learning the front-end development industry tools and techniques visualized as a roadmap." />
7785
</head>
7886
<body style="background-color: rgba(230, 225, 215, 100); margin: 0px">
7987
<h1 class="visually-hidden">The Front-End Developer Learning Roadmap by Frontend Masters</h1>
88+
89+
<div id="betaTag"></div>
90+
8091
<div id="key">
8192
<div>Key:</div>
8293
<div id="primary">Fundamental</div>
8394
<div id="secondary">Specialize</div>
8495
</div>
85-
<div id="betaTag"></div>
96+
8697
<div id="mynetwork"></div>
98+
99+
<section class="table-of-contents">
100+
<h2>Front End Learning Roadmap Guides</h2>
101+
<ul>
102+
<li><a href='accessibility/' target='_blank'>Web Accessibility Learning Resources</a></li>
103+
<li><a href='browser-webpage-performance/' target='_blank'>Browser, Website, and Web App Performance Learning Resources</a></li>
104+
<li><a href='code-editors/' target='_blank'>Code Editors Learning Resources</a></li>
105+
<li><a href='command-line-interface/' target='_blank'>Command Line Interface Learning Resources</a></li>
106+
<li><a href='css-fonts-and-icons/' target='_blank'>CSS Fonts & Icons Learning Resources</a></li>
107+
<li><a href='css-fundamentals/' target='_blank'>CSS Fundamentals Learning Resources</a></li>
108+
<li><a href='css-in-js/' target='_blank'>CSS in JavaScript (CSS-in-JS) Learning Resources</a></li>
109+
<li><a href='css-layout/' target='_blank'>CSS Layout Learning Resources</a></li>
110+
<li><a href='css-media-queries/' target='_blank'>CSS Media Queries Learning Resources</a></li>
111+
<li><a href='css-practices/' target='_blank'>CSS Best Practices Learning Resources</a></li>
112+
<li><a href='css-tooling/' target='_blank'>CSS Tooling Learning Resources</a></li>
113+
<li><a href='css-transitions-transforms-animations/' target='_blank'>CSS Transitions, Transforms, & Animations Learning Resources</a></li>
114+
<li><a href='css-ui-toolkits/' target='_blank'>CSS UI Toolkits Learning Resources</a></li>
115+
<li><a href='data-apis/' target='_blank'>Web Development Data APIs Learning Resources</a></li>
116+
<li><a href='desktop-apps/' target='_blank'>Desktop Application Development with Web Technologies Learning Resources</a></li>
117+
<li><a href='dom-bom-cssom/' target='_blank'>DOM, BOM, & CSSOM Learning Resources</a></li>
118+
<li><a href='front-end-developer-profession/' target='_blank'>The Front End Developer Profession Learning Resources</a></li>
119+
<li><a href='front-end-development-overview/' target='_blank'>Front End Development Technology Overview Learning Resources</a></li>
120+
<li><a href='getting-a-front-end-developer-job/' target='_blank'>Getting a Front End Developer Job Learning Resources</a></li>
121+
<li><a href='git/' target='_blank'>Git Learning Resources</a></li>
122+
<li><a href='html/' target='_blank'>HTML Learning Resources</a></li>
123+
<li><a href='html-email/' target='_blank'>HTML Email Development Learning Resources</a></li>
124+
<li><a href='http/' target='_blank'>HTTP Learning Resources</a></li>
125+
<li><a href='jam-stack/' target='_blank'>JAM Stack Learning Resources</a></li>
126+
<li><a href='javascript-fundamentals/' target='_blank'>JavaScript Fundamentals Learning Resources</a></li>
127+
<li><a href='javascript-modules-scripts/' target='_blank'>JavaScript Modules & Scripts Learning Resources</a></li>
128+
<li><a href='javascript-regular-expressions/' target='_blank'>JavaScript Regular Expressions Learning Resources</a></li>
129+
<li><a href='js-animation/' target='_blank'>JavaScript Animation Learning Resources</a></li>
130+
<li><a href='js-app-frameworks/' target='_blank'>JavaScript Application Frameworks/Libraries Learning Resources</a></li>
131+
<li><a href='js-async/' target='_blank'>JavaScript Asynchronous Programming Learning Resources</a></li>
132+
<li><a href='js-bundlers/' target='_blank'>JavaScript Bundlers Learning Resources</a></li>
133+
<li><a href='js-compile-to-js/' target='_blank'>JavaScript Compile to JS Learning Resources</a></li>
134+
<li><a href='js-cs/' target='_blank'>JavaScript & Computer Science Learning Resources</a></li>
135+
<li><a href='js-fp/' target='_blank'>JavaScript Functional Programming (FP) Learning Resources</a></li>
136+
<li><a href='js-oop/' target='_blank'>JavaScript Object-Oriented Programming (OOP) Learning Resources</a></li>
137+
<li><a href='js-performance/' target='_blank'>JavaScript Performance Learning Resources</a></li>
138+
<li><a href='js-practices-tools/' target='_blank'>JavaScript Practices & Tooling Learning Resources</a></li>
139+
<li><a href='js-runtime-ast/' target='_blank'>JavaScript Runtime & AST Learning Resources</a></li>
140+
<li><a href='js-state-management/' target='_blank'>JavaScript State Management Learning Resources</a></li>
141+
<li><a href='js-ui-components-and-widgets/' target='_blank'>JavaScript UI Components and Widgets Learning Resources</a></li>
142+
<li><a href='js-web-api/' target='_blank'>JavaScript Web Platform APIs Learning Resources</a></li>
143+
<li><a href='mobile-apps/' target='_blank'>Native Mobile Applications Learning Resources</a></li>
144+
<li><a href='node-npm/' target='_blank'>Node.js & npm / Yarn Learning Resources</a></li>
145+
<li><a href='npm-yarn-scripts/' target='_blank'>npm & yarn Scripts Learning Resources</a></li>
146+
<li><a href='pwa/' target='_blank'>Progressive Web Apps (PWAs) Learning Resources</a></li>
147+
<li><a href='rwd/' target='_blank'>Responsive Web Design Learning Resources</a></li>
148+
<li><a href='seo/' target='_blank'>Search Engine Optimization (SEO) Learning Resources</a></li>
149+
<li><a href='testing/' target='_blank'>JavaScript Unit and End-to-End Testing Learning Resources</a></li>
150+
<li><a href='the-web-platform/' target='_blank'>The Web Platform Learning Resources</a></li>
151+
<li><a href='ui-design-patterns/' target='_blank'>UI Design / Patterns Learning Resources</a></li>
152+
<li><a href='web-apps/' target='_blank'>Web Applications Learning Resources</a></li>
153+
<li><a href='web-images/' target='_blank'>Web Images Learning Resources</a></li>
154+
<li><a href='web-security/' target='_blank'>Web Security Learning Resources</a></li>
155+
<li><a href='webdev-tools/' target='_blank'>Web Developer Tools Learning Resources</a></li>
156+
<li><a href='www-basic-mechanics/' target='_blank'>World Wide Web (WWW) Basic Mechanics Learning Resources</a></li>
157+
<li><a href='x-compile-to-js/' target='_blank'>Compile to JavaScript Languages Learning Resources</a></li>
158+
</ul>
159+
</section>
160+
87161
<script src="node_modules/vis/dist/vis.min.js"></script>
88162
<script type="text/javascript">
89163
const createLabel = (labelContent) => {

‎meta.xlsx

1.19 KB
Binary file not shown.

0 commit comments

Comments
 (0)