Initial AI Expert Roadmap

.gitignore

@@ -0,0 +1,10 @@
+.DS_Store
+._*
+Thumbs.db
+*.sublime-project
+*.sublime-workspace
+.idea
+node_modules
+/public/
+.vuepress/dist/
+deploy.md

.vuepress/components/Example.vue

@@ -0,0 +1,50 @@
+<script>
+export default {
+  functional: true,
+  render (h, { props, slots }) {
+    return h('div',
+      {
+        class: ['bs-docs-example']
+      },
+      [
+        slots().default
+      ]
+    )
+  }
+}
+</script>
+
+<style lang="stylus">
+    .bs-docs-example
+        position: relative;
+        margin: 15px 0;
+        padding: 39px 19px 14px;
+        background-color: #fff;
+        border: 1px solid #ddd;
+        border-radius: 4px;
+        > p 
+            margin: 0px;
+            > img
+                display: block;
+                margin-left: auto;
+                margin-right: auto;
+                max-width: 100%;
+                width: auto;
+                height: auto;
+                vertical-align: middle;
+                border: 0;
+    .bs-docs-example:after
+        content: "Example";
+        position: absolute;
+        top: -1px;
+        left: -1px;
+        padding: 3px 7px;
+        font-size: 12px;
+        font-weight: bold;
+        background-color: #f5f5f5;
+        border: 1px solid #ddd;
+        color: #9da0a4;
+        -webkit-border-radius: 4px 0 4px 0;
+        -moz-border-radius: 4px 0 4px 0;
+        border-radius: 4px 0 4px 0;
+</style>

.vuepress/components/Youtube.vue

@@ -0,0 +1,31 @@
+<script>
+export default {
+  functional: true,
+  render (h, { props, slots }) {
+    return h('div',
+      {
+        class: ['videoWrapper']
+      },
+      [
+        slots().default
+      ]
+    )
+  }
+}
+</script>
+
+<style lang="stylus">
+.videoWrapper {
+    position: relative;
+    padding-bottom: 56.25%; /* 16:9 */
+    padding-top: 25px;
+    height: 0;
+}
+.videoWrapper iframe {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+}
+</style>

.vuepress/config.js

@@ -0,0 +1,162 @@
+const container = require('markdown-it-container');
+const fs = require('fs');
+module.exports = {
+    title: 'AI Expert Roadmap',
+    description: 'The i.am.ai Experts Roadmap',
+    dest: 'public/roadmap',
+    base: '/roadmap/',
+    themeConfig: {
+        repo: 'https://github.com/AMAI-GmbH/AI-Expert-Roadmap',
+        docsDir: '.',
+        docsBranch: 'master',
+        editLinks: true,
+        editLinkText: 'Edit this page',
+        sidebarDepth: 1,
+        lastUpdated: 'Last Updated',
+        search: false,
+        sidebar: [
+            ['/', 'Roadmap'],
+            ['contributing.md', 'Contribution']
+        ],
+        nav: [
+            { text: 'AI Use Cases', link: 'https://i.am.ai/usecases', target:'_self' },
+            { text: 'AI Roadmap', link: '/' },
+            { text: 'AI Newsletter', link: 'https://i.am.ai/newsletter.html', target:'_self' },
+        ]
+    },
+    /* using this Google Analytics Plugin makes metomic's autoblock impossible
+    
+    plugins: {
+        '@vuepress/plugin-google-analytics': {
+            ga: 'UA-131730139-2'
+          },
+    }, */
+    /*plugins: {
+        '@vuepress/pwa': {xw
+            serviceWorker: true,
+            updatePopup: {
+                message: "Updated documentation is available.",
+                buttonText: "Refresh"
+            }
+        }
+    },*/
+
+    head: [
+        ['script', {
+            src: 'https://config.metomic.io/config.js?id=prj:c5c07948-cf96-4555-99ec-3a9bf5ae16ce', 
+            crossorigin: 'anonymous',
+            charset: 'utf-8'
+        }],
+        ['script', {
+            src: 'https://consent-manager.metomic.io/embed.js', 
+            crossorigin: 'anonymous',
+            charset: 'utf-8'
+        }],
+        ['script', {
+            async: true,
+            src: 'https://www.googletagmanager.com/gtag/js?id=UA-131730139-2'
+        }],
+        ['script', {}, `
+            window.dataLayer = window.dataLayer || [];
+            function gtag(){dataLayer.push(arguments);}
+            gtag('js', new Date());
+        
+            gtag('config', 'UA-131730139-2');
+        `],
+
+        ['link', {
+            rel: 'icon',
+            href: `/logos/icon-512x512.png`
+        }],
+        ['link', {
+            rel: 'manifest',
+            href: '/manifest.json'
+        }],
+        ['meta', {
+            name: 'theme-color',
+            content: '#1f6286'
+        }],
+        ['meta', {
+            name: 'apple-mobile-web-app-capable',
+            content: 'yes'
+        }],
+        ['meta', {
+            name: 'apple-mobile-web-app-status-bar-style',
+            content: 'black'
+        }],
+        ['link', {
+            rel: 'apple-touch-icon',
+            href: `/logos/icon-152x152.png`
+        }],
+        ['meta', {
+            name: 'msapplication-TileImage',
+            content: '/logos/icon-144x144.png'
+        }],
+        ['meta', {
+            name: 'msapplication-TileColor',
+            content: '#ffffff'
+        }],
+        ["meta", {
+            name: "Description",
+            content: "Follow these roadmaps to become an Artificial Intelligence expert."
+        }],
+        ["meta", {
+            property: "og:title",
+            content: "AI Roadmap"
+        }],
+        ["meta", {
+            property: "og:image",
+            content: "https://i.am.ai/img/banner/i-am-ai-banner-roadmap.png"
+        }],
+        ["meta", {
+            property: "og:description",
+            content: "Follow these roadmaps to become an Artificial Intelligence expert."
+        }],
+        ["meta", {
+            property: "og:url",
+            content: "https://i.am.ai/roadmap"
+        }],
+        ["meta", {
+            property: "og:type",
+            content: "website"
+        }],
+        ["meta", {
+            property: "og:site_name",
+            content: "AI Roadmap"
+        }],
+        ['link', { 
+            rel: "icon", 
+            type: "image/png", 
+            sizes: "32x32", 
+            href: "/Favicon.png"
+        }]
+
+    ],
+    extendMarkdown(md) {
+        // SVG embedding for clickable images
+        var defaultRender = md.renderer.rules.image;
+        md.renderer.rules.image = function (tokens, idx, options, env, self) {
+            var token = tokens[idx],
+                aIndex = token.attrIndex('src'),
+                url = token.attrs[aIndex][1];
+            if (url.startsWith("./") && url.endsWith(".svg")) {
+                var svg = fs.readFileSync(url, 'utf8');
+                svg = svg.replace(/<\?xml.+\?>|<!DOCTYPE.+>/g, '')
+                // make links open in new window
+                svg = svg.replace(/target=\"_blank\"/isg, "");
+                svg = svg.replace(/(<a[^<>]*xlink:href=['\"]?http[^<>]+)>/isg, "$1 target=\"_blank\">");
+                return svg;
+            }
+            return defaultRender(tokens, idx, options, env, self);
+        }
+
+        md.use(container, 'example', {
+            render: (tokens, idx) => tokens[idx].nesting === 1 ?
+                `<Example title="${tokens[idx].info.trim().slice('upgrade'.length).trim()}">` : '</Example>'
+        })
+        md.use(container, 'youtube', {
+            render: (tokens, idx) => tokens[idx].nesting === 1 ?
+                `<Youtube>` : '</Youtube>'
+        })
+    }
+}

.vuepress/public/manifest.json

@@ -0,0 +1,50 @@
+{
+  "name": "AI Expert Roadmap",
+  "theme_color": "#1f6286",
+  "background_color": "#fff",
+  "display": "fullscreen",
+  "Scope": "/",
+  "start_url": "/",
+  "icons": [
+    {
+      "src": "logos/icon-72x72.png",
+      "sizes": "72x72",
+      "type": "image/png"
+    },
+    {
+      "src": "logos/icon-96x96.png",
+      "sizes": "96x96",
+      "type": "image/png"
+    },
+    {
+      "src": "logos/icon-128x128.png",
+      "sizes": "128x128",
+      "type": "image/png"
+    },
+    {
+      "src": "logos/icon-144x144.png",
+      "sizes": "144x144",
+      "type": "image/png"
+    },
+    {
+      "src": "logos/icon-152x152.png",
+      "sizes": "152x152",
+      "type": "image/png"
+    },
+    {
+      "src": "logos/icon-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "logos/icon-384x384.png",
+      "sizes": "384x384",
+      "type": "image/png"
+    },
+    {
+      "src": "logos/icon-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ]
+}

.vuepress/styles/index.styl

@@ -0,0 +1,84 @@
+img, svg {
+  max-width: 100%;
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+img.inline
+  display: inline;
+
+.nav-item .icon.outbound {
+  display: none !important;
+}
+
+
+
+
+
+.navbar {
+  box-shadow: 0px 1px 10px 0px rgba(221,221,221,0.1);
+  top: 0px;
+  position: fixed;
+  z-index: 222;
+  width:100%;
+  padding-right: 0;
+
+
+  border-bottom: 0px solid;
+  border-color: lightgrey;
+  /*box-shadow: 0px 1px 10px 0px rgba(255,255,255,0.8); #white version*/
+
+}
+.navbar .container {
+  max-width: 2000px;
+}
+
+.home-link {
+  font-size: 2em;
+}
+
+.nav-links {
+  font-size: 1.1em;
+  margin: 0px 14px 0px 12px;
+
+}
+
+.nav-item a:hover {
+    background-color: #eeeeee55;
+    color: black;
+    box-shadow: 0px 3px 0px -1px #206287; /*amai blau 206287, neon blau 206287*/
+  }
+
+/* Style the active/current link*/
+.nav-item .router-link-active {
+  border-bottom: 0 !important;
+  box-shadow: 0px 6px 0px -1px #206287;
+  color: black;
+  font-weight: bold;
+  font-family: "DM Mono", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
+  Arial, sans-serif;
+}
+
+.nav-link, .repo-link {
+  padding: 0.5em 0.5em;
+}
+
+@media only screen and (max-width: 720px) {
+  .nav-links, .nav-item {
+    margin-left: 0;
+    padding-left:0 !important;
+  }
+  .nav-link {
+        padding: 0.35rem 1rem 0.35rem 1.25rem;
+  }
+  .nav-item .router-link-active {
+     box-shadow: 0 0 0 0 #ffffffff;
+     border-left: 0.25rem solid #1f6286;
+  }
+
+  .repo-link {
+    margin-left:0;
+    padding: 0.35rem 1rem 0.35rem 1.25rem !important;
+  }
+}