feat(docs): introduced initial version of api docs system (nodejs#2680)

Author: ovflowd

.babelrc

@@ -0,0 +1,32 @@
+{
+  "generatorOpts": {
+    "compact": true,
+    "comments": false
+  },
+  "overrides": [
+    {
+      "test": "**/**.md",
+      "compact": true
+    }
+  ],
+  "plugins": [
+    [
+      "prismjs",
+      {
+        "languages": ["js", "css", "jsx", "bash", "ts", "markup", "cpp", "c"],
+        "plugins": [],
+        "css": false
+      }
+    ]
+  ],
+  "presets": [
+    [
+      "babel-preset-gatsby",
+      {
+        "targets": {
+          "browsers": ["last 3 versions", "not ie <= 11", "not android 4.4.3"]
+        }
+      }
+    ]
+  ]
+}

apiUrls.js

@@ -0,0 +1,10 @@
+module.exports = {
+  apiReleaseContents: releaseVersion =>
+    `https://api.github.com/repos/nodejs/node/contents/doc/api?ref=${releaseVersion}`,
+  nvmTags: 'https://api.github.com/repos/nvm-sh/nvm/tags',
+  nodeReleaseSchedule:
+    'https://raw.githubusercontent.com/nodejs/Release/main/schedule.json',
+  nodeReleaseData: 'https://nodejs.org/dist/index.json',
+  nodeBannersData:
+    'https://raw.githubusercontent.com/nodejs/nodejs.org/main/locale/en/site.json',
+};

content/learn/node-introduction.en.md

@@ -35,7 +35,7 @@ The most common example Hello World of Node.js is a web server:
   style="height: 400px; width: 100%; border: 0;">
 </iframe>
 
-<!--```js
+```js
 const http = require('http')
 
 const hostname = '127.0.0.1'

firebase.json

@@ -20,11 +20,6 @@
     }
   ],
   "redirects": [
-    {
-      "source": "/en/get-involved/",
-      "destination": "/community/",
-      "type": "301"
-    },
     {
       "source": "/get-involved/",
       "destination": "/community/",

gatsby-config.js

@@ -1,3 +1,5 @@
+const path = require('path');
+
 require('dotenv').config();
 
 const config = require('./src/config.json');
@@ -21,7 +23,6 @@ const gatsbyConfig = {
     'gatsby-plugin-catch-links',
     '@skagami/gatsby-plugin-dark-mode',
     'gatsby-transformer-yaml',
-    'gatsby-remark-images',
     'gatsby-plugin-sharp',
     {
       resolve: 'gatsby-plugin-canonical-urls',
@@ -44,68 +45,65 @@ const gatsbyConfig = {
       resolve: 'gatsby-source-filesystem',
       options: {
         name: 'learn',
-        path: `${__dirname}/content/learn`,
+        path: path.resolve('./content/learn'),
       },
     },
     {
       resolve: 'gatsby-source-filesystem',
       options: {
         name: 'sites',
-        path: `${__dirname}/src/pages/`,
+        path: path.resolve('./src/pages'),
       },
     },
     {
       resolve: 'gatsby-source-filesystem',
       options: {
         name: 'homepage',
-        path: `${__dirname}/content/homepage`,
+        path: path.resolve('./content/homepage'),
       },
     },
     {
       resolve: 'gatsby-source-filesystem',
       options: {
         name: 'community',
-        path: `${__dirname}/content/community`,
+        path: path.resolve('./content/community'),
       },
     },
     {
       resolve: 'gatsby-source-filesystem',
       options: {
         name: 'blog',
-        path: `${__dirname}/content/blog`,
+        path: path.resolve('./content/blog'),
       },
     },
     {
       resolve: 'gatsby-source-filesystem',
       options: {
         name: 'data',
-        path: `${__dirname}/src/data`,
+        path: path.resolve('./src/data'),
       },
     },
     {
       resolve: 'gatsby-source-filesystem',
       options: {
         name: 'about',
-        path: `${__dirname}/content/about`,
+        path: path.resolve('./content/about'),
       },
     },
     {
       resolve: 'gatsby-source-filesystem',
       options: {
         name: 'download',
-        path: `${__dirname}/content/download`,
+        path: path.resolve('./content/download'),
       },
     },
     'gatsby-plugin-typescript',
     {
       resolve: 'gatsby-plugin-mdx',
       options: {
         extensions: ['.mdx', '.md'],
-        defaultLayouts: {
-          default: require.resolve(`./src/components/Layout/index.tsx`),
-        },
         gatsbyRemarkPlugins: [
-          'gatsby-remark-copy-linked-files',
+          { resolve: 'gatsby-remark-copy-linked-files' },
           {
             resolve: 'gatsby-remark-autolink-headers',
             options: {
@@ -138,17 +136,30 @@ const gatsbyConfig = {
     {
       resolve: `@gatsby-contrib/gatsby-plugin-elasticlunr-search`,
       options: {
-        fields: [`title`, `body`, `description`, `slug`],
+        fields: [
+          'slug',
+          'title',
+          'displayTitle',
+          'description',
+          'category',
+          'tableOfContents',
+        ],
         resolvers: {
           Mdx: {
             id: node => node.id,
             title: node => node.frontmatter.title,
-            body: node => node.rawBody,
+            displayTitle: node => node.frontmatter.displayTitle,
             description: node => node.frontmatter.description,
             slug: node => node.fields.slug,
+            category: node => node.fields.categoryName,
+            tableOfContents: node => {
+              return [...node.rawBody.matchAll(/^#{2,5} .*/gm)]
+                .map(match => match[0].replace(/^#{2,5} /, ''))
+                .join('\n');
+            },
           },
         },
-        filter: node => node.frontmatter.category === 'learn',
+        filter: node => ['api', 'learn'].includes(node.frontmatter.category),
       },
     },
     {
@@ -158,11 +169,39 @@ const gatsbyConfig = {
       resolve: `gatsby-theme-i18n`,
       options: {
         defaultLang: defaultLanguage,
-        configPath: `${__dirname}/src/i18n/config.json`,
+        configPath: path.resolve('./src/i18n/config.json'),
         prefixDefault: true,
         locales: localesAsString,
       },
     },
+    {
+      resolve: `gatsby-plugin-webfonts`,
+      options: {
+        fonts: {
+          google: [
+            {
+              family: 'Open Sans',
+              variants: [
+                '300',
+                '300i',
+                '400',
+                '400i',
+                '600',
+                '600i',
+                '900',
+                '900i',
+              ],
+              fontDisplay: 'swap',
+              strategy: 'selfHosted',
+            },
+          ],
+        },
+        formats: ['woff2'],
+        useMinify: true,
+        usePreload: true,
+        usePreconnect: true,
+      },
+    },
     {
       resolve: 'gatsby-plugin-manifest',
       options: {
@@ -191,13 +230,6 @@ if (!gatsbyConfig.pathPrefix) {
     // So we are able to use the official service worker again. This service worker supports latest Workbox
     resolve: 'gatsby-plugin-offline-next',
     options: {
-      precachePages: [
-        '/',
-        '/*/learn/*',
-        '/*/about/*',
-        '/*/download/*',
-        '/*/blog/*',
-      ],
       globPatterns: ['**/icon-path*'],
     },
   });