libretech/M6C9.de
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Activity

optimize a11y

Browse Source
This commit is contained in:
Michael Czechowski
2024-09-13 00:37:15 +02:00
parent 9a4a7ef140
commit 6bbd2a0d26
1 changed files with 64 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

124
index.html
View File

@@ -80,6 +80,10 @@
<!-- endregion --> <!-- endregion -->
<!-- region Custom CSS --> <!-- region Custom CSS -->
<style> <style>
html {
background: black;
color: black;
}
section { section {
top: 0; top: 0;
position: sticky; position: sticky;
@@ -168,14 +172,14 @@
<!-- region Courses --> <!-- region Courses -->
<div class="grid grid-cols-1 md:grid-cols-1 gap-6 mb-8"> <div class="grid grid-cols-1 md:grid-cols-1 gap-6 mb-8">
<div> <div>
<details open class="mb-4"> <details class="mb-4">
<summary class="text-md font-semibold mb-2 cursor-pointer"> Duale Hochschule Baden-Württemberg (DHBW) </summary> <summary class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-white focus:bg-white focus:text-black focus:no-underline text-white transition underline-offset-2 mb-2 cursor-pointer"> Duale Hochschule Baden-Württemberg (DHBW) </summary>
<ul class="list-disc list-inside"> <ul class="list-disc list-inside">
<li>2024 „Einführung in die Webentwicklung“ (Introduction to Web Development)</li> <li>2024 „Einführung in die Webentwicklung“ (Introduction to Web Development)</li>
</ul> </ul>
</details> </details>
<details open class="mb-4"> <details class="mb-4">
<summary class="text-md font-semibold mb-2 cursor-pointer"> Leibniz Fachhochschule (LFH) </summary> <summary class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-white focus:bg-white focus:text-black focus:no-underline text-white transition underline-offset-2 mb-2 cursor-pointer"> Leibniz Fachhochschule (LFH) </summary>
<ul class="list-disc list-inside"> <ul class="list-disc list-inside">
<li>2023 „Social Engineering“</li> <li>2023 „Social Engineering“</li>
<li>2023 „Mobile Medien (Mobile Media)“</li> <li>2023 „Mobile Medien (Mobile Media)“</li>
@@ -199,19 +203,19 @@
<!-- region Frontend --> <!-- region Frontend -->
<div> <div>
<details open class="mb-4"> <details open class="mb-4">
<summary class="text-md font-semibold mb-2 cursor-pointer text-nls-green"> Frontend Technologies </summary> <summary class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black focus:no-underline transition underline-offset-2 mb-2 cursor-pointer text-md font-semibold mb-2 cursor-pointer text-nls-green"> Frontend Technologies </summary>
<ul class="list-disc list-inside text-gray-400"> <ul class="list-disc list-inside text-gray-400">
<li> <li>
<a <a
href="https://developer.mozilla.org/en-US/docs/Web/JavaScript" href="https://developer.mozilla.org/en-US/docs/Web/JavaScript"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A high-level, interpreted programming language" title="A high-level, interpreted programming language"
aria-label="A high-level, interpreted programming language" aria-label="A high-level, interpreted programming language"
>JavaScript (ES6+)</a >JavaScript (ES6+)</a
>, >,
<a <a
href="https://www.typescriptlang.org/" href="https://www.typescriptlang.org/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A typed superset of JavaScript that compiles to plain JavaScript" title="A typed superset of JavaScript that compiles to plain JavaScript"
aria-label="A typed superset of JavaScript that compiles to plain JavaScript" aria-label="A typed superset of JavaScript that compiles to plain JavaScript"
>TypeScript</a >TypeScript</a
@@ -220,21 +224,21 @@
<li> <li>
<a <a
href="https://reactjs.org/" href="https://reactjs.org/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A JavaScript library for building user interfaces" title="A JavaScript library for building user interfaces"
aria-label="A JavaScript library for building user interfaces" aria-label="A JavaScript library for building user interfaces"
>React</a >React</a
>, >,
<a <a
href="https://vuejs.org/" href="https://vuejs.org/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A progressive framework for building user interfaces" title="A progressive framework for building user interfaces"
aria-label="A progressive framework for building user interfaces" aria-label="A progressive framework for building user interfaces"
>Vue.js</a >Vue.js</a
>, >,
<a <a
href="https://svelte.dev/" href="https://svelte.dev/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A radical new approach to building user interfaces" title="A radical new approach to building user interfaces"
aria-label="A radical new approach to building user interfaces" aria-label="A radical new approach to building user interfaces"
>Svelte</a >Svelte</a
@@ -243,14 +247,14 @@
<li> <li>
<a <a
href="https://angular.io/" href="https://angular.io/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A platform for building mobile and desktop web applications" title="A platform for building mobile and desktop web applications"
aria-label="A platform for building mobile and desktop web applications" aria-label="A platform for building mobile and desktop web applications"
>Angular</a >Angular</a
>, >,
<a <a
href="https://emberjs.com/" href="https://emberjs.com/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A framework for ambitious web developers" title="A framework for ambitious web developers"
aria-label="A framework for ambitious web developers" aria-label="A framework for ambitious web developers"
>Ember.js</a >Ember.js</a
@@ -259,7 +263,7 @@
<li> <li>
<a <a
href="https://jquery.com/" href="https://jquery.com/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A fast, small, and feature-rich JavaScript library" title="A fast, small, and feature-rich JavaScript library"
aria-label="A fast, small, and feature-rich JavaScript library" aria-label="A fast, small, and feature-rich JavaScript library"
>jQuery</a >jQuery</a
@@ -268,28 +272,28 @@
<li> <li>
<a <a
href="https://developer.mozilla.org/en-US/docs/Web/HTML" href="https://developer.mozilla.org/en-US/docs/Web/HTML"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="The standard markup language for documents designed to be displayed in a web browser" title="The standard markup language for documents designed to be displayed in a web browser"
aria-label="The standard markup language for documents designed to be displayed in a web browser" aria-label="The standard markup language for documents designed to be displayed in a web browser"
>HTML5</a >HTML5</a
>, >,
<a <a
href="https://developer.mozilla.org/en-US/docs/Web/CSS" href="https://developer.mozilla.org/en-US/docs/Web/CSS"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A stylesheet language used to describe the presentation of a document written in HTML or XML" title="A stylesheet language used to describe the presentation of a document written in HTML or XML"
aria-label="A stylesheet language used to describe the presentation of a document written in HTML or XML" aria-label="A stylesheet language used to describe the presentation of a document written in HTML or XML"
>CSS3</a >CSS3</a
>, >,
<a <a
href="https://sass-lang.com/" href="https://sass-lang.com/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A preprocessor scripting language that is interpreted or compiled into CSS" title="A preprocessor scripting language that is interpreted or compiled into CSS"
aria-label="A preprocessor scripting language that is interpreted or compiled into CSS" aria-label="A preprocessor scripting language that is interpreted or compiled into CSS"
>Sass</a >Sass</a
>, >,
<a <a
href="https://lesscss.org/" href="https://lesscss.org/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A backwards-compatible language extension for CSS" title="A backwards-compatible language extension for CSS"
aria-label="A backwards-compatible language extension for CSS" aria-label="A backwards-compatible language extension for CSS"
>Less</a >Less</a
@@ -299,28 +303,28 @@
<li> <li>
<a <a
href="https://tailwindcss.com/" href="https://tailwindcss.com/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A utility-first CSS framework for rapidly building custom designs" title="A utility-first CSS framework for rapidly building custom designs"
aria-label="A utility-first CSS framework for rapidly building custom designs" aria-label="A utility-first CSS framework for rapidly building custom designs"
>Tailwindcss</a >Tailwindcss</a
>, >,
<a <a
href="https://ant.design/" href="https://ant.design/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A design system for enterprise-level products" title="A design system for enterprise-level products"
aria-label="A design system for enterprise-level products" aria-label="A design system for enterprise-level products"
>Ant Design</a >Ant Design</a
>, >,
<a <a
href="https://material.io/design" href="https://material.io/design"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A design system created by Google" title="A design system created by Google"
aria-label="A design system created by Google" aria-label="A design system created by Google"
>Material Design</a >Material Design</a
>, >,
<a <a
href="https://getbootstrap.com/" href="https://getbootstrap.com/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="The world's most popular front-end open source toolkit" title="The world's most popular front-end open source toolkit"
aria-label="The world's most popular front-end open source toolkit" aria-label="The world's most popular front-end open source toolkit"
>Bootstrap</a >Bootstrap</a
@@ -330,21 +334,21 @@
Bundlers: Bundlers:
<a <a
href="https://vitejs.dev/" href="https://vitejs.dev/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="Next Generation Frontend Tooling" title="Next Generation Frontend Tooling"
aria-label="Next Generation Frontend Tooling" aria-label="Next Generation Frontend Tooling"
>Vite</a >Vite</a
>, >,
<a <a
href="https://webpack.js.org/" href="https://webpack.js.org/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A static module bundler for modern JavaScript applications" title="A static module bundler for modern JavaScript applications"
aria-label="A static module bundler for modern JavaScript applications" aria-label="A static module bundler for modern JavaScript applications"
>Webpack</a >Webpack</a
>, >,
<a <a
href="https://parceljs.org/" href="https://parceljs.org/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="Blazing fast, zero configuration web application bundler" title="Blazing fast, zero configuration web application bundler"
aria-label="Blazing fast, zero configuration web application bundler" aria-label="Blazing fast, zero configuration web application bundler"
>Parcel</a >Parcel</a
@@ -353,29 +357,29 @@
<li> <li>
Visualization: Visualization:
<a <a
href="https://plotly.com/javascript/" href="https://observablehq.com/plot/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A high-level, declarative charting library" title="A javaScript library for exploratory data visualization"
aria-label="A high-level, declarative charting library" aria-label="A javaScript library for exploratory data visualization"
>Plot.js</a >Observable Plot</a
>, >,
<a <a
href="https://d3js.org/" href="https://d3js.org/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A JavaScript library for manipulating documents based on data" title="A JavaScript library for manipulating documents based on data"
aria-label="A JavaScript library for manipulating documents based on data" aria-label="A JavaScript library for manipulating documents based on data"
>D3.js</a >D3.js</a
>, >,
<a <a
href="https://particles.js.org/" href="https://particles.js.org/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A lightweight JavaScript library for creating particles" title="A lightweight JavaScript library for creating particles"
aria-label="A lightweight JavaScript library for creating particles" aria-label="A lightweight JavaScript library for creating particles"
>Particle.js</a >Particle.js</a
>, >,
<a <a
href="https://threejs.org/" href="https://threejs.org/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A cross-browser JavaScript library and API used to create and display animated 3D computer graphics" title="A cross-browser JavaScript library and API used to create and display animated 3D computer graphics"
aria-label="A cross-browser JavaScript library and API used to create and display animated 3D computer graphics" aria-label="A cross-browser JavaScript library and API used to create and display animated 3D computer graphics"
>Three.js</a >Three.js</a
@@ -384,7 +388,7 @@
<li> <li>
<a <a
href="https://nextjs.org/" href="https://nextjs.org/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="The React Framework for Production" title="The React Framework for Production"
aria-label="The React Framework for Production" aria-label="The React Framework for Production"
>NextJS</a >NextJS</a
@@ -394,7 +398,7 @@
<li> <li>
<a <a
href="https://nuxtjs.org/" href="https://nuxtjs.org/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="The Intuitive Vue Framework" title="The Intuitive Vue Framework"
aria-label="The Intuitive Vue Framework" aria-label="The Intuitive Vue Framework"
>NuxtJS</a >NuxtJS</a
@@ -404,7 +408,7 @@
<li> <li>
<a <a
href="https://kit.svelte.dev/" href="https://kit.svelte.dev/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="The fastest way to build Svelte apps" title="The fastest way to build Svelte apps"
aria-label="The fastest way to build Svelte apps" aria-label="The fastest way to build Svelte apps"
>SvelteKit</a >SvelteKit</a
@@ -414,7 +418,7 @@
<li> <li>
<a <a
href="https://www.gatsbyjs.com/" href="https://www.gatsbyjs.com/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A React-based open source framework for creating websites and apps" title="A React-based open source framework for creating websites and apps"
aria-label="A React-based open source framework for creating websites and apps" aria-label="A React-based open source framework for creating websites and apps"
>Gatsby</a >Gatsby</a
@@ -424,7 +428,7 @@
<li> <li>
<a <a
href="https://storybook.js.org/" href="https://storybook.js.org/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A tool for building UI components and pages in isolation" title="A tool for building UI components and pages in isolation"
aria-label="A tool for building UI components and pages in isolation" aria-label="A tool for building UI components and pages in isolation"
>Storybook</a >Storybook</a
@@ -434,7 +438,7 @@
<li> <li>
<a <a
href="https://jestjs.io/" href="https://jestjs.io/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A delightful JavaScript Testing Framework with a focus on simplicity" title="A delightful JavaScript Testing Framework with a focus on simplicity"
aria-label="A delightful JavaScript Testing Framework with a focus on simplicity" aria-label="A delightful JavaScript Testing Framework with a focus on simplicity"
>Jest</a >Jest</a
@@ -444,7 +448,7 @@
<li> <li>
<a <a
href="https://www.cypress.io/" href="https://www.cypress.io/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="Fast, easy and reliable testing for anything that runs in a browser" title="Fast, easy and reliable testing for anything that runs in a browser"
aria-label="Fast, easy and reliable testing for anything that runs in a browser" aria-label="Fast, easy and reliable testing for anything that runs in a browser"
>Cypress</a >Cypress</a
@@ -454,7 +458,7 @@
<li> <li>
<a <a
href="https://playwright.dev/" href="https://playwright.dev/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="Reliable end-to-end testing for modern web apps" title="Reliable end-to-end testing for modern web apps"
aria-label="Reliable end-to-end testing for modern web apps" aria-label="Reliable end-to-end testing for modern web apps"
>Playwright</a >Playwright</a
@@ -464,7 +468,7 @@
<li> <li>
<a <a
href="https://redux.js.org/" href="https://redux.js.org/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A Predictable State Container for JS Apps" title="A Predictable State Container for JS Apps"
aria-label="A Predictable State Container for JS Apps" aria-label="A Predictable State Container for JS Apps"
>Redux</a >Redux</a
@@ -474,7 +478,7 @@
<li> <li>
<a <a
href="https://mobx.js.org/" href="https://mobx.js.org/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="Simple, scalable state management" title="Simple, scalable state management"
aria-label="Simple, scalable state management" aria-label="Simple, scalable state management"
>MobX</a >MobX</a
@@ -484,7 +488,7 @@
<li> <li>
<a <a
href="https://zustand-demo.pmnd.rs/" href="https://zustand-demo.pmnd.rs/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A small, fast and scalable bearbones state-management solution" title="A small, fast and scalable bearbones state-management solution"
aria-label="A small, fast and scalable bearbones state-management solution" aria-label="A small, fast and scalable bearbones state-management solution"
>Zustand</a >Zustand</a
@@ -494,7 +498,7 @@
<li> <li>
<a <a
href="https://www.apollographql.com/docs/react/" href="https://www.apollographql.com/docs/react/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A complete state management library for JavaScript apps" title="A complete state management library for JavaScript apps"
aria-label="A complete state management library for JavaScript apps" aria-label="A complete state management library for JavaScript apps"
>Apollo Client</a >Apollo Client</a
@@ -504,7 +508,7 @@
<li> <li>
<a <a
href="https://axios-http.com/" href="https://axios-http.com/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="Promise based HTTP client for the browser and node.js" title="Promise based HTTP client for the browser and node.js"
aria-label="Promise based HTTP client for the browser and node.js" aria-label="Promise based HTTP client for the browser and node.js"
>Axios</a >Axios</a
@@ -514,7 +518,7 @@
<li> <li>
<a <a
href="https://lodash.com/" href="https://lodash.com/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A modern JavaScript utility library delivering modularity, performance & extras" title="A modern JavaScript utility library delivering modularity, performance & extras"
aria-label="A modern JavaScript utility library delivering modularity, performance & extras" aria-label="A modern JavaScript utility library delivering modularity, performance & extras"
>Lodash</a >Lodash</a
@@ -524,7 +528,7 @@
<li> <li>
<a <a
href="https://rxjs.dev/" href="https://rxjs.dev/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A library for reactive programming using Observables" title="A library for reactive programming using Observables"
aria-label="A library for reactive programming using Observables" aria-label="A library for reactive programming using Observables"
>RxJS</a >RxJS</a
@@ -534,7 +538,7 @@
<li> <li>
<a <a
href="https://www.khronos.org/webgl/" href="https://www.khronos.org/webgl/"
class="hover:text-white text-nls-green hover:decoration-2 transition underline-offset-2 underline" class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-green focus:bg-nls-green focus:text-black hover:text-white focus:no-underline text-nls-green hover:decoration-2 transition underline-offset-2 underline"
title="A JavaScript API for rendering interactive 2D and 3D graphics" title="A JavaScript API for rendering interactive 2D and 3D graphics"
aria-label="A JavaScript API for rendering interactive 2D and 3D graphics" aria-label="A JavaScript API for rendering interactive 2D and 3D graphics"
>WebGL</a >WebGL</a
@@ -547,8 +551,8 @@
<!-- endregion --> <!-- endregion -->
<!-- region DevOps --> <!-- region DevOps -->
<div> <div>
<details open class="mb-4"> <details class="mb-4">
<summary class="text-md font-semibold mb-2 cursor-pointer text-nls-blue"> DevOps & Cloud</summary> <summary class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-blue focus:bg-nls-blue focus:text-black focus:no-underline transition underline-offset-2 mb-2 cursor-pointer text-md font-semibold mb-2 cursor-pointer text-nls-blue"> DevOps & Cloud</summary>
<ul class="list-disc list-inside text-gray-400"> <ul class="list-disc list-inside text-gray-400">
<li> <li>
<a <a
@@ -731,8 +735,8 @@
<!-- endregion --> <!-- endregion -->
<!-- region Backend --> <!-- region Backend -->
<div> <div>
<details open class="mb-4"> <details class="mb-4">
<summary class="text-md font-semibold mb-2 cursor-pointer text-nls-violet"> Backend Technologies </summary> <summary class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-violet focus:bg-nls-violet focus:text-black focus:no-underline transition underline-offset-2 mb-2 cursor-pointer text-md font-semibold mb-2 cursor-pointer text-nls-violet"> Backend Technologies </summary>
<ul class="list-disc list-inside text-gray-400"> <ul class="list-disc list-inside text-gray-400">
<li> <li>
<a <a
@@ -940,8 +944,8 @@
<!-- endregion --> <!-- endregion -->
<!-- region Data --> <!-- region Data -->
<div> <div>
<details open class="mb-4"> <details class="mb-4">
<summary class="text-md font-semibold mb-2 cursor-pointer text-nls-purple"> Database & Data</summary> <summary class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-purple focus:bg-nls-purple focus:text-black focus:no-underline transition underline-offset-2 mb-2 cursor-pointer text-md font-semibold mb-2 cursor-pointer text-nls-purple"> Database & Data</summary>
<ul class="list-disc list-inside text-gray-400"> <ul class="list-disc list-inside text-gray-400">
<li> <li>
SQL (<a SQL (<a
@@ -998,8 +1002,8 @@
<!-- endregion --> <!-- endregion -->
<!-- region Cross-Platform --> <!-- region Cross-Platform -->
<div> <div>
<details open class="mb-4"> <details class="mb-4">
<summary class="text-md font-semibold mb-2 cursor-pointer text-nls-pink"> Cross-Platform Development </summary> <summary class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-pink focus:bg-nls-pink focus:text-black focus:no-underline transition underline-offset-2 mb-2 cursor-pointer text-md font-semibold mb-2 cursor-pointer text-nls-pink"> Cross-Platform Development </summary>
<ul class="list-disc list-inside text-gray-400"> <ul class="list-disc list-inside text-gray-400">
<li> <li>
Desktop Apps: Desktop Apps:
@@ -1057,8 +1061,8 @@
<!-- endregion --> <!-- endregion -->
<!-- region Best Practices --> <!-- region Best Practices -->
<div> <div>
<details open class="mb-4"> <details class="mb-4">
<summary class="text-md font-semibold mb-2 cursor-pointer text-nls-red"> Development Best Practices </summary> <summary class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-red focus:bg-nls-red focus:text-black focus:no-underline transition underline-offset-2 mb-2 cursor-pointer text-md font-semibold mb-2 cursor-pointer text-nls-red"> Development Best Practices </summary>
<ul class="list-disc list-inside text-gray-400"> <ul class="list-disc list-inside text-gray-400">
<li> <li>
<a <a
@@ -1117,8 +1121,8 @@
<!-- endregion --> <!-- endregion -->
<!-- region Tracking --> <!-- region Tracking -->
<div> <div>
<details open class="mb-4"> <details class="mb-4">
<summary class="text-md font-semibold mb-2 cursor-pointer text-nls-orange"> Analytics & Tracking </summary> <summary class="focus:outline-none rounded-sm focus:z-10 focus:ring-4 focus:ring-nls-orange focus:bg-nls-orange focus:text-black focus:no-underline transition underline-offset-2 mb-2 cursor-pointer text-md font-semibold mb-2 cursor-pointer text-nls-orange"> Analytics & Tracking </summary>
<ul class="list-disc list-inside text-gray-400"> <ul class="list-disc list-inside text-gray-400">
<li> <li>
<a <a