Use docusaurus for the site (#478)

.github/workflows/main.yml

@@ -20,10 +20,10 @@ jobs:
         with:
           fetch-depth: 0
 
-      - name: Set Node.js 14.x
+      - name: Set Node.js 16.x
         uses: actions/setup-node@main
         with:
-          node-version: 14.x
+          node-version: 16.x
 
       - name: Get yarn cache directory path
         id: yarn-cache-dir-path
@@ -56,10 +56,10 @@ jobs:
     steps:
       - uses: actions/checkout@main
 
-      - name: Set Node.js 14.x
+      - name: Set Node.js 16.x
         uses: actions/setup-node@main
         with:
-          node-version: 14.x
+          node-version: 16.x
 
       - name: Get yarn cache directory path
         id: yarn-cache-dir-path
@@ -86,10 +86,10 @@ jobs:
     steps:
       - uses: actions/checkout@main
 
-      - name: Set Node.js 14.x
+      - name: Set Node.js 16.x
         uses: actions/setup-node@main
         with:
-          node-version: 14.x
+          node-version: 16.x
 
       - name: Get yarn cache directory path
         id: yarn-cache-dir-path

.github/workflows/release.yml

@@ -15,10 +15,10 @@ jobs:
         with:
           fetch-depth: 0
 
-      - name: Setup Node.js 14.x
+      - name: Setup Node.js 16.x
         uses: actions/setup-node@main
         with:
-          node-version: 14.x
+          node-version: 16.x
 
       - name: Get yarn cache directory path
         id: yarn-cache-dir-path

.nvmrc

@@ -0,0 +1 @@
+16.16

package.json

@@ -20,11 +20,7 @@
     "site"
   ],
   "private": true,
-  "resolutions": {
-    "**/@babel/parser": "^7.7.7"
-  },
   "dependencies": {
-    "@babel/cli": "^7.7.7",
     "@babel/core": "^7.7.7",
     "@babel/parser": "^7.7.7",
     "@babel/plugin-proposal-class-properties": "^7.7.4",

site/.gitignore

@@ -0,0 +1,20 @@
+# Dependencies
+/node_modules
+
+# Production
+/build
+
+# Generated files
+.docusaurus
+.cache-loader
+
+# Misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

site/babel.config.js

@@ -0,0 +1,3 @@
+module.exports = {
+  presets: [require.resolve("@docusaurus/core/lib/babel/preset")],
+};

site/src/pages/dictionary.mdx → site/docs/dictionary.md

@@ -1,3 +1,7 @@
+---
+sidebar_position: 1
+---
+
 # Dictionary
 
 This page documents some common words and phrases that are used throughout this site and when discussing Preconstruct.

site/src/pages/guides/adding-a-second-entrypoint.mdx → site/docs/guides/adding-a-second-entrypoint.md

@@ -54,8 +54,8 @@ to get set up for development. Preconstruct's CLI will alert you to any problems
 
 For further documentation, we recommend reading:
 
-- [the package configuration options](/config/packages)
-- [the entrypoint package.json configuration options](/config/entrypoints)
+- [the package configuration options](/configuration#packages)
+- [the entrypoint package.json configuration options](/configuration#entrypoints)
 
 ### I don't have a `preconstruct` field in my package.json
 

site/src/pages/guides/index.mdx → site/docs/guides/index.md

@@ -1,3 +1,7 @@
+---
+sidebar_position: 4
+---
+
 # Guides
 
 Preconstruct's guides explain how to achieve common use cases in general terms, if you're looking for information about how to do achieve something with Preconstruct step-by-step, check out [Preconstruct's tutorials](/tutorials) instead.

site/src/pages/index.mdx → site/docs/index.md

@@ -1,3 +1,7 @@
+---
+sidebar_position: 0
+---
+
 # Introduction
 
 > Dev and build your code painlessly in monorepos

site/src/pages/tutorials/index.mdx → site/docs/tutorials/index.md

@@ -1,3 +1,7 @@
+---
+sidebar_position: 2
+---
+
 # Building your first package
 
 > A repository with the end result of this tutorial is available at https://github.com/preconstruct/a-random-number

site/src/pages/tutorials/monorepo.mdx → site/docs/tutorials/monorepo.md

@@ -1,10 +1,14 @@
+---
+sidebar_position: 3
+---
+
 # Building a Monorepo
 
 > **Note:** this tutorial builds upon knowledge in [the Getting Started tutorial](/tutorials) so if you haven't gone through it, you should do that first.
 
 We're going to setup a monorepo that uses Preconstruct to build its packages. We're also going to use [Yarn Workspaces](https://yarnpkg.com/en/docs/workspaces) for linking. Yarn Workspaces isn't the only monorepo linking tool that you can use with Preconstruct, [Lerna](https://github.com/lerna/lerna), [Bolt](https://github.com/boltpkg/bolt) and any other tool that does this will also work.
 
-We have our `a-random-number` package from the [the Getting Started guide](/getting-started) which is awesome but we want to create a new set of packages with some other numbers, `the-number-one` and `the-number-two`. We're going to use a monorepo to manage it because we want to be able to manage all our packages together.
+We have our `a-random-number` package from the [the Getting Started guide](/tutorials) which is awesome but we want to create a new set of packages with some other numbers, `the-number-one` and `the-number-two`. We're going to use a monorepo to manage it because we want to be able to manage all our packages together.
 
 ## Setting up Yarn Workspaces
 
@@ -99,7 +103,7 @@ yarn add -W @babel/core @babel/preset-env
 
 ```jsx
 module.exports = {
-  presets: ["@babel/preset-env"]
+  presets: ["@babel/preset-env"],
 };
 ```
 

site/src/pages/tutorials/multiple-entrypoints.mdx → site/docs/tutorials/multiple-entrypoints.md

@@ -1,3 +1,7 @@
+---
+sidebar_position: 4
+---
+
 # Exporting Multiple Entrypoints
 
 > **Note:** this tutorial builds upon [the Getting Started tutorial](/tutorials) so if you haven't gone through it, you should do that first.

site/docusaurus.config.js

@@ -0,0 +1,58 @@
+// @ts-check
+// Note: type annotations allow type checking and IDEs autocompletion
+
+const lightCodeTheme = require("prism-react-renderer/themes/github");
+const darkCodeTheme = require("prism-react-renderer/themes/dracula");
+
+/** @type {import('@docusaurus/types').Config} */
+const config = {
+  title: "Preconstruct",
+  // tagline: "Dinosaurs are cool",
+  url: "https://preconstruct.tools",
+  baseUrl: "/",
+  onBrokenLinks: "throw",
+  onBrokenMarkdownLinks: "throw",
+  favicon: "img/favicon.ico",
+  i18n: {
+    defaultLocale: "en",
+    locales: ["en"],
+  },
+
+  presets: [
+    [
+      "classic",
+      /** @type {import('@docusaurus/preset-classic').Options} */
+      ({
+        docs: {
+          routeBasePath: "/",
+          sidebarPath: require.resolve("./sidebars.js"),
+          // Please change this to your repo.
+          // Remove this to remove the "edit this page" links.
+          editUrl:
+            "https://github.com/preconstruct/preconstruct/tree/main/packages/create-docusaurus/templates/shared/",
+        },
+      }),
+    ],
+  ],
+  themeConfig:
+    /** @type {import('@docusaurus/preset-classic').ThemeConfig} */
+    ({
+      navbar: {
+        title: "Preconstruct",
+        logo: {
+          alt: "Preconstruct Logo",
+          src: "img/icon.png",
+        },
+        items: [
+          {
+            href: "https://github.com/preconstruct/preconstruct",
+            label: "GitHub",
+            position: "right",
+          },
+        ],
+      },
+      prism: { theme: lightCodeTheme, darkTheme: darkCodeTheme },
+    }),
+};
+
+module.exports = config;

site/package.json

@@ -1,29 +1,37 @@
 {
-  "private": true,
   "name": "@preconstruct/site",
-  "version": "1.0.0",
+  "version": "0.0.0",
+  "private": true,
   "scripts": {
-    "clean": "rm -rf node_modules .cache public",
-    "start": "gatsby develop",
-    "build": "gatsby build"
+    "start": "docusaurus start",
+    "build": "docusaurus build",
+    "clear": "docusaurus clear",
+    "serve": "docusaurus serve",
+    "write-translations": "docusaurus write-translations",
+    "write-heading-ids": "docusaurus write-heading-ids"
   },
   "dependencies": {
-    "@mdx-js/mdx": "^1.5.1",
-    "@mdx-js/react": "^1.5.1",
-    "gatsby": "^2.17.7",
-    "gatsby-plugin-emotion": "^4.1.13",
-    "gatsby-plugin-google-analytics": "^2.1.23",
-    "gatsby-plugin-manifest": "^2.2.26",
-    "gatsby-plugin-mdx": "^1.0.55",
-    "gatsby-plugin-page-creator": "^2.1.28",
-    "gatsby-plugin-typography": "^2.3.15",
-    "gatsby-source-filesystem": "^2.1.35",
-    "gatsby-theme-sidebar": "^0.0.2",
-    "prism-react-renderer": "^1.0.2",
-    "react": "^16.11.0",
-    "react-dom": "^16.11.0",
-    "react-typography": "^0.16.19",
-    "typography": "^0.16.19"
+    "@docusaurus/core": "2.0.0-beta.22",
+    "@docusaurus/preset-classic": "2.0.0-beta.22",
+    "@mdx-js/react": "^1.6.22",
+    "prism-react-renderer": "^1.3.5",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2"
+  },
+  "browserslist": {
+    "production": [
+      ">0.5%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "engines": {
+    "node": ">=16.14"
   },
   "repository": "https://github.com/preconstruct/preconstruct/tree/main/site"
 }

site/sidebars.js

@@ -0,0 +1,31 @@
+/**
+ * Creating a sidebar enables you to:
+ - create an ordered group of docs
+ - render a sidebar for each doc of that group
+ - provide next/previous navigation
+
+ The sidebars can be generated from the filesystem, or explicitly defined here.
+
+ Create as many sidebars as you want.
+ */
+
+// @ts-check
+
+/** @type {import('@docusaurus/plugin-content-docs').SidebarsConfig} */
+const sidebars = {
+  // By default, Docusaurus generates a sidebar from the docs folder structure
+  docs: [{ type: "autogenerated", dirName: "." }],
+
+  // But you can create a sidebar manually
+  /*
+  tutorialSidebar: [
+    {
+      type: 'category',
+      label: 'Tutorial',
+      items: ['hello'],
+    },
+  ],
+   */
+};
+
+module.exports = sidebars;